@ory/elements-react 0.0.0-pr.4a28a8f → 0.0.0-pr.7af5f16

package/dist/index.js

@@ -189,21 +189,32 @@ function nodesToAuthMethodGroups(nodes, excludeAuthMethods = []) {
     ].includes(group)
   );
 }
-function useNodesGroups(nodes) {
+function useNodesGroups(nodes, { omit } = {}) {
   const groupSorter = useGroupSorter();
   const groups = react.useMemo(() => {
-    var _a;
+    var _a, _b;
     const groups2 = {};
+    const groupRetained = {};
     for (const node of nodes) {
-      if (node.type === "script") {
-        continue;
-      }
       const groupNodes = (_a = groups2[node.group]) != null ? _a : [];
       groupNodes.push(node);
       groups2[node.group] = groupNodes;
+      if ((omit == null ? void 0 : omit.includes("script")) && clientFetch.isUiNodeScriptAttributes(node.attributes)) {
+        continue;
+      }
+      if ((omit == null ? void 0 : omit.includes("input_hidden")) && clientFetch.isUiNodeInputAttributes(node.attributes) && node.attributes.type === "hidden") {
+        continue;
+      }
+      groupRetained[node.group] = ((_b = groupRetained[node.group]) != null ? _b : 0) + 1;
+    }
+    const finalGroups = {};
+    for (const [group, count] of Object.entries(groupRetained)) {
+      if (count > 0) {
+        finalGroups[group] = groups2[group];
+      }
     }
-    return groups2;
-  }, [nodes]);
+    return finalGroups;
+  }, [nodes, omit]);
   const entries = react.useMemo(
     () => Object.entries(groups).sort(([a], [b]) => groupSorter(a, b)),
     [groups, groupSorter]
@@ -263,6 +274,8 @@ function parseStateFromFlow(flow) {
       break;
     case clientFetch.FlowType.Settings:
       return { current: "settings" };
+    case clientFetch.FlowType.OAuth2Consent:
+      return { current: "method_active", method: "oauth2_consent" };
   }
   console.warn(
     `[Ory/Elements React] Encountered an unknown form state on ${flow.flowType} flow with ID ${flow.flow.id}`
@@ -376,6 +389,22 @@ function computeDefaultValues(nodes) {
       if (attrs.name === "method" || attrs.type === "submit" || typeof attrs.value === "undefined") {
         return acc;
       }
+      if (attrs.name.startsWith("grant_scope")) {
+        const scope = attrs.value;
+        if (Array.isArray(acc.grant_scope)) {
+          return {
+            ...acc,
+            // We want to have all scopes accepted by default, so that the user has to actively uncheck them.
+            grant_scope: [...acc.grant_scope, scope]
+          };
+        } else if (!acc.grant_scope) {
+          return {
+            ...acc,
+            grant_scope: [scope]
+          };
+        }
+        return acc;
+      }
       return unrollTrait(
         {
           name: attrs.name,
@@ -825,6 +854,19 @@ function useOryFormSubmit(onAfterSubmit) {
         });
         break;
       }
+      case clientFetch.FlowType.OAuth2Consent: {
+        const response = await fetch(flowContainer.flow.ui.action, {
+          method: "POST",
+          body: JSON.stringify(data),
+          headers: {
+            "Content-Type": "application/json"
+          }
+        });
+        const oauth2Success = await response.json();
+        if (oauth2Success.redirect_to && typeof oauth2Success.redirect_to === "string") {
+          onRedirect(oauth2Success.redirect_to);
+        }
+      }
     }
     if ("password" in data) {
       methods.setValue("password", "");
@@ -839,7 +881,11 @@ function useOryFormSubmit(onAfterSubmit) {
   };
   return onSubmit;
 }
-function OryForm({ children, onAfterSubmit }) {
+function OryForm({
+  children,
+  onAfterSubmit,
+  "data-testid": dataTestId
+}) {
   const { Form } = useComponents();
   const flowContainer = useOryFlow();
   const methods = reactHookForm.useFormContext();
@@ -867,7 +913,7 @@ function OryForm({ children, onAfterSubmit }) {
       }),
       type: "error"
     };
-    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-8", "data-testid": dataTestId, children: [
       /* @__PURE__ */ jsxRuntime.jsx(Message.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(Message.Content, { message: m }, m.id) }),
       /* @__PURE__ */ jsxRuntime.jsx(OryCardFooter, {})
     ] });
