@ory/elements-react 1.0.0-next.30 → 1.0.0-next.31

package/dist/theme/default/index.mjs

@@ -135,7 +135,10 @@ function RegistrationCardFooter() {
   function handleScreenSelection() {
     setValue("method", "profile");
     if (screenSelectionNode) {
-      setValue("screen", "credential-selection");
+      setValue(
+        screenSelectionNode.attributes.name,
+        screenSelectionNode.attributes.value
+      );
     }
   }
   return /* @__PURE__ */ jsx4("span", { className: "font-normal leading-normal antialiased", children: formState.current === "method_active" ? /* @__PURE__ */ jsx4(Fragment, { children: screenSelectionNode && /* @__PURE__ */ jsx4(
@@ -143,6 +146,8 @@ function RegistrationCardFooter() {
     {
       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",
@@ -544,6 +549,10 @@ import {
   uiTextToFormattedMessage,
   useOryFlow as useOryFlow5
 } from "@ory/elements-react";
+import { useEffect } from "react";
+import { useFormContext as useFormContext2 } from "react-hook-form";
+import { useIntl as useIntl3 } from "react-intl";
+import { useDebounceValue } from "usehooks-ts";
 
 // src/theme/default/provider-logos/apple.svg
 import * as React4 from "react";
@@ -733,11 +742,6 @@ var logos = {
 };
 var provider_logos_default = logos;
 
-// src/theme/default/components/form/social.tsx
-import { useIntl as useIntl3 } from "react-intl";
-import { useEffect, useState } from "react";
-import { useFormContext as useFormContext2 } from "react-hook-form";
-
 // src/theme/default/components/form/spinner.tsx
 import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
 function Spinner({ className }) {
@@ -778,7 +782,7 @@ function Spinner({ className }) {
 }
 
 // src/theme/default/components/form/social.tsx
-import { jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
 function extractProvider(context) {
   if (context && typeof context === "object" && "provider" in context && typeof context.provider === "string") {
     return context.provider;
@@ -803,7 +807,7 @@ function DefaultButtonSocial({
   const {
     flow: { ui }
   } = useOryFlow5();
-  const [clicked, setClicked] = useState(false);
+  const [clicked, setClicked] = useDebounceValue(false, 100);
   const intl = useIntl3();
   const {
     formState: { isSubmitting }
@@ -813,14 +817,14 @@ function DefaultButtonSocial({
   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 : "";
   const localOnClick = () => {
-    setClicked(true);
     onClick == null ? void 0 : onClick();
+    setClicked(true);
   };
   useEffect(() => {
     if (!isSubmitting) {
       setClicked(false);
     }
-  }, [isSubmitting]);
+  }, [isSubmitting, setClicked]);
   return /* @__PURE__ */ jsxs19(
     "button",
     {
@@ -835,7 +839,10 @@ function DefaultButtonSocial({
       disabled: isSubmitting,
       children: [
         /* @__PURE__ */ jsx26("span", { className: "size-5 relative", children: !clicked ? Logo ? /* @__PURE__ */ jsx26(Logo, { size: 20 }) : /* @__PURE__ */ jsx26("span", { className: "flex aspect-square items-center justify-center rounded-[999px] border text-xs", children: provider.slice(0, 2) }) : /* @__PURE__ */ jsx26(Spinner, { className: "size-5" }) }),
-        showLabel && node.meta.label ? /* @__PURE__ */ jsx26("span", { className: "grow text-left font-medium leading-none text-button-social-foreground-default", children: uiTextToFormattedMessage(node.meta.label, intl) }) : null
+        showLabel && node.meta.label ? /* @__PURE__ */ jsxs19(Fragment2, { children: [
+          /* @__PURE__ */ jsx26("span", { className: "grow text-center font-medium leading-none text-button-social-foreground-default", children: uiTextToFormattedMessage(node.meta.label, intl) }),
+          /* @__PURE__ */ jsx26("span", { className: "size-5 block" })
+        ] }) : null
       ]
     }
   );
@@ -998,7 +1005,7 @@ import {
 import { cva } from "class-variance-authority";
 import { useFormContext as useFormContext3 } from "react-hook-form";
 import { useIntl as useIntl6 } from "react-intl";
-import { useEffect as useEffect2, useState as useState2 } from "react";
+import { useEffect as useEffect2, useState } from "react";
 import { jsx as jsx33, jsxs as jsxs21 } from "react/jsx-runtime";
 var buttonStyles = cva(
   [
@@ -1046,10 +1053,11 @@ var DefaultButton = ({
     autocomplete: _ignoredAutocomplete,
     label: _ignoredLabel,
     node_type: _ignoredNodeType,
+    maxlength: _ignoredMaxLength,
     // End of skipped attributes
     ...rest
   } = attributes;
-  const [clicked, setClicked] = useState2(false);
+  const [clicked, setClicked] = useState(false);
   const intl = useIntl6();
   const label = getNodeLabel(node);
   const {
@@ -1159,7 +1167,7 @@ var uiTextToFormattedMessage4 = ({ id, context = {}, text }, intl) => {
 };
 
 // src/theme/default/components/ui/checkbox-label.tsx
-import { Fragment as Fragment2, jsx as jsx34 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx34 } from "react/jsx-runtime";
 var linkRegex = /\[([^\]]+)\]\(([^)]+)\)/g;
 function computeLabelElements(labelText) {
   const elements = [];
@@ -1200,7 +1208,7 @@ function CheckboxLabel({ label }) {
     return null;
   }
   const labelText = uiTextToFormattedMessage4(label, intl);
-  return /* @__PURE__ */ jsx34(Fragment2, { children: computeLabelElements(labelText) });
+  return /* @__PURE__ */ jsx34(Fragment3, { children: computeLabelElements(labelText) });
 }
 
 // src/theme/default/components/form/checkbox.tsx
@@ -1596,21 +1604,35 @@ var DefaultFormSectionFooter = ({
 // src/theme/default/components/form/text.tsx
 import { uiTextToFormattedMessage as uiTextToFormattedMessage9 } from "@ory/elements-react";
 import { useIntl as useIntl12 } from "react-intl";
-import { Fragment as Fragment3, jsx as jsx45, jsxs as jsxs26 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx45, jsxs as jsxs26 } from "react/jsx-runtime";
 function DefaultText({ node, attributes }) {
   var _a;
   const intl = useIntl12();
-  return /* @__PURE__ */ jsxs26(Fragment3, { children: [
-    /* @__PURE__ */ jsx45("p", { "data-testid": `ory/form/node/text/${attributes.id}/label`, children: node.meta.label ? uiTextToFormattedMessage9(node.meta.label, intl) : "" }),
-    (_a = attributes.text.context.secrets) == null ? void 0 : _a.map((text, index) => /* @__PURE__ */ jsx45(
-      "pre",
-      {
-        "data-testid": `ory/form/node/text/lookup_secret_codes/text`,
-        children: /* @__PURE__ */ jsx45("code", { children: text ? uiTextToFormattedMessage9(text, intl) : "" })
-      },
-      index
-    ))
-  ] });
+  const lookup = (_a = attributes.text.context) == null ? void 0 : _a.secrets;
+  if (lookup) {
+    return /* @__PURE__ */ jsxs26(Fragment4, { children: [
+      /* @__PURE__ */ jsx45("p", { "data-testid": `ory/form/node/text/${attributes.id}/label`, children: node.meta.label ? uiTextToFormattedMessage9(node.meta.label, intl) : "" }),
+      lookup.map((text, index) => /* @__PURE__ */ jsx45(
+        "pre",
+        {
+          "data-testid": `ory/form/node/text/lookup_secret_codes/text`,
+          children: /* @__PURE__ */ jsx45("code", { children: text ? uiTextToFormattedMessage9(text, intl) : "" })
+        },
+        index
+      ))
+    ] });
+  }
+  return /* @__PURE__ */ jsx45(Fragment4, { children: /* @__PURE__ */ jsxs26(
+    "p",
+    {
+      "data-testid": `ory/form/node/text/${attributes.id}/label`,
+      id: attributes.id,
+      children: [
+        node.meta.label ? /* @__PURE__ */ jsx45("label", { children: uiTextToFormattedMessage9(node.meta.label, intl) }) : null,
+        attributes.text ? uiTextToFormattedMessage9(attributes.text, intl) : ""
+      ]
+    }
+  ) });
 }
 
 // src/theme/default/components/generic/page-header.tsx
@@ -1618,7 +1640,7 @@ import { useComponents as useComponents3 } from "@ory/elements-react";
 
 // src/theme/default/components/ui/user-menu.tsx
 import { DropdownMenuLabel as DropdownMenuLabel2 } from "@radix-ui/react-dropdown-menu";
-import { useCallback, useEffect as useEffect3, useState as useState3 } from "react";
+import { useCallback, useEffect as useEffect3, useState as useState2 } from "react";
 import { useOryFlow as useOryFlow10 } from "@ory/elements-react";
 
 // src/util/client.ts
@@ -1798,7 +1820,7 @@ import { jsx as jsx51, jsxs as jsxs28 } from "react/jsx-runtime";
 var UserMenu = ({ session }) => {
   const { config } = useOryFlow10();
   const initials = getUserInitials(session);
-  const [logoutFlow, setLogoutFlow] = useState3();
+  const [logoutFlow, setLogoutFlow] = useState2();
   const fetchLogoutFlow = useCallback(async () => {
     const flow = await frontendClient(config.sdk.url).createBrowserLogoutFlow();
     setLogoutFlow(flow);
@@ -1841,8 +1863,9 @@ var DefaultPageHeader = (_props) => {
 };
 
 // src/theme/default/components/settings/settings-oidc.tsx
-import { useEffect as useEffect4, useState as useState4 } from "react";
+import { useEffect as useEffect4 } from "react";
 import { useFormContext as useFormContext7 } from "react-hook-form";
+import { useDebounceValue as useDebounceValue2 } from "usehooks-ts";
 
 // src/theme/default/assets/icons/trash.svg
 import * as React26 from "react";
@@ -1886,27 +1909,25 @@ function DefaultSettingsOidc({
 }
 function UnlinkRow({ button }) {
   var _a, _b;
-  const [clicked, setClicked] = useState4(false);
+  const [clicked, setClicked] = useDebounceValue2(false, 100);
   const {
     formState: { isSubmitting }
   } = useFormContext7();
   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;
+  const Logo = provider_logos_default[attrs.value.split("-")[0]];
   const localOnClick = () => {
     button.onClick();
-    setTimeout(() => {
-      setClicked(true);
-    }, 100);
+    setClicked(true);
   };
   useEffect4(() => {
     if (!isSubmitting) {
       setClicked(false);
     }
-  }, [isSubmitting]);
+  }, [isSubmitting, setClicked]);
   return /* @__PURE__ */ jsxs30("div", { className: "flex justify-between", children: [
     /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-6", children: [
-      /* @__PURE__ */ jsx54(Logo, { size: 32 }),
+      Logo ? /* @__PURE__ */ jsx54(Logo, { size: 32 }) : /* @__PURE__ */ jsx54(provider_logos_default.generic, { size: 32 }),
       /* @__PURE__ */ jsx54("p", { className: "text-sm font-medium text-interface-foreground-default-secondary", children: provider })
     ] }),
     /* @__PURE__ */ jsx54(
@@ -1941,11 +1962,11 @@ function DefaultSettingsPasskey({
   const {
     formState: { isSubmitting }
   } = useFormContext8();
-  const { Node } = useComponents4();
+  const { Node: Node2 } = useComponents4();
   const hasRemoveButtons = removeButtons.length > 0;
   return /* @__PURE__ */ jsxs31("div", { className: "flex flex-col gap-8", children: [
     /* @__PURE__ */ jsx55("div", { className: "flex max-w-[60%] items-end gap-3", children: triggerButton && /* @__PURE__ */ jsx55(
-      Node.Button,
+      Node2.Button,
       {
         node: triggerButton,
         attributes: triggerButton.attributes,
@@ -2041,7 +2062,7 @@ var refresh_default = SvgRefresh;
 
 // src/theme/default/components/settings/settings-recovery-codes.tsx
 import { useFormContext as useFormContext9 } from "react-hook-form";
-import { Fragment as Fragment4, jsx as jsx59, jsxs as jsxs33 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx59, jsxs as jsxs33 } from "react/jsx-runtime";
 function DefaultSettingsRecoveryCodes({
   codes,
   regnerateButton,
@@ -2086,7 +2107,7 @@ function DefaultSettingsRecoveryCodes({
             )
           }
         ),
-        revealButton && /* @__PURE__ */ jsx59(Fragment4, { children: /* @__PURE__ */ jsx59(
+        revealButton && /* @__PURE__ */ jsx59(Fragment5, { children: /* @__PURE__ */ jsx59(
           "button",
           {
             ...revealButton.attributes,
@@ -2155,7 +2176,7 @@ function DefaultSettingsTotp({
   totpUnlink,
   onUnlink
 }) {
-  const { Node, Card } = useComponents5();
+  const { Node: Node2, Card } = useComponents5();
   const {
     formState: { isSubmitting }
   } = useFormContext10();
@@ -2195,7 +2216,7 @@ function DefaultSettingsTotp({
     return /* @__PURE__ */ jsxs34("div", { className: "grid grid-cols-1 gap-8 md:grid-cols-2", children: [
       /* @__PURE__ */ jsx61("div", { className: "col-span-full", children: /* @__PURE__ */ jsx61(DefaultHorizontalDivider, {}) }),
       /* @__PURE__ */ jsx61("div", { className: "flex justify-center rounded-cards bg-interface-background-default-secondary p-8", children: /* @__PURE__ */ jsx61("div", { className: "aspect-square h-44 rounded bg-[white]", children: /* @__PURE__ */ jsx61("div", { className: "-m-3 antialiased mix-blend-multiply", children: /* @__PURE__ */ jsx61(
-        Node.Image,
+        Node2.Image,
         {
           node: totpImage,
           attributes: {
@@ -2205,12 +2226,12 @@ function DefaultSettingsTotp({
       ) }) }) }),
       /* @__PURE__ */ jsxs34("div", { className: "flex flex-col gap-6", children: [
         /* @__PURE__ */ jsx61(
-          Node.Label,
+          Node2.Label,
           {
             node: totpSecret,
             attributes: totpSecret.attributes,
             children: /* @__PURE__ */ jsx61(
-              Node.Input,
+              Node2.Input,
               {
                 node: totpSecret,
                 attributes: {
@@ -2225,12 +2246,12 @@ function DefaultSettingsTotp({
           }
         ),
         /* @__PURE__ */ jsx61(
-          Node.Label,
+          Node2.Label,
           {
             attributes: totpInput.attributes,
             node: totpInput,
             children: /* @__PURE__ */ jsx61(
-              Node.CodeInput,
+              Node2.CodeInput,
               {
                 node: totpInput,
                 attributes: totpInput.attributes
@@ -2266,17 +2287,17 @@ function DefaultSettingsWebauthn({
   const {
     formState: { isSubmitting }
   } = useFormContext11();
-  const { Node, Card } = useComponents6();
+  const { Node: Node2, Card } = useComponents6();
   const hasRemoveButtons = removeButtons.length > 0;
   return /* @__PURE__ */ jsxs35("div", { className: "flex flex-col gap-8", children: [
     /* @__PURE__ */ jsxs35("div", { className: "flex md:max-w-96 sm:items-end gap-3 flex-col sm:flex-row", children: [
       /* @__PURE__ */ jsx63("div", { className: "flex-1", children: /* @__PURE__ */ jsx63(
-        Node.Label,
+        Node2.Label,
         {
           node: nameInput,
           attributes: nameInput.attributes,
           children: /* @__PURE__ */ jsx63(
-            Node.Input,
+            Node2.Input,
             {
               node: nameInput,
               attributes: nameInput.attributes
@@ -2285,7 +2306,7 @@ function DefaultSettingsWebauthn({
         }
       ) }),
       triggerButton ? /* @__PURE__ */ jsx63(
-        Node.Button,
+        Node2.Button,
         {
           node: triggerButton,
           attributes: triggerButton.attributes,
@@ -2358,9 +2379,418 @@ function DefaultAuthMethodListContainer({
   return /* @__PURE__ */ jsx64("div", { className: "grid grid-cols-1 gap-2", children });
 }
 
+// src/theme/default/components/form/captcha.tsx
+import { isUiNodeInputAttributes as isUiNodeInputAttributes7 } from "@ory/client-fetch";
+import { Turnstile } from "@marsidev/react-turnstile";
+import { useRef as useRef2 } from "react";
+import { useFormContext as useFormContext23 } from "react-hook-form";
+
+// src/context/component.tsx
+import {
+  isUiNodeInputAttributes as isUiNodeInputAttributes2,
+  UiNodeGroupEnum
+} from "@ory/client-fetch";
+import { createContext, useContext as useContext2 } from "react";
+import { jsx as jsx65 } from "react/jsx-runtime";
+var ComponentContext = createContext({
+  components: null,
+  // fine because we throw an error if it's not provided
+  nodeSorter: () => 0,
+  groupSorter: () => 0
+});
+function useComponents7() {
+  const ctx = useContext2(ComponentContext);
+  if (!ctx) {
+    throw new Error("useComponents must be used within a ComponentProvider");
+  }
+  return ctx.components;
+}
+var defaultGroupOrder = [
+  UiNodeGroupEnum.Default,
+  UiNodeGroupEnum.Profile,
+  UiNodeGroupEnum.Password,
+  UiNodeGroupEnum.Oidc,
+  UiNodeGroupEnum.Code,
+  UiNodeGroupEnum.LookupSecret,
+  UiNodeGroupEnum.Passkey,
+  UiNodeGroupEnum.Webauthn,
+  UiNodeGroupEnum.Totp
+];
+
+// src/context/flow-context.tsx
+import {
+  createContext as createContext2,
+  useContext as useContext3,
+  useState as useState3
+} from "react";
+
+// src/context/form-state.ts
+import { FlowType as FlowType8 } from "@ory/client-fetch";
+import { useReducer } from "react";
+
+// src/components/card/card-two-step.utils.ts
+import { UiNodeGroupEnum as UiNodeGroupEnum2 } from "@ory/client-fetch";
+
+// src/util/ui/index.ts
+import { UiNodeGroupEnum as UiNodeGroupEnum3 } from "@ory/client-fetch";
+import { useMemo } from "react";
+function triggerToWindowCall(trigger) {
+  if (!trigger) {
+    return;
+  }
+  const fn = triggerToFunction(trigger);
+  if (fn) {
+    fn();
+    return;
+  }
+  let i = 0;
+  const ms = 100;
+  const interval = setInterval(() => {
+    i++;
+    if (i > 100) {
+      clearInterval(interval);
+      throw new Error(
+        "Unable to load Ory's WebAuthn script. Is it being blocked or otherwise failing to load? If you are running an old version of Ory Elements, please upgrade. For more information, please check your browser's developer console."
+      );
+    }
+    const fn2 = triggerToFunction(trigger);
+    if (fn2) {
+      clearInterval(interval);
+      return fn2();
+    }
+  }, ms);
+  return;
+}
+function triggerToFunction(trigger) {
+  if (typeof window === "undefined") {
+    console.debug(
+      "The Ory SDK is missing a required function: window is undefined."
+    );
+    return void 0;
+  }
+  const typedWindow = window;
+  if (!(trigger in typedWindow) || !typedWindow[trigger]) {
+    console.debug(`The Ory SDK is missing a required function: ${trigger}.`);
+    return void 0;
+  }
+  const triggerFn = typedWindow[trigger];
+  if (typeof triggerFn !== "function") {
+    console.debug(
+      `The Ory SDK is missing a required function: ${trigger}. It is not a function.`
+    );
+    return void 0;
+  }
+  return triggerFn;
+}
+
+// src/context/flow-context.tsx
+import { jsx as jsx66 } from "react/jsx-runtime";
+var OryFlowContext = createContext2(null);
+
+// src/context/intl-context.tsx
+import { IntlProvider as OriginalIntlProvider } from "react-intl";
+
+// src/components/card/header.tsx
+import { jsx as jsx67 } from "react/jsx-runtime";
+
+// src/components/form/form-provider.tsx
+import { UiNodeGroupEnum as UiNodeGroupEnum5 } from "@ory/client-fetch";
+import { FormProvider, useForm as useForm2 } from "react-hook-form";
+
+// src/components/form/form-helpers.ts
+import { isUiNodeInputAttributes as isUiNodeInputAttributes3 } from "@ory/client-fetch";
+
+// src/components/form/form-resolver.ts
+import { isUiNodeInputAttributes as isUiNodeInputAttributes4 } from "@ory/client-fetch";
+
+// src/components/form/form-provider.tsx
+import { jsx as jsx68 } from "react/jsx-runtime";
+
+// src/components/card/card.tsx
+import { jsx as jsx69 } from "react/jsx-runtime";
+
+// src/components/card/footer.tsx
+import { jsx as jsx70 } from "react/jsx-runtime";
+
+// src/components/card/content.tsx
+import { jsx as jsx71 } from "react/jsx-runtime";
+
+// src/components/card/card-two-step.tsx
+import { UiNodeGroupEnum as UiNodeGroupEnum7 } from "@ory/client-fetch";
+import { useFormContext as useFormContext15 } from "react-hook-form";
+
+// src/components/form/form.tsx
+import {
+  isUiNodeAnchorAttributes,
+  isUiNodeImageAttributes,
+  isUiNodeInputAttributes as isUiNodeInputAttributes5,
+  isUiNodeScriptAttributes
+} from "@ory/client-fetch";
+import { useFormContext as useFormContext13 } from "react-hook-form";
+import { useIntl as useIntl13 } from "react-intl";
+
+// src/components/form/useOryFormSubmit.ts
+import {
+  FlowType as FlowType14
+} from "@ory/client-fetch";
+import { useFormContext as useFormContext12 } from "react-hook-form";
+
+// src/util/onSubmitLogin.ts
+import {
+  FlowType as FlowType9,
+  handleFlowError,
+  loginUrl
+} from "@ory/client-fetch";
+
+// src/util/onSubmitRecovery.ts
+import {
+  FlowType as FlowType10,
+  handleContinueWith,
+  handleFlowError as handleFlowError2,
+  instanceOfContinueWithRecoveryUi,
+  recoveryUrl
+} from "@ory/client-fetch";
+
+// src/util/onSubmitRegistration.ts
+import {
+  FlowType as FlowType11,
+  handleContinueWith as handleContinueWith2,
+  handleFlowError as handleFlowError3,
+  registrationUrl
+} from "@ory/client-fetch";
+
+// src/util/onSubmitSettings.ts
+import {
+  FlowType as FlowType12,
+  handleContinueWith as handleContinueWith3,
+  handleFlowError as handleFlowError4,
+  isResponseError,
+  loginUrl as loginUrl2,
+  settingsUrl
+} from "@ory/client-fetch";
+
+// src/util/onSubmitVerification.ts
+import {
+  FlowType as FlowType13,
+  handleFlowError as handleFlowError5,
+  verificationUrl
+} from "@ory/client-fetch";
+
+// src/components/form/form.tsx
+import { jsx as jsx72 } from "react/jsx-runtime";
+
+// src/components/form/messages.tsx
+import { jsx as jsx73 } from "react/jsx-runtime";
+
+// src/components/form/nodes/node.tsx
+import {
+  isUiNodeAnchorAttributes as isUiNodeAnchorAttributes2,
+  isUiNodeImageAttributes as isUiNodeImageAttributes2,
+  isUiNodeInputAttributes as isUiNodeInputAttributes6,
+  isUiNodeScriptAttributes as isUiNodeScriptAttributes2,
+  isUiNodeTextAttributes,
+  UiNodeGroupEnum as UiNodeGroupEnum6
+} from "@ory/client-fetch";
+import { jsx as jsx74 } from "react/jsx-runtime";
+
+// src/components/form/social.tsx
+import { useFormContext as useFormContext14 } from "react-hook-form";
+import { jsx as jsx75 } from "react/jsx-runtime";
+
+// src/components/card/card-two-step.tsx
+import { Fragment as Fragment6, jsx as jsx76, jsxs as jsxs36 } from "react/jsx-runtime";
+
+// src/components/form/groups.tsx
+import { jsx as jsx77 } from "react/jsx-runtime";
+
+// src/components/form/section.tsx
+import { useFormContext as useFormContext16 } from "react-hook-form";
+import { jsx as jsx78 } from "react/jsx-runtime";
+
+// src/components/generic/divider.tsx
+import { jsx as jsx79 } from "react/jsx-runtime";
+
+// src/components/generic/page-header.tsx
+import { jsx as jsx80 } from "react/jsx-runtime";
+
+// src/components/settings/settings-card.tsx
+import { UiNodeGroupEnum as UiNodeGroupEnum8 } from "@ory/client-fetch";
+import { useIntl as useIntl19 } from "react-intl";
+
+// src/components/settings/oidc-settings.tsx
+import { useIntl as useIntl14 } from "react-intl";
+import { useFormContext as useFormContext17 } from "react-hook-form";
+import { Fragment as Fragment7, jsx as jsx81, jsxs as jsxs37 } from "react/jsx-runtime";
+
+// src/components/settings/passkey-settings.tsx
+import { useFormContext as useFormContext18 } from "react-hook-form";
+import { useIntl as useIntl15 } from "react-intl";
+import { Fragment as Fragment8, jsx as jsx82, jsxs as jsxs38 } from "react/jsx-runtime";
+
+// src/components/settings/recovery-codes-settings.tsx
+import { useIntl as useIntl16 } from "react-intl";
+import { useFormContext as useFormContext19 } from "react-hook-form";
+import { Fragment as Fragment9, jsx as jsx83, jsxs as jsxs39 } from "react/jsx-runtime";
+
+// src/components/settings/totp-settings.tsx
+import { useFormContext as useFormContext20 } from "react-hook-form";
+import { useIntl as useIntl17 } from "react-intl";
+import { Fragment as Fragment10, jsx as jsx84, jsxs as jsxs40 } from "react/jsx-runtime";
+
+// src/components/settings/webauthn-settings.tsx
+import { useFormContext as useFormContext21 } from "react-hook-form";
+import { useIntl as useIntl18 } from "react-intl";
+import { Fragment as Fragment11, jsx as jsx85, jsxs as jsxs41 } from "react/jsx-runtime";
+
+// src/components/settings/settings-card.tsx
+import { Fragment as Fragment12, jsx as jsx86, jsxs as jsxs42 } from "react/jsx-runtime";
+
+// src/context/intl-context.tsx
+import { jsx as jsx87 } from "react/jsx-runtime";
+
+// src/context/provider.tsx
+import { jsx as jsx88 } from "react/jsx-runtime";
+
+// src/components/form/nodes/input.tsx
+import {
+  UiNodeInputAttributesTypeEnum
+} from "@ory/client-fetch";
+import { useEffect as useEffect5, useRef } from "react";
+import { useFormContext as useFormContext22 } from "react-hook-form";
+import { jsx as jsx89 } from "react/jsx-runtime";
+var NodeInput = ({
+  node,
+  attributes
+}) => {
+  var _a;
+  const { Node: Node2 } = useComponents7();
+  const { setValue } = useFormContext22();
+  const {
+    onloadTrigger,
+    onclickTrigger,
+    // These properties do not exist on input fields so we remove them (as we already have handled them).
+    onclick: _ignoredOnclick,
+    onload: _ignoredOnload,
+    //
+    ...attrs
+  } = attributes;
+  const isResendNode = ((_a = node.meta.label) == null ? void 0 : _a.id) === 1070008;
+  const isScreenSelectionNode = "name" in node.attributes && node.attributes.name === "screen";
+  const setFormValue = () => {
+    if (attrs.value && !(isResendNode || isScreenSelectionNode)) {
+      setValue(attrs.name, attrs.value);
+    }
+  };
+  const hasRun = useRef(false);
+  useEffect5(
+    () => {
+      setFormValue();
+      if (!hasRun.current && onloadTrigger) {
+        hasRun.current = true;
+        triggerToWindowCall(onloadTrigger);
+      }
+    },
+    // TODO(jonas): make sure onloadTrigger is stable
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- ignore onloadTrigger for now, until we make sure this is stable
+    []
+  );
+  const handleClick = () => {
+    setFormValue();
+    if (onclickTrigger) {
+      triggerToWindowCall(onclickTrigger);
+    }
+  };
+  const isSocial = (attrs.name === "provider" || attrs.name === "link") && node.group === "oidc";
+  const isPinCodeInput = attrs.name === "code" && node.group === "code" || attrs.name === "totp_code" && node.group === "totp";
+  switch (attributes.type) {
+    case UiNodeInputAttributesTypeEnum.Submit:
+    case UiNodeInputAttributesTypeEnum.Button:
+      if (isSocial) {
+        return null;
+      }
+      if (isResendNode || isScreenSelectionNode) {
+        return null;
+      }
+      return /* @__PURE__ */ jsx89(
+        Node2.Label,
+        {
+          attributes: { ...attrs, label: void 0 },
+          node: { ...node, meta: { ...node.meta, label: void 0 } },
+          children: /* @__PURE__ */ jsx89(Node2.Button, { attributes: attrs, node, onClick: handleClick })
+        }
+      );
+    case UiNodeInputAttributesTypeEnum.DatetimeLocal:
+      throw new Error("Not implemented");
+    case UiNodeInputAttributesTypeEnum.Checkbox:
+      return /* @__PURE__ */ jsx89(
+        Node2.Label,
+        {
+          attributes: { ...attrs, label: void 0 },
+          node: { ...node, meta: { ...node.meta, label: void 0 } },
+          children: /* @__PURE__ */ jsx89(Node2.Checkbox, { attributes: attrs, node, onClick: handleClick })
+        }
+      );
+    case UiNodeInputAttributesTypeEnum.Hidden:
+      return /* @__PURE__ */ jsx89(Node2.Input, { attributes: attrs, node, onClick: handleClick });
+    default:
+      if (isPinCodeInput) {
+        return /* @__PURE__ */ jsx89(Node2.Label, { attributes: attrs, node, children: /* @__PURE__ */ jsx89(
+          Node2.CodeInput,
+          {
+            attributes: attrs,
+            node,
+            onClick: handleClick
+          }
+        ) });
+      }
+      return /* @__PURE__ */ jsx89(Node2.Label, { attributes: attrs, node, children: /* @__PURE__ */ jsx89(Node2.Input, { attributes: attrs, node, onClick: handleClick }) });
+  }
+};
+
+// src/theme/default/components/form/captcha.tsx
+import { jsx as jsx90 } from "react/jsx-runtime";
+var DefaultCaptcha = ({ node }) => {
+  const { setValue } = useFormContext23();
+  const ref = useRef2();
+  const nodes = [];
+  if (isUiNodeInputAttributes7(node.attributes)) {
+    if (node.attributes.name === "transient_payload.captcha_turnstile_response") {
+      nodes.push(/* @__PURE__ */ jsx90(NodeInput, { node, attributes: node.attributes }, 1));
+    }
+  }
+  if (isUiNodeInputAttributes7(node.attributes) && node.attributes.name === "captcha_turnstile_options") {
+    const options = JSON.parse(node.attributes.value);
+    nodes.push(
+      /* @__PURE__ */ jsx90(
+        Turnstile,
+        {
+          ref,
+          siteKey: options.sitekey,
+          options: {
+            action: options.action,
+            size: "flexible",
+            theme: options.theme,
+            responseField: false,
+            responseFieldName: options.response_field_name
+          },
+          onExpire: () => {
+            var _a;
+            return (_a = ref.current) == null ? void 0 : _a.reset();
+          },
+          onSuccess: (token) => {
+            setValue(options.response_field_name, token);
+          }
+        },
+        2
+      )
+    );
+  }
+  return nodes;
+};
+
 // 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, _ga, _ha, _ia, _ja;
   return {
     Card: {
       Root: (_b = (_a = overrides == null ? void 0 : overrides.Card) == null ? void 0 : _a.Root) != null ? _b : DefaultCard,
@@ -2384,44 +2814,45 @@ function getOryComponents(overrides) {
       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
+      Anchor: (_N = (_M = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _M.Anchor) != null ? _N : DefaultLinkButton,
+      Captcha: (_P = (_O = overrides == null ? void 0 : overrides.Node) == null ? void 0 : _O.Captcha) != null ? _P : DefaultCaptcha
     },
     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: (_R = (_Q = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _Q.Root) != null ? _R : DefaultFormContainer,
+      Group: (_T = (_S = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _S.Group) != null ? _T : DefaultGroupContainer,
+      OidcRoot: (_V = (_U = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _U.OidcRoot) != null ? _V : DefaultSocialButtonContainer,
+      RecoveryCodesSettings: (_X = (_W = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _W.RecoveryCodesSettings) != null ? _X : DefaultSettingsRecoveryCodes,
+      TotpSettings: (_Z = (_Y = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _Y.TotpSettings) != null ? _Z : DefaultSettingsTotp,
+      OidcSettings: (_$ = (__ = overrides == null ? void 0 : overrides.Form) == null ? void 0 : __.OidcSettings) != null ? _$ : DefaultSettingsOidc,
+      WebauthnSettings: (_ba = (_aa = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _aa.WebauthnSettings) != null ? _ba : DefaultSettingsWebauthn,
+      PasskeySettings: (_da = (_ca = overrides == null ? void 0 : overrides.Form) == null ? void 0 : _ca.PasskeySettings) != null ? _da : 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: (_fa = (_ea = overrides == null ? void 0 : overrides.Message) == null ? void 0 : _ea.Root) != null ? _fa : DefaultMessageContainer,
+      Content: (_ha = (_ga = overrides == null ? void 0 : overrides.Message) == null ? void 0 : _ga.Content) != null ? _ha : DefaultMessage
     },
     Page: {
-      Header: (_ha = (_ga = overrides == null ? void 0 : overrides.Page) == null ? void 0 : _ga.Header) != null ? _ha : DefaultPageHeader
+      Header: (_ja = (_ia = overrides == null ? void 0 : overrides.Page) == null ? void 0 : _ia.Header) != null ? _ja : DefaultPageHeader
     }
   };
 }
 
 // src/theme/default/flows/error.tsx
-import { jsx as jsx65 } from "react/jsx-runtime";
-function Error({
+import { jsx as jsx91 } from "react/jsx-runtime";
+function Error2({
   error,
   children
 }) {
-  return /* @__PURE__ */ jsx65("div", { "data-testid": "ory/screen/error/raw", children: JSON.stringify(error) || children });
+  return /* @__PURE__ */ jsx91("div", { "data-testid": "ory/screen/error/raw", children: JSON.stringify(error) || children });
 }
 
 // src/theme/default/flows/login.tsx
-import { FlowType as FlowType8 } from "@ory/client-fetch";
+import { FlowType as FlowType15 } from "@ory/client-fetch";
 import {
   OryProvider,
-  OryTwoStepCard
+  OryTwoStepCard as OryTwoStepCard2
 } from "@ory/elements-react";
-import { jsx as jsx66 } from "react/jsx-runtime";
+import { jsx as jsx92 } from "react/jsx-runtime";
 function Login({
   flow,
   config,
@@ -2429,25 +2860,25 @@ function Login({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx66(
+  return /* @__PURE__ */ jsx92(
     OryProvider,
     {
       config,
       flow,
-      flowType: FlowType8.Login,
+      flowType: FlowType15.Login,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx66(OryTwoStepCard, {})
+      children: children != null ? children : /* @__PURE__ */ jsx92(OryTwoStepCard2, {})
     }
   );
 }
 
 // src/theme/default/flows/recovery.tsx
-import { FlowType as FlowType9 } from "@ory/client-fetch";
+import { FlowType as FlowType16 } from "@ory/client-fetch";
 import {
   OryProvider as OryProvider2,
-  OryTwoStepCard as OryTwoStepCard2
+  OryTwoStepCard as OryTwoStepCard3
 } from "@ory/elements-react";
-import { jsx as jsx67 } from "react/jsx-runtime";
+import { jsx as jsx93 } from "react/jsx-runtime";
 function Recovery({
   flow,
   config,
@@ -2455,25 +2886,25 @@ function Recovery({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx67(
+  return /* @__PURE__ */ jsx93(
     OryProvider2,
     {
       config,
       flow,
-      flowType: FlowType9.Recovery,
+      flowType: FlowType16.Recovery,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx67(OryTwoStepCard2, {})
+      children: children != null ? children : /* @__PURE__ */ jsx93(OryTwoStepCard3, {})
     }
   );
 }
 
 // src/theme/default/flows/registration.tsx
-import { FlowType as FlowType10 } from "@ory/client-fetch";
+import { FlowType as FlowType17 } from "@ory/client-fetch";
 import {
   OryProvider as OryProvider3,
-  OryTwoStepCard as OryTwoStepCard3
+  OryTwoStepCard as OryTwoStepCard4
 } from "@ory/elements-react";
-import { jsx as jsx68 } from "react/jsx-runtime";
+import { jsx as jsx94 } from "react/jsx-runtime";
 function Registration({
   flow,
   children,
@@ -2481,26 +2912,26 @@ function Registration({
   config
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx68(
+  return /* @__PURE__ */ jsx94(
     OryProvider3,
     {
       config,
       flow,
-      flowType: FlowType10.Registration,
+      flowType: FlowType17.Registration,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx68(OryTwoStepCard3, {})
+      children: children != null ? children : /* @__PURE__ */ jsx94(OryTwoStepCard4, {})
     }
   );
 }
 
 // src/theme/default/flows/settings.tsx
-import { FlowType as FlowType11 } from "@ory/client-fetch";
+import { FlowType as FlowType18 } from "@ory/client-fetch";
 import {
   HeadlessPageHeader,
   OryProvider as OryProvider4,
   OrySettingsCard
 } from "@ory/elements-react";
-import { Fragment as Fragment5, jsx as jsx69, jsxs as jsxs36 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx95, jsxs as jsxs43 } from "react/jsx-runtime";
 function Settings({
   flow,
   config,
@@ -2508,28 +2939,28 @@ function Settings({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx69(
+  return /* @__PURE__ */ jsx95(
     OryProvider4,
     {
       config,
       flow,
-      flowType: FlowType11.Settings,
+      flowType: FlowType18.Settings,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsxs36(Fragment5, { children: [
-        /* @__PURE__ */ jsx69(HeadlessPageHeader, {}),
-        /* @__PURE__ */ jsx69(OrySettingsCard, {})
+      children: children != null ? children : /* @__PURE__ */ jsxs43(Fragment13, { children: [
+        /* @__PURE__ */ jsx95(HeadlessPageHeader, {}),
+        /* @__PURE__ */ jsx95(OrySettingsCard, {})
       ] })
     }
   );
 }
 
 // src/theme/default/flows/verification.tsx
-import { FlowType as FlowType12 } from "@ory/client-fetch";
+import { FlowType as FlowType19 } from "@ory/client-fetch";
 import {
   OryProvider as OryProvider5,
-  OryTwoStepCard as OryTwoStepCard4
+  OryTwoStepCard as OryTwoStepCard5
 } from "@ory/elements-react";
-import { jsx as jsx70 } from "react/jsx-runtime";
+import { jsx as jsx96 } from "react/jsx-runtime";
 function Verification({
   flow,
   config,
@@ -2537,14 +2968,14 @@ function Verification({
   components: flowOverrideComponents
 }) {
   const components = getOryComponents(flowOverrideComponents);
-  return /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx96(
     OryProvider5,
     {
       config,
       flow,
-      flowType: FlowType12.Verification,
+      flowType: FlowType19.Verification,
       components,
-      children: children != null ? children : /* @__PURE__ */ jsx70(OryTwoStepCard4, {})
+      children: children != null ? children : /* @__PURE__ */ jsx96(OryTwoStepCard5, {})
     }
   );
 }
@@ -2560,7 +2991,7 @@ export {
   DefaultFormContainer,
   DefaultMessage,
   DefaultMessageContainer,
-  Error,
+  Error2 as Error,
   Login,
   Recovery,
   Registration,