diff --git a/package-lock.json b/package-lock.json
index 4a204863f..82f0c2159 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2966,6 +2966,96 @@
"dev": true,
"license": "0BSD"
},
+ "node_modules/@emotion/babel-plugin": {
+ "version": "11.12.0",
+ "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.12.0.tgz",
+ "integrity": "sha512-y2WQb+oP8Jqvvclh8Q55gLUyb7UFvgv7eJfsj7td5TToBrIUtPay2kMrZi4xjq9qw2vD0ZR5fSho0yqoFgX7Rw==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/helper-module-imports": "^7.16.7",
+ "@babel/runtime": "^7.18.3",
+ "@emotion/hash": "^0.9.2",
+ "@emotion/memoize": "^0.9.0",
+ "@emotion/serialize": "^1.2.0",
+ "babel-plugin-macros": "^3.1.0",
+ "convert-source-map": "^1.5.0",
+ "escape-string-regexp": "^4.0.0",
+ "find-root": "^1.1.0",
+ "source-map": "^0.5.7",
+ "stylis": "4.2.0"
+ }
+ },
+ "node_modules/@emotion/babel-plugin/node_modules/babel-plugin-macros": {
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz",
+ "integrity": "sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/runtime": "^7.12.5",
+ "cosmiconfig": "^7.0.0",
+ "resolve": "^1.19.0"
+ },
+ "engines": {
+ "node": ">=10",
+ "npm": ">=6"
+ }
+ },
+ "node_modules/@emotion/babel-plugin/node_modules/cosmiconfig": {
+ "version": "7.1.0",
+ "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz",
+ "integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@types/parse-json": "^4.0.0",
+ "import-fresh": "^3.2.1",
+ "parse-json": "^5.0.0",
+ "path-type": "^4.0.0",
+ "yaml": "^1.10.0"
+ },
+ "engines": {
+ "node": ">=10"
+ }
+ },
+ "node_modules/@emotion/babel-plugin/node_modules/escape-string-regexp": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
+ "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=10"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/sindresorhus"
+ }
+ },
+ "node_modules/@emotion/babel-plugin/node_modules/source-map": {
+ "version": "0.5.7",
+ "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+ "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==",
+ "dev": true,
+ "license": "BSD-3-Clause",
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
+ "node_modules/@emotion/cache": {
+ "version": "11.13.1",
+ "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.13.1.tgz",
+ "integrity": "sha512-iqouYkuEblRcXmylXIwwOodiEK5Ifl7JcX7o6V4jI3iW4mLXX3dmt5xwBtIkJiQEXFAI+pC8X0i67yiPkH9Ucw==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@emotion/memoize": "^0.9.0",
+ "@emotion/sheet": "^1.4.0",
+ "@emotion/utils": "^1.4.0",
+ "@emotion/weak-memoize": "^0.4.0",
+ "stylis": "4.2.0"
+ }
+ },
"node_modules/@emotion/hash": {
"version": "0.9.2",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz",
@@ -2973,6 +3063,124 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/@emotion/is-prop-valid": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.0.tgz",
+ "integrity": "sha512-SHetuSLvJDzuNbOdtPVbq6yMMMlLoW5Q94uDqJZqy50gcmAjxFkVqmzqSGEFq9gT2iMuIeKV1PXVWmvUhuZLlQ==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@emotion/memoize": "^0.9.0"
+ }
+ },
+ "node_modules/@emotion/memoize": {
+ "version": "0.9.0",
+ "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz",
+ "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==",
+ "dev": true,
+ "license": "MIT"
+ },
+ "node_modules/@emotion/react": {
+ "version": "11.13.3",
+ "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz",
+ "integrity": "sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/runtime": "^7.18.3",
+ "@emotion/babel-plugin": "^11.12.0",
+ "@emotion/cache": "^11.13.0",
+ "@emotion/serialize": "^1.3.1",
+ "@emotion/use-insertion-effect-with-fallbacks": "^1.1.0",
+ "@emotion/utils": "^1.4.0",
+ "@emotion/weak-memoize": "^0.4.0",
+ "hoist-non-react-statics": "^3.3.1"
+ },
+ "peerDependencies": {
+ "react": ">=16.8.0"
+ },
+ "peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@emotion/serialize": {
+ "version": "1.3.1",
+ "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.1.tgz",
+ "integrity": "sha512-dEPNKzBPU+vFPGa+z3axPRn8XVDetYORmDC0wAiej+TNcOZE70ZMJa0X7JdeoM6q/nWTMZeLpN/fTnD9o8MQBA==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@emotion/hash": "^0.9.2",
+ "@emotion/memoize": "^0.9.0",
+ "@emotion/unitless": "^0.10.0",
+ "@emotion/utils": "^1.4.0",
+ "csstype": "^3.0.2"
+ }
+ },
+ "node_modules/@emotion/sheet": {
+ "version": "1.4.0",
+ "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz",
+ "integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==",
+ "dev": true,
+ "license": "MIT"
+ },
+ "node_modules/@emotion/styled": {
+ "version": "11.13.0",
+ "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.13.0.tgz",
+ "integrity": "sha512-tkzkY7nQhW/zC4hztlwucpT8QEZ6eUzpXDRhww/Eej4tFfO0FxQYWRyg/c5CCXa4d/f174kqeXYjuQRnhzf6dA==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/runtime": "^7.18.3",
+ "@emotion/babel-plugin": "^11.12.0",
+ "@emotion/is-prop-valid": "^1.3.0",
+ "@emotion/serialize": "^1.3.0",
+ "@emotion/use-insertion-effect-with-fallbacks": "^1.1.0",
+ "@emotion/utils": "^1.4.0"
+ },
+ "peerDependencies": {
+ "@emotion/react": "^11.0.0-rc.0",
+ "react": ">=16.8.0"
+ },
+ "peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@emotion/unitless": {
+ "version": "0.10.0",
+ "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz",
+ "integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==",
+ "dev": true,
+ "license": "MIT"
+ },
+ "node_modules/@emotion/use-insertion-effect-with-fallbacks": {
+ "version": "1.1.0",
+ "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.1.0.tgz",
+ "integrity": "sha512-+wBOcIV5snwGgI2ya3u99D7/FJquOIniQT1IKyDsBmEgwvpxMNeS65Oib7OnE2d2aY+3BU4OiH+0Wchf8yk3Hw==",
+ "dev": true,
+ "license": "MIT",
+ "peerDependencies": {
+ "react": ">=16.8.0"
+ }
+ },
+ "node_modules/@emotion/utils": {
+ "version": "1.4.0",
+ "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.0.tgz",
+ "integrity": "sha512-spEnrA1b6hDR/C68lC2M7m6ALPUHZC0lIY7jAS/B/9DuuO1ZP04eov8SMv/6fwRd8pzmsn2AuJEznRREWlQrlQ==",
+ "dev": true,
+ "license": "MIT"
+ },
+ "node_modules/@emotion/weak-memoize": {
+ "version": "0.4.0",
+ "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz",
+ "integrity": "sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/@esbuild/aix-ppc64": {
"version": "0.23.1",
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.23.1.tgz",
@@ -3913,6 +4121,37 @@
"@hapi/hoek": "^9.0.0"
}
},
+ "node_modules/@hookform/devtools": {
+ "version": "4.3.1",
+ "resolved": "https://registry.npmjs.org/@hookform/devtools/-/devtools-4.3.1.tgz",
+ "integrity": "sha512-CrWxEoHQZaOXJZVQ8KBgOuAa8p2LI8M0DAN5GTRTmdCieRwFVjVDEmuTAVazWVRRkpEQSgSt3KYp7VmmqXdEnw==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@emotion/react": "^11.1.5",
+ "@emotion/styled": "^11.3.0",
+ "@types/lodash": "^4.14.168",
+ "little-state-machine": "^4.1.0",
+ "lodash": "^4.17.21",
+ "react-simple-animate": "^3.3.12",
+ "use-deep-compare-effect": "^1.8.1",
+ "uuid": "^8.3.2"
+ },
+ "peerDependencies": {
+ "react": "^16.8.0 || ^17 || ^18",
+ "react-dom": "^16.8.0 || ^17 || ^18"
+ }
+ },
+ "node_modules/@hookform/devtools/node_modules/uuid": {
+ "version": "8.3.2",
+ "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+ "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+ "dev": true,
+ "license": "MIT",
+ "bin": {
+ "uuid": "dist/bin/uuid"
+ }
+ },
"node_modules/@humanwhocodes/config-array": {
"version": "0.11.14",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
@@ -20407,6 +20646,13 @@
"node": ">=8"
}
},
+ "node_modules/find-root": {
+ "version": "1.1.0",
+ "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
+ "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/find-up": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
@@ -25439,6 +25685,16 @@
"node": "^12.20.0 || ^14.13.1 || >=16.0.0"
}
},
+ "node_modules/little-state-machine": {
+ "version": "4.8.0",
+ "resolved": "https://registry.npmjs.org/little-state-machine/-/little-state-machine-4.8.0.tgz",
+ "integrity": "sha512-xfi5+iDxTLhu0hbnNubUs+qoQQqxhtEZeObP5ELjUlHnl74bbasY7mOonsGQrAouyrbag3ebNLSse5xX1T7buQ==",
+ "dev": true,
+ "license": "MIT",
+ "peerDependencies": {
+ "react": "^16.8.0 || ^17 || ^18"
+ }
+ },
"node_modules/load-tsconfig": {
"version": "0.2.5",
"resolved": "https://registry.npmjs.org/load-tsconfig/-/load-tsconfig-0.2.5.tgz",
@@ -28387,6 +28643,16 @@
"react-dom": ">=16.8"
}
},
+ "node_modules/react-simple-animate": {
+ "version": "3.5.2",
+ "resolved": "https://registry.npmjs.org/react-simple-animate/-/react-simple-animate-3.5.2.tgz",
+ "integrity": "sha512-xLE65euP920QMTOmv5haPlml+hmOPDkbIr5WeF7ADIXWBYt5kW/vwpNfWg8EKMab8aeDxIZ6QjffVh8v2dUyhg==",
+ "dev": true,
+ "license": "Mit",
+ "peerDependencies": {
+ "react-dom": "^16.8.0 || ^17 || ^18"
+ }
+ },
"node_modules/react-spa": {
"resolved": "examples/react-spa",
"link": true
@@ -29976,6 +30242,13 @@
}
}
},
+ "node_modules/stylis": {
+ "version": "4.2.0",
+ "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz",
+ "integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/sucrase": {
"version": "3.35.0",
"resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz",
@@ -32019,6 +32292,24 @@
"requires-port": "^1.0.0"
}
},
+ "node_modules/use-deep-compare-effect": {
+ "version": "1.8.1",
+ "resolved": "https://registry.npmjs.org/use-deep-compare-effect/-/use-deep-compare-effect-1.8.1.tgz",
+ "integrity": "sha512-kbeNVZ9Zkc0RFGpfMN3MNfaKNvcLNyxOAAd9O4CBZ+kCBXXscn9s/4I+8ytUER4RDpEYs5+O6Rs4PqiZ+rHr5Q==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/runtime": "^7.12.5",
+ "dequal": "^2.0.2"
+ },
+ "engines": {
+ "node": ">=10",
+ "npm": ">=6"
+ },
+ "peerDependencies": {
+ "react": ">=16.13"
+ }
+ },
"node_modules/util": {
"version": "0.12.5",
"resolved": "https://registry.npmjs.org/util/-/util-0.12.5.tgz",
@@ -33576,7 +33867,7 @@
"version": "1.0.0-next.6",
"license": "Apache License 2.0",
"dependencies": {
- "@ory/client-fetch": "1.15.3",
+ "@ory/client-fetch": "^1.15.0-next.0",
"clsx": "2.1.1",
"input-otp": "1.2.4",
"react-hook-form": "7.52.1",
@@ -33584,6 +33875,7 @@
"tailwind-merge": "2.4.0"
},
"devDependencies": {
+ "@hookform/devtools": "^4.3.1",
"@svgr/plugin-jsx": "^8.1.0",
"esbuild-plugin-svgr": "2.1.0",
"eslint-plugin-react": "7.35.0",
diff --git a/packages/elements-react/package.json b/packages/elements-react/package.json
index 055d32381..bd6ee139a 100644
--- a/packages/elements-react/package.json
+++ b/packages/elements-react/package.json
@@ -28,18 +28,19 @@
"module": "./dist/index.mjs",
"types": "./dist/index.d.ts",
"dependencies": {
- "@ory/client-fetch": "1.15.3",
+ "@ory/client-fetch": "^1.15.0-next.0",
"clsx": "2.1.1",
"input-otp": "1.2.4",
"react-hook-form": "7.52.1",
- "tailwind-merge": "2.4.0",
- "react-intl": "6.4.4"
+ "react-intl": "6.4.4",
+ "tailwind-merge": "2.4.0"
},
"peerDependencies": {
"react": "18.3.1",
"react-dom": "18.3.1"
},
"devDependencies": {
+ "@hookform/devtools": "^4.3.1",
"@svgr/plugin-jsx": "^8.1.0",
"esbuild-plugin-svgr": "2.1.0",
"eslint-plugin-react": "7.35.0",
@@ -70,4 +71,4 @@
"publishConfig": {
"access": "public"
}
-}
+}
\ No newline at end of file
diff --git a/packages/elements-react/src/components/card/card-two-step.tsx b/packages/elements-react/src/components/card/card-two-step.tsx
index 0fdf95682..687ed0e64 100644
--- a/packages/elements-react/src/components/card/card-two-step.tsx
+++ b/packages/elements-react/src/components/card/card-two-step.tsx
@@ -2,10 +2,6 @@ import {
UiNode,
UiNodeGroupEnum,
UiNodeInputAttributes,
- UiNodeInputAttributesNodeTypeEnum,
- UiNodeInputAttributesTypeEnum,
- UiNodeTypeEnum,
- UiTextTypeEnum,
} from "@ory/client-fetch"
import { useState } from "react"
import { OryCard, OryCardContent, OryCardFooter } from "."
@@ -16,48 +12,7 @@ import { OryCardValidationMessages } from "../form/messages"
import { Node } from "../form/nodes/node"
import { OryFormSocialButtonsForm } from "../form/social"
import { OryCardHeader } from "./header"
-
-type ExtendedUiNode = UiNode & { twoStepContinue?: boolean }
-
-const nodePickMethod: ExtendedUiNode = {
- attributes: {
- label: {
- id: 1040003111,
- text: "Try another method",
- type: UiTextTypeEnum.Info,
- },
- name: "two_step_select",
- disabled: false,
- node_type: UiNodeInputAttributesNodeTypeEnum.Input,
- type: UiNodeInputAttributesTypeEnum.Submit,
- value: "Try another method",
- },
- group: "default",
- messages: [],
- meta: {},
- type: UiNodeTypeEnum.Input,
- twoStepContinue: true,
-}
-
-const nodeGoBack: ExtendedUiNode = {
- attributes: {
- label: {
- id: 1040008,
- text: "Back",
- type: UiTextTypeEnum.Info,
- },
- name: "two_step_back",
- disabled: false,
- node_type: UiNodeInputAttributesNodeTypeEnum.Input,
- type: UiNodeInputAttributesTypeEnum.Submit,
- value: "Back",
- },
- group: "default",
- messages: [],
- meta: {},
- type: UiNodeTypeEnum.Input,
- twoStepContinue: true,
-}
+import { useFormContext } from "react-hook-form"
export function OryTwoStepCard() {
const {
@@ -77,7 +32,6 @@ export function OryTwoStepCard() {
node.attributes.type === "hidden",
)
- const [step, setStep] = useState(isChoosingMethod ? 1 : 0)
const [selectedGroup, setSelectedGroup] = useState<
UiNodeGroupEnum | undefined
>()
@@ -108,7 +62,6 @@ export function OryTwoStepCard() {
const handleOptionSelect = (group: UiNodeGroupEnum) => {
setSelectedGroup(group)
- setStep(2)
}
const zeroStepGroups = ui.nodes.filter(
@@ -119,16 +72,27 @@ export function OryTwoStepCard() {
? (uniqueGroups[selectedGroup] ?? [])
: []
+ const nodeBackButton = ui.nodes.find(
+ (node) =>
+ ("value" in node.attributes &&
+ node.attributes.value === "profile:back") ||
+ ("name" in node.attributes &&
+ node.attributes.name === "identifier" &&
+ node.group === "identifier_first"),
+ )
+
const finalNodes = [
...(uniqueGroups?.identifier_first ?? []),
...(uniqueGroups?.default ?? []),
]
.flat()
- .filter((node) => {
- return "type" in node.attributes && node.attributes.type === "hidden"
- })
+ .filter(
+ (node) => "type" in node.attributes && node.attributes.type === "hidden",
+ )
.concat(selectedNodes)
+ const step = selectedGroup ? 2 : isChoosingMethod ? 1 : 0
+
return (
@@ -143,6 +107,7 @@ export function OryTwoStepCard() {
.map((node, k) => )}
{step === 1 && (
<>
+ {nodeBackButton && }
{options.map((option) => (
handleOptionSelect(option)}
/>
))}
- setStep(0)}
- />
)}
{step === 2 && (
<>
+ {nodeBackButton && (
+ setSelectedGroup(undefined)}
+ />
+ )}
{finalNodes.sort(sortNodes).map((node, k) => (
))}
- setStep(1)}
- />
)}
@@ -178,3 +140,37 @@ export function OryTwoStepCard() {
)
}
+
+const BackButton = () => {
+ const {
+ flow: { ui },
+ } = useOryFlow()
+ const { setValue } = useFormContext()
+ const Components = useComponents()
+
+ const nodeBackButton = ui.nodes.find(
+ (node) =>
+ ("value" in node.attributes &&
+ node.attributes.value === "profile:back") ||
+ ("name" in node.attributes &&
+ node.attributes.name === "identifier" &&
+ node.group === "identifier_first"),
+ )
+
+ if (!nodeBackButton) {
+ return null
+ }
+
+ return (
+ {
+ setValue(
+ nodeBackButton.attributes.name,
+ nodeBackButton.attributes.value,
+ )
+ }}
+ />
+ )
+}
diff --git a/packages/elements-react/src/components/form/form.tsx b/packages/elements-react/src/components/form/form.tsx
index 79d771cd4..6b13f9a5b 100644
--- a/packages/elements-react/src/components/form/form.tsx
+++ b/packages/elements-react/src/components/form/form.tsx
@@ -77,7 +77,7 @@ export type OryFormProps = PropsWithChildren
export function OryForm({ children }: OryFormProps) {
const { FormContainer } = useComponents()
const flowContainer = useOryFlow()
-
+ console.log(flowContainer)
const methods = useForm({
// TODO: Generify this, so we have typesafety in the submit handler.
defaultValues: computeDefaultValues(flowContainer),
@@ -85,6 +85,9 @@ export function OryForm({ children }: OryFormProps) {
const intl = useIntl()
+ const fields = methods.watch()
+ console.log(fields)
+
const onRedirect: OnRedirectHandler = (url, external) => {
if (external) {
window.location.href = url
@@ -123,7 +126,6 @@ export function OryForm({ children }: OryFormProps) {
if (submitData.method === "code" && submitData.code) {
submitData.resend = ""
}
- console
await onSubmitRegistration(flowContainer, {
onRedirect,
setFlowContainer: handleSuccess,
diff --git a/packages/elements-react/src/components/form/nodes/input.tsx b/packages/elements-react/src/components/form/nodes/input.tsx
index 96d578451..92b729c3e 100644
--- a/packages/elements-react/src/components/form/nodes/input.tsx
+++ b/packages/elements-react/src/components/form/nodes/input.tsx
@@ -10,6 +10,7 @@ import { MouseEventHandler, ReactNode, useEffect, useRef } from "react"
export const NodeInput = ({
node,
attributes,
+ onClick,
}: NodeProps & {
attributes: UiNodeInputAttributes
onClick?: MouseEventHandler
@@ -39,7 +40,13 @@ export const NodeInput = ({
[],
)
- const handleClick: MouseEventHandler = () => {
+ const handleClick: MouseEventHandler = (e) => {
+ if (onClick) {
+ console.log("asd")
+ e.preventDefault()
+ onClick(e)
+ }
+
if (onclickTrigger) {
triggerToWindowCall(onclickTrigger)
}
@@ -52,9 +59,10 @@ export const NodeInput = ({
(attrs.name === "code" && node.group === "code") ||
(attrs.name === "totp_code" && node.group === "totp")
const isCurrentIdentifier =
- attrs.name == "identifier" &&
- node.group === "identifier_first" &&
- attrs.type === "hidden"
+ (attrs.name == "identifier" &&
+ node.group === "identifier_first" &&
+ attrs.type === "hidden") ||
+ attrs.value === "profile:back"
const isResend = attrs.name === "resend" && node.group === "code"
switch (nodeType) {
@@ -86,19 +94,11 @@ export const NodeInput = ({
)
case UiNodeInputAttributesTypeEnum.Hidden:
return (
- <>
- {isCurrentIdentifier && (
-
- )}
-
-
+
)
default:
if (isPinCodeInput) {
diff --git a/packages/elements-react/src/locales/sv.json b/packages/elements-react/src/locales/sv.json
index c5c8a28bb..b6ab3e5a8 100644
--- a/packages/elements-react/src/locales/sv.json
+++ b/packages/elements-react/src/locales/sv.json
@@ -58,6 +58,7 @@
"identities.messages.1070001": "Lösenord",
"identities.messages.1070002": "{title}",
"identities.messages.1070003": "Spara",
+ "identities.messages.1040008": "Tillbaka",
"identities.messages.1070004": "ID",
"identities.messages.1070005": "Skicka",
"identities.messages.1070006": "Verifiera kod",
@@ -173,4 +174,4 @@
"verification.registration-label": "Har du inget konto?",
"verification.title": "Verifiera ditt konto",
"verification.back-button": "Tillbaka"
-}
+}
\ No newline at end of file
diff --git a/packages/elements-react/src/theme/default/components/card/current-identifier-button.tsx b/packages/elements-react/src/theme/default/components/card/current-identifier-button.tsx
index f86b2ca1c..b1ab19f33 100644
--- a/packages/elements-react/src/theme/default/components/card/current-identifier-button.tsx
+++ b/packages/elements-react/src/theme/default/components/card/current-identifier-button.tsx
@@ -1,9 +1,7 @@
import { HeadlessButtonProps } from "@ory/elements-react"
-import { DefaultInput } from "../form/input"
export function DefaultCurrentIdentifierButton({
attributes,
- node,
}: HeadlessButtonProps) {
return (
@@ -12,7 +10,6 @@ export function DefaultCurrentIdentifierButton({
{attributes.value}
-
)
}