@@ -878,6 +924,7 @@ function OryForm({ children, onAfterSubmit }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     Form.Root,
     {
+      "data-testid": dataTestId,
       action: flowContainer.flow.ui.action,
       method: flowContainer.flow.ui.method,
       onSubmit: (e) => void methods.handleSubmit(onSubmit)(e),
@@ -912,7 +959,7 @@ var NodeInput = ({
 }) => {
   var _a;
   const { Node: Node2 } = useComponents();
-  const { setValue } = reactHookForm.useFormContext();
+  const { setValue, watch } = reactHookForm.useFormContext();
   const {
     onloadTrigger,
     onclickTrigger,
@@ -925,7 +972,10 @@ var NodeInput = ({
   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)) {
+    if (isResendNode || isScreenSelectionNode || node.group === clientFetch.UiNodeGroupEnum.Oauth2Consent) {
+      return;
+    }
+    if (attrs.value !== void 0) {
       setValue(attrs.name, attrs.value);
     }
   };
@@ -950,6 +1000,19 @@ var NodeInput = ({
   };
   const isSocial = (attrs.name === "provider" || attrs.name === "link") && (node.group === clientFetch.UiNodeGroupEnum.Oidc || node.group === clientFetch.UiNodeGroupEnum.Saml);
   const isPinCodeInput = attrs.name === "code" && node.group === "code" || attrs.name === "totp_code" && node.group === "totp";
+  const handleScopeChange = (checked) => {
+    const scopes = watch("grant_scope");
+    if (Array.isArray(scopes)) {
+      if (checked) {
+        setValue("grant_scope", Array.from(/* @__PURE__ */ new Set([...scopes, attrs.value])));
+      } else {
+        setValue(
+          "grant_scope",
+          scopes.filter((scope) => scope !== attrs.value)
+        );
+      }
+    }
+  };
   switch (attributes.type) {
     case clientFetch.UiNodeInputAttributesTypeEnum.Submit:
     case clientFetch.UiNodeInputAttributesTypeEnum.Button:
@@ -959,6 +1022,9 @@ var NodeInput = ({
       if (isResendNode || isScreenSelectionNode) {
         return null;
       }
+      if (node.group === "oauth2_consent") {
+        return null;
+      }
       return /* @__PURE__ */ jsxRuntime.jsx(
         Node2.Label,
         {
@@ -970,6 +1036,21 @@ var NodeInput = ({
     case clientFetch.UiNodeInputAttributesTypeEnum.DatetimeLocal:
       throw new Error("Not implemented");
     case clientFetch.UiNodeInputAttributesTypeEnum.Checkbox:
+      if (node.group === "oauth2_consent" && node.attributes.node_type === "input") {
+        switch (node.attributes.name) {
+          case "grant_scope":
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              Node2.ConsentScopeCheckbox,
+              {
+                attributes: attrs,
+                node,
+                onCheckedChange: handleScopeChange
+              }
+            );
+          default:
+            return null;
+        }
+      }
       return /* @__PURE__ */ jsxRuntime.jsx(
         Node2.Label,
         {
@@ -1058,11 +1139,13 @@ function OryFormSocialButtonsForm() {
   const {
     flow: { ui }
   } = useOryFlow();
-  const filteredNodes = ui.nodes.filter((node) => node.group === clientFetch.UiNodeGroupEnum.Saml || node.group === clientFetch.UiNodeGroupEnum.Oidc);
+  const filteredNodes = ui.nodes.filter(
+    (node) => node.group === clientFetch.UiNodeGroupEnum.Saml || node.group === clientFetch.UiNodeGroupEnum.Oidc
+  );
   if (filteredNodes.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(OryFormProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(OryForm, { children: /* @__PURE__ */ jsxRuntime.jsx(OryFormOidcButtons, {}) }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(OryFormProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(OryForm, { "data-testid": `ory/form/methods/oidc-saml`, children: /* @__PURE__ */ jsxRuntime.jsx(OryFormOidcButtons, {}) }) });
 }
 function isUINodeGroupEnum(method) {
   return Object.values(clientFetch.UiNodeGroupEnum).includes(method);
@@ -1074,11 +1157,14 @@ function OryTwoStepCard() {
   const { ui } = flow;
   const nodeSorter = useNodeSorter();
   const sortNodes = (a, b) => nodeSorter(a, b, { flowType });
-  const uniqueGroups = useNodesGroups(ui.nodes);
-  const options = Object.fromEntries(
+  const groupsToShow = useNodesGroups(ui.nodes, {
+    // We only want to render groups that have visible elements.
+    omit: ["script", "input_hidden"]
+  });
+  const authMethodBlocks = Object.fromEntries(
     Object.values(clientFetch.UiNodeGroupEnum).filter((group) => {
       var _a2;
-      return (_a2 = uniqueGroups.groups[group]) == null ? void 0 : _a2.length;
+      return (_a2 = groupsToShow.groups[group]) == null ? void 0 : _a2.length;
     }).filter(
       (group) => ![
         clientFetch.UiNodeGroupEnum.Oidc,
@@ -1090,7 +1176,17 @@ function OryTwoStepCard() {
       ].includes(group)
     ).map((g) => [g, {}])
   );
-  if (clientFetch.UiNodeGroupEnum.Code in options) {
+  const authMethodAdditionalNodes = ui.nodes.filter(
+    ({ group }) => [
+      clientFetch.UiNodeGroupEnum.Oidc,
+      clientFetch.UiNodeGroupEnum.Saml,
+      clientFetch.UiNodeGroupEnum.Default,
+      clientFetch.UiNodeGroupEnum.IdentifierFirst,
+      clientFetch.UiNodeGroupEnum.Profile,
+      clientFetch.UiNodeGroupEnum.Captcha
+    ].includes(group)
+  );
+  if (clientFetch.UiNodeGroupEnum.Code in authMethodBlocks) {
     let identifier = (_b = (_a = findNode(ui.nodes, {
       group: "identifier_first",
       node_type: "input",
@@ -1102,7 +1198,7 @@ function OryTwoStepCard() {
       name: "address"
     })) == null ? void 0 : _c.attributes) == null ? void 0 : _d.value);
     if (identifier) {
-      options[clientFetch.UiNodeGroupEnum.Code] = {
+      authMethodBlocks[clientFetch.UiNodeGroupEnum.Code] = {
         title: {
           id: "identities.messages.1010023",
           values: { address: identifier }
@@ -1111,7 +1207,7 @@ function OryTwoStepCard() {
     }
   }
   const nonSsoNodes = removeSsoNodes(ui.nodes);
-  const finalNodes = formState.current === "method_active" ? getFinalNodes(uniqueGroups.groups, formState.method) : [];
+  const finalNodes = formState.current === "method_active" ? getFinalNodes(groupsToShow.groups, formState.method) : [];
   const handleAfterFormSubmit = (method) => {
     if (typeof method !== "string" || !isUINodeGroupEnum(method)) {
       return;
@@ -1140,39 +1236,49 @@ function OryTwoStepCard() {
     /* @__PURE__ */ jsxRuntime.jsxs(OryCardContent, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(OryCardValidationMessages, {}),
       showSso && /* @__PURE__ */ jsxRuntime.jsx(OryFormSocialButtonsForm, {}),
-      /* @__PURE__ */ jsxRuntime.jsxs(OryForm, { onAfterSubmit: handleAfterFormSubmit, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(Form.Group, { children: [
-          formState.current === "provide_identifier" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            showSsoDivider && /* @__PURE__ */ jsxRuntime.jsx(Card.Divider, {}),
-            nonSsoNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
-          ] }),
-          formState.current === "select_method" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Card.Divider, {}),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              AuthMethodList,
-              {
-                options,
-                setSelectedGroup: (group) => dispatchFormState({
-                  type: "action_select_method",
-                  method: group
-                })
-              }
-            ),
-            ui.nodes.filter((n) => n.group === clientFetch.UiNodeGroupEnum.Captcha).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
-          ] }),
-          formState.current === "method_active" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            ui.nodes.filter((n) => n.type === "script").map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)),
-            finalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(OryCardFooter, {})
-      ] })
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        OryForm,
+        {
+          "data-testid": `ory/form/methods/local`,
+          onAfterSubmit: handleAfterFormSubmit,
+          children: [
+            formState.current === "provide_identifier" && /* @__PURE__ */ jsxRuntime.jsxs(Form.Group, { children: [
+              showSsoDivider && /* @__PURE__ */ jsxRuntime.jsx(Card.Divider, {}),
+              nonSsoNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+            ] }),
+            formState.current === "select_method" && Object.entries(authMethodBlocks).length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(Form.Group, { children: [
+              Object.entries(authMethodBlocks).length > 0 && /* @__PURE__ */ jsxRuntime.jsx(Card.Divider, {}),
+              Object.entries(authMethodBlocks).length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+                AuthMethodList,
+                {
+                  options: authMethodBlocks,
+                  setSelectedGroup: (group) => dispatchFormState({
+                    type: "action_select_method",
+                    method: group
+                  })
+                }
+              ),
+              authMethodAdditionalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+            ] }),
+            formState.current === "method_active" && finalNodes.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(Form.Group, { children: [
+              ui.nodes.filter(
+                (n) => clientFetch.isUiNodeScriptAttributes(n.attributes) || n.group === clientFetch.UiNodeGroupEnum.Captcha || n.group === clientFetch.UiNodeGroupEnum.Default || n.group === clientFetch.UiNodeGroupEnum.Profile
+              ).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)),
+              finalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(OryCardFooter, {})
+          ]
+        }
+      )
     ] })
   ] });
 }
 function AuthMethodList({ options, setSelectedGroup }) {
   const { Card } = useComponents();
   const { setValue, getValues } = reactHookForm.useFormContext();
+  if (Object.entries(options).length === 0) {
+    return null;
+  }
   const handleClick = (group, options2) => {
     var _a, _b, _c, _d;
     if (isGroupImmediateSubmit(group)) {
@@ -1232,6 +1338,19 @@ function OryFormSectionInner({
     }
   );
 }
+function OryConsentCard() {
+  const { Form, Card } = useComponents();
+  const flow = useOryFlow();
+  return /* @__PURE__ */ jsxRuntime.jsxs(OryCard, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(OryCardHeader, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(OryCardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs(OryForm, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Card.Divider, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(Form.Group, { children: flow.flow.ui.nodes.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Card.Divider, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(OryCardFooter, {})
+    ] }) })
+  ] });
+}
 function OryFormGroupDivider() {
   const { Card } = useComponents();
   const {
@@ -1585,16 +1704,19 @@ function SettingsSectionContent({ group, nodes }) {
   const { Card } = useComponents();
   const intl = reactIntl.useIntl();
   const { flow } = useOryFlow();
-  const uniqueGroups = useNodesGroups(flow.ui.nodes);
+  const groupedNodes = useNodesGroups(flow.ui.nodes, {
+    // Script nodes are already handled by the parent component.
+    omit: ["script"]
+  });
   if (group === clientFetch.UiNodeGroupEnum.Totp) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       OryFormSection,
       {
-        nodes: uniqueGroups.groups.totp,
+        nodes: groupedNodes.groups.totp,
         "data-testid": "ory/screen/settings/group/totp",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsTotp, { nodes: (_a = uniqueGroups.groups.totp) != null ? _a : [] }),
-          (_b = uniqueGroups.groups.default) == null ? void 0 : _b.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsTotp, { nodes: (_a = groupedNodes.groups.totp) != null ? _a : [] }),
+          (_b = groupedNodes.groups.default) == null ? void 0 : _b.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
         ]
       }
     );
@@ -1603,16 +1725,16 @@ function SettingsSectionContent({ group, nodes }) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       OryFormSection,
       {
-        nodes: uniqueGroups.groups.lookup_secret,
+        nodes: groupedNodes.groups.lookup_secret,
         "data-testid": "ory/screen/settings/group/lookup_secret",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             OrySettingsRecoveryCodes,
             {
-              nodes: (_c = uniqueGroups.groups.lookup_secret) != null ? _c : []
+              nodes: (_c = groupedNodes.groups.lookup_secret) != null ? _c : []
             }
           ),
-          (_d = uniqueGroups.groups.default) == null ? void 0 : _d.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+          (_d = groupedNodes.groups.default) == null ? void 0 : _d.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
         ]
       }
     );
@@ -1621,11 +1743,11 @@ function SettingsSectionContent({ group, nodes }) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       OryFormSection,
       {
-        nodes: uniqueGroups.groups.oidc,
+        nodes: groupedNodes.groups.oidc,
         "data-testid": "ory/screen/settings/group/oidc",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsOidc, { nodes: (_e = uniqueGroups.groups.oidc) != null ? _e : [] }),
-          (_f = uniqueGroups.groups.default) == null ? void 0 : _f.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsOidc, { nodes: (_e = groupedNodes.groups.oidc) != null ? _e : [] }),
+          (_f = groupedNodes.groups.default) == null ? void 0 : _f.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
         ]
       }
     );
@@ -1634,11 +1756,11 @@ function SettingsSectionContent({ group, nodes }) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       OryFormSection,
       {
-        nodes: uniqueGroups.groups.webauthn,
+        nodes: groupedNodes.groups.webauthn,
         "data-testid": "ory/screen/settings/group/webauthn",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsWebauthn, { nodes: (_g = uniqueGroups.groups.webauthn) != null ? _g : [] }),
-          (_h = uniqueGroups.groups.default) == null ? void 0 : _h.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsWebauthn, { nodes: (_g = groupedNodes.groups.webauthn) != null ? _g : [] }),
+          (_h = groupedNodes.groups.default) == null ? void 0 : _h.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
         ]
       }
     );
@@ -1647,11 +1769,11 @@ function SettingsSectionContent({ group, nodes }) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       OryFormSection,
       {
-        nodes: uniqueGroups.groups.passkey,
+        nodes: groupedNodes.groups.passkey,
         "data-testid": "ory/screen/settings/group/passkey",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsPasskey, { nodes: (_i = uniqueGroups.groups.passkey) != null ? _i : [] }),
-          (_j = uniqueGroups.groups.default) == null ? void 0 : _j.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+          /* @__PURE__ */ jsxRuntime.jsx(OrySettingsPasskey, { nodes: (_i = groupedNodes.groups.passkey) != null ? _i : [] }),
+          (_j = groupedNodes.groups.default) == null ? void 0 : _j.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
         ]
       }
     );
@@ -1672,7 +1794,7 @@ function SettingsSectionContent({ group, nodes }) {
               id: `settings.${group}.description`
             }),
             children: [
-              (_k = uniqueGroups.groups.default) == null ? void 0 : _k.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)),
+              (_k = groupedNodes.groups.default) == null ? void 0 : _k.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)),
               nodes.filter(
                 (node) => "type" in node.attributes && node.attributes.type !== "submit"
               ).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
@@ -1686,16 +1808,16 @@ function SettingsSectionContent({ group, nodes }) {
     }
   );
 }
-var getScriptNode = (nodes) => nodes.find(
-  (node) => "id" in node.attributes && node.attributes.id === "webauthn_script"
+var onlyScriptNodes = (nodes) => nodes.filter(
+  (node) => clientFetch.isUiNodeScriptAttributes(node.attributes) && node.attributes.id === "webauthn_script"
 );
 function OrySettingsCard() {
   const { flow } = useOryFlow();
-  const uniqueGroups = useNodesGroups(flow.ui.nodes);
-  const scriptNode = getScriptNode(flow.ui.nodes);
+  const uniqueGroups = useNodesGroups(flow.ui.nodes, { omit: ["script"] });
+  const scriptNodes = onlyScriptNodes(flow.ui.nodes);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(OryCardValidationMessages, {}),
-    scriptNode && /* @__PURE__ */ jsxRuntime.jsx(Node, { node: scriptNode }),
+    scriptNodes.map((n) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node: n })),
     uniqueGroups.entries.map(([group, nodes]) => {
       if (group === clientFetch.UiNodeGroupEnum.Default) {
         return null;
@@ -2031,6 +2153,20 @@ var en_default = {
   "property.username": "username",
   "property.identifier": "identifier",
   "property.code": "code",
+  "consent.title": "Authorize {party}",
+  "consent.subtitle": "A third party application wants to access information associated with your account {identifier}.",
+  "consent.scope.openid.title": "Identity",
+  "consent.scope.openid.description": "Allows the application to verify your identity. This is required for authentication and a trusted login experience.",
+  "consent.scope.offline_access.title": "Offline Access",
+  "consent.scope.offline_access.description": "Allows this application to keep you signed in even when you're not actively using it.",
+  "consent.scope.profile.title": "Profile Information",
+  "consent.scope.profile.description": "Allows access to your basic profile details, including your username, first name, and last name.",
+  "consent.scope.email.title": "Email Address",
+  "consent.scope.email.description": "Retrieve your email address and its verification status.",
+  "consent.scope.address.title": "Physical Address",
+  "consent.scope.address.description": "Access your postal address.",
+  "consent.scope.phone.title": "Phone Number",
+  "consent.scope.phone.description": "Retrieve your phone number and its verification status.",
   "error.title.what-happened": "What happened?",
   "error.title.what-can-i-do": "What can I do?",
   "error.instructions": "Please try again in a few minutes or contact the website operator.",
@@ -2207,7 +2343,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",
@@ -2302,6 +2438,20 @@ var de_default = {
   "property.phone": "Telefon",
   "property.code": "Code",
   "property.username": "Benutzername",
+  "consent.title": "Autorisieren {party}",
+  "consent.subtitle": "Eine Drittanbieteranwendung m\xF6chte auf Informationen zugreifen, die mit Ihrem Konto {identifier} verkn\xFCpft sind.",
+  "consent.scope.openid.title": "Identit\xE4t",
+  "consent.scope.openid.description": "Erm\xF6glicht der Anwendung, Ihre Identit\xE4t zu \xFCberpr\xFCfen. Dies ist f\xFCr die Authentifizierung und eine vertrauensw\xFCrdige Login-Erfahrung erforderlich.",
+  "consent.scope.offline_access.title": "Offline-Zugriff",
+  "consent.scope.offline_access.description": "Erm\xF6glicht dieser Anwendung, Sie angemeldet zu lassen, auch wenn Sie sie nicht aktiv nutzen.",
+  "consent.scope.profile.title": "Profilinformationen",
+  "consent.scope.profile.description": "Erm\xF6glicht den Zugriff auf Ihre grundlegenden Profildetails, einschlie\xDFlich Ihres Benutzernamens, Vornamens und Nachnamens.",
+  "consent.scope.email.title": "E-Mail-Adresse",
+  "consent.scope.email.description": "Erm\xF6glicht den Abruf Ihrer E-Mail-Adresse und deren \xDCberpr\xFCfungsstatus.",
+  "consent.scope.address.title": "Physische Adresse",
+  "consent.scope.address.description": "Erm\xF6glicht den Zugriff auf Ihre Postanschrift.",
+  "consent.scope.phone.title": "Telefonnummer",
+  "consent.scope.phone.description": "Erm\xF6glicht den Abruf Ihrer Telefonnummer und deren \xDCberpr\xFCfungsstatus.",
   "error.title.what-happened": "Was ist passiert?",
   "error.footer.copy": "Kopieren",
   "error.footer.text": "Bitte f\xFCgen Sie bei der Meldung dieses Fehlers die folgenden Informationen hinzu:",
@@ -2573,6 +2723,20 @@ var es_default = {
   "property.password": "",
   "property.phone": "",
   "property.username": "",
+  "consent.title": "Autorizar {party}",
+  "consent.subtitle": "Una aplicaci\xF3n de terceros quiere acceder a la informaci\xF3n asociada a su cuenta {identifier}.",
+  "consent.scope.openid.title": "Identidad",
+  "consent.scope.openid.description": "Permite que la aplicaci\xF3n verifique su identidad. Esto es necesario para la autenticaci\xF3n y una experiencia de inicio de sesi\xF3n confiable.",
+  "consent.scope.offline_access.title": "Acceso sin conexi\xF3n",
+  "consent.scope.offline_access.description": "Permite que esta aplicaci\xF3n le mantenga conectado incluso cuando no la est\xE9 utilizando activamente.",
+  "consent.scope.profile.title": "Informaci\xF3n del perfil",
+  "consent.scope.profile.description": "Permite el acceso a los detalles b\xE1sicos de su perfil, incluyendo su nombre de usuario, nombre y apellido.",
+  "consent.scope.email.title": "Direcci\xF3n de correo electr\xF3nico",
+  "consent.scope.email.description": "Recupere su direcci\xF3n de correo electr\xF3nico y su estado de verificaci\xF3n.",
+  "consent.scope.address.title": "Direcci\xF3n f\xEDsica",
+  "consent.scope.address.description": "Acceda a su direcci\xF3n postal.",
+  "consent.scope.phone.title": "N\xFAmero de tel\xE9fono",
+  "consent.scope.phone.description": "Recupere su n\xFAmero de tel\xE9fono y su estado de verificaci\xF3n.",
   "error.action.go-back": "",
   "error.footer.copy": "",
   "error.footer.text": "",
@@ -2844,6 +3008,20 @@ var fr_default = {
   "property.password": "",
   "property.phone": "",
   "property.username": "",
+  "consent.title": "Autoriser {party}",
+  "consent.subtitle": "Une application tierce souhaite acc\xE9der aux informations associ\xE9es \xE0 votre compte {identifier}.",
+  "consent.scope.openid.title": "Identit\xE9",
+  "consent.scope.openid.description": "Permet \xE0 l'application de v\xE9rifier votre identit\xE9. Cela est n\xE9cessaire pour l'authentification et une exp\xE9rience de connexion fiable.",
+  "consent.scope.offline_access.title": "Acc\xE8s hors ligne",
+  "consent.scope.offline_access.description": "Permet \xE0 cette application de vous maintenir connect\xE9 m\xEAme lorsque vous ne l'utilisez pas activement.",
+  "consent.scope.profile.title": "Informations de profil",
+  "consent.scope.profile.description": "Permet l'acc\xE8s aux d\xE9tails de base de votre profil, y compris votre nom d'utilisateur, pr\xE9nom et nom.",
+  "consent.scope.email.title": "Adresse e-mail",
+  "consent.scope.email.description": "R\xE9cup\xE8re votre adresse e-mail et son statut de v\xE9rification.",
+  "consent.scope.address.title": "Adresse physique",
+  "consent.scope.address.description": "Acc\xE8de \xE0 votre adresse postale.",
+  "consent.scope.phone.title": "Num\xE9ro de t\xE9l\xE9phone",
+  "consent.scope.phone.description": "R\xE9cup\xE8re votre num\xE9ro de t\xE9l\xE9phone et son statut de v\xE9rification.",
   "error.action.go-back": "",
   "error.footer.copy": "",
   "error.footer.text": "",
@@ -3115,6 +3293,20 @@ var nl_default = {
   "property.password": "",
   "property.phone": "",
   "property.username": "",
+  "consent.title": "Autoriseren {party}",
+  "consent.subtitle": "Een derde partij applicatie wil toegang tot informatie die aan uw account {identifier} is gekoppeld.",
+  "consent.scope.openid.title": "Identiteit",
+  "consent.scope.openid.description": "Stelt de applicatie in staat uw identiteit te verifi\xEBren. Dit is vereist voor authenticatie en een betrouwbare inlogervaring.",
+  "consent.scope.offline_access.title": "Offline toegang",
+  "consent.scope.offline_access.description": "Stelt deze applicatie in staat u ingelogd te houden, zelfs wanneer u deze niet actief gebruikt.",
+  "consent.scope.profile.title": "Profielinformatie",
+  "consent.scope.profile.description": "Geeft toegang tot uw basisprofielgegevens, inclusief uw gebruikersnaam, voornaam en achternaam.",
+  "consent.scope.email.title": "E-mailadres",
+  "consent.scope.email.description": "Haal uw e-mailadres en de verificatiestatus ervan op.",
+  "consent.scope.address.title": "Fysiek adres",
+  "consent.scope.address.description": "Toegang tot uw postadres.",
+  "consent.scope.phone.title": "Telefoonnummer",
+  "consent.scope.phone.description": "Haal uw telefoonnummer en de verificatiestatus ervan op.",
   "error.action.go-back": "",
   "error.footer.copy": "",
   "error.footer.text": "",
@@ -3386,6 +3578,20 @@ var pl_default = {
   "property.phone": "",
   "property.username": "",
   "property.identifier": "",
+  "consent.title": "Autoryzuj {party}",
+  "consent.subtitle": "Aplikacja trzeciej strony chce uzyska\u0107 dost\u0119p do informacji powi\u0105zanych z Twoim kontem {identifier}.",
+  "consent.scope.openid.title": "To\u017Csamo\u015B\u0107",
+  "consent.scope.openid.description": "Pozwala aplikacji zweryfikowa\u0107 Twoj\u0105 to\u017Csamo\u015B\u0107. Jest to wymagane do uwierzytelniania i zapewnienia zaufanej sesji logowania.",
+  "consent.scope.offline_access.title": "Dost\u0119p offline",
+  "consent.scope.offline_access.description": "Pozwala aplikacji utrzyma\u0107 Twoje logowanie, nawet gdy nie korzystasz z niej aktywnie.",
+  "consent.scope.profile.title": "Informacje profilowe",
+  "consent.scope.profile.description": "Pozwala na dost\u0119p do podstawowych danych profilowych, w tym nazwy u\u017Cytkownika, imienia i nazwiska.",
+  "consent.scope.email.title": "Adres e-mail",
+  "consent.scope.email.description": "Pobierz sw\xF3j adres e-mail oraz status jego weryfikacji.",
+  "consent.scope.address.title": "Adres fizyczny",
+  "consent.scope.address.description": "Dost\u0119p do Twojego adresu pocztowego.",
+  "consent.scope.phone.title": "Numer telefonu",
+  "consent.scope.phone.description": "Pobierz sw\xF3j numer telefonu oraz status jego weryfikacji.",
   "error.action.go-back": "",
   "error.footer.copy": "",
   "error.footer.text": "",
@@ -3657,6 +3863,20 @@ var pt_default = {
   "property.password": "",
   "property.phone": "",
   "property.username": "",
+  "consent.title": "Autorizar {party}",
+  "consent.subtitle": "Um aplicativo de terceiros deseja acessar as informa\xE7\xF5es associadas \xE0 sua conta {identifier}.",
+  "consent.scope.openid.title": "Identidade",
+  "consent.scope.openid.description": "Permite que a aplica\xE7\xE3o verifique sua identidade. Isso \xE9 necess\xE1rio para a autentica\xE7\xE3o e uma experi\xEAncia de login confi\xE1vel.",
+  "consent.scope.offline_access.title": "Acesso Offline",
+  "consent.scope.offline_access.description": "Permite que este aplicativo mantenha voc\xEA conectado mesmo quando n\xE3o estiver usando-o ativamente.",
+  "consent.scope.profile.title": "Informa\xE7\xF5es do Perfil",
+  "consent.scope.profile.description": "Permite o acesso aos detalhes b\xE1sicos do seu perfil, incluindo seu nome de usu\xE1rio, primeiro nome e sobrenome.",
+  "consent.scope.email.title": "Endere\xE7o de E-mail",
+  "consent.scope.email.description": "Recupere seu endere\xE7o de e-mail e seu status de verifica\xE7\xE3o.",
+  "consent.scope.address.title": "Endere\xE7o F\xEDsico",
+  "consent.scope.address.description": "Acesse seu endere\xE7o postal.",
+  "consent.scope.phone.title": "N\xFAmero de Telefone",
+  "consent.scope.phone.description": "Recupere seu n\xFAmero de telefone e seu status de verifica\xE7\xE3o.",
   "error.action.go-back": "",
   "error.footer.copy": "",
   "error.footer.text": "",
@@ -3928,6 +4148,20 @@ var sv_default = {
   "property.username": "anv\xE4ndarnamn",
   "property.identifier": "identifier",
   "property.code": "kod",
+  "consent.title": "Auktorisera {party}",
+  "consent.subtitle": "En tredjepartsapplikation vill f\xE5 tillg\xE5ng till information kopplad till ditt konto {identifier}.",
+  "consent.scope.openid.title": "Identitet",
+  "consent.scope.openid.description": "G\xF6r det m\xF6jligt f\xF6r applikationen att verifiera din identitet. Detta kr\xE4vs f\xF6r autentisering och en p\xE5litlig inloggningsupplevelse.",
+  "consent.scope.offline_access.title": "Offline-\xE5tkomst",
+  "consent.scope.offline_access.description": "G\xF6r det m\xF6jligt f\xF6r denna applikation att h\xE5lla dig inloggad \xE4ven n\xE4r du inte aktivt anv\xE4nder den.",
+  "consent.scope.profile.title": "Profilinformation",
+  "consent.scope.profile.description": "Ger tillg\xE5ng till dina grundl\xE4ggande profiluppgifter, inklusive ditt anv\xE4ndarnamn, f\xF6rnamn och efternamn.",
+  "consent.scope.email.title": "E-postadress",
+  "consent.scope.email.description": "H\xE4mta din e-postadress och dess verifieringsstatus.",
+  "consent.scope.address.title": "Fysisk adress",
+  "consent.scope.address.description": "F\xE5 \xE5tkomst till din postadress.",
+  "consent.scope.phone.title": "Telefonnummer",
+  "consent.scope.phone.description": "H\xE4mta ditt telefonnummer och dess verifieringsstatus.",
   "error.action.go-back": "",
   "error.footer.copy": "",
   "error.footer.text": "",
@@ -3954,6 +4188,7 @@ exports.OryCardContent = OryCardContent;
 exports.OryCardFooter = OryCardFooter;
 exports.OryCardHeader = OryCardHeader;
 exports.OryCardValidationMessages = OryCardValidationMessages;
+exports.OryConsentCard = OryConsentCard;
 exports.OryForm = OryForm;
 exports.OryFormGroupDivider = OryFormGroupDivider;
 exports.OryFormGroups = OryFormGroups;