@ory/elements-react 1.0.0-rc.2 → 1.0.0-rc.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +30 -0
- package/dist/index.d.mts +73 -69
- package/dist/index.d.ts +73 -69
- package/dist/index.js +332 -120
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +330 -120
- package/dist/index.mjs.map +1 -1
- package/dist/theme/default/index.js +882 -774
- package/dist/theme/default/index.js.map +1 -1
- package/dist/theme/default/index.mjs +709 -594
- package/dist/theme/default/index.mjs.map +1 -1
- package/package.json +6 -6
- package/tsconfig.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { UiNodeGroupEnum, isUiNodeInputAttributes, isUiNodeAnchorAttributes, isUiNodeImageAttributes, isUiNodeScriptAttributes, FlowType, getNodeId, isUiNodeTextAttributes, UiNodeInputAttributesTypeEnum, handleContinueWith,
|
|
2
|
-
import { createContext, useContext, useState, useMemo, useReducer,
|
|
1
|
+
import { UiNodeGroupEnum, isUiNodeInputAttributes, isUiNodeAnchorAttributes, isUiNodeImageAttributes, isUiNodeScriptAttributes, FlowType, getNodeId, Configuration, FrontendApi, isUiNodeTextAttributes, UiNodeInputAttributesTypeEnum, handleContinueWith, isResponseError as isResponseError$1, loginUrl, settingsUrl, registrationUrl, FetchError, ResponseError, recoveryUrl, instanceOfContinueWithRecoveryUi, verificationUrl as verificationUrl$1 } from '@ory/client-fetch';
|
|
2
|
+
import { createContext, useContext, useRef, useState, useMemo, useReducer, useEffect } from 'react';
|
|
3
3
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
4
4
|
import { useIntl, IntlProvider as IntlProvider$1 } from 'react-intl';
|
|
5
5
|
import { useFormContext, useForm, FormProvider } from 'react-hook-form';
|
|
@@ -320,9 +320,7 @@ function parseStateFromFlow(flow) {
|
|
|
320
320
|
return { current: "method_active", method: "code" };
|
|
321
321
|
} else if (methodWithMessage) {
|
|
322
322
|
return { current: "method_active", method: methodWithMessage.group };
|
|
323
|
-
} else if (flow.flow.active && !["default", "identifier_first"
|
|
324
|
-
flow.flow.active
|
|
325
|
-
)) {
|
|
323
|
+
} else if (flow.flow.active && !["default", "identifier_first"].includes(flow.flow.active)) {
|
|
326
324
|
return { current: "method_active", method: flow.flow.active };
|
|
327
325
|
} else if (isChoosingMethod(flow)) {
|
|
328
326
|
const authMethods = nodesToAuthMethodGroups(flow.flow.ui.nodes);
|
|
@@ -360,14 +358,20 @@ function useFormStateReducer(flow) {
|
|
|
360
358
|
const formStateReducer = (state, action2) => {
|
|
361
359
|
switch (action2.type) {
|
|
362
360
|
case "action_flow_update": {
|
|
363
|
-
if (selectedMethod)
|
|
361
|
+
if (selectedMethod) {
|
|
364
362
|
return { current: "method_active", method: selectedMethod };
|
|
363
|
+
}
|
|
365
364
|
return parseStateFromFlow(action2.flow);
|
|
366
365
|
}
|
|
367
366
|
case "action_select_method": {
|
|
368
367
|
setSelectedMethod(action2.method);
|
|
369
368
|
return { current: "method_active", method: action2.method };
|
|
370
369
|
}
|
|
370
|
+
case "action_clear_active_method": {
|
|
371
|
+
return {
|
|
372
|
+
current: "select_method"
|
|
373
|
+
};
|
|
374
|
+
}
|
|
371
375
|
}
|
|
372
376
|
return state;
|
|
373
377
|
};
|
|
@@ -406,6 +410,110 @@ function OryFlowProvider({
|
|
|
406
410
|
}
|
|
407
411
|
);
|
|
408
412
|
}
|
|
413
|
+
|
|
414
|
+
// src/client/config.ts
|
|
415
|
+
function isProduction() {
|
|
416
|
+
var _a, _b;
|
|
417
|
+
return ["production", "prod"].indexOf(
|
|
418
|
+
(_b = (_a = process.env.VERCEL_ENV) != null ? _a : process.env.NODE_ENV) != null ? _b : ""
|
|
419
|
+
) > -1;
|
|
420
|
+
}
|
|
421
|
+
function frontendClient(sdkUrl, opts = {}) {
|
|
422
|
+
const config = new Configuration({
|
|
423
|
+
...opts,
|
|
424
|
+
basePath: sdkUrl,
|
|
425
|
+
credentials: "include",
|
|
426
|
+
headers: {
|
|
427
|
+
Accept: "application/json",
|
|
428
|
+
...opts.headers
|
|
429
|
+
}
|
|
430
|
+
});
|
|
431
|
+
return new FrontendApi(config);
|
|
432
|
+
}
|
|
433
|
+
var defaultProject = {
|
|
434
|
+
name: "Ory",
|
|
435
|
+
registration_enabled: true,
|
|
436
|
+
verification_enabled: true,
|
|
437
|
+
recovery_enabled: true,
|
|
438
|
+
recovery_ui_url: "/ui/recovery",
|
|
439
|
+
registration_ui_url: "/ui/registration",
|
|
440
|
+
verification_ui_url: "/ui/verification",
|
|
441
|
+
login_ui_url: "/ui/login",
|
|
442
|
+
settings_ui_url: "/ui/settings",
|
|
443
|
+
default_redirect_url: "/ui/welcome",
|
|
444
|
+
error_ui_url: "/ui/error",
|
|
445
|
+
default_locale: "en",
|
|
446
|
+
locale_behavior: "force_default"
|
|
447
|
+
};
|
|
448
|
+
function useOryConfiguration() {
|
|
449
|
+
const configCtx = useContext(OryConfigurationContext);
|
|
450
|
+
return {
|
|
451
|
+
sdk: {
|
|
452
|
+
...configCtx.sdk,
|
|
453
|
+
frontend: frontendClient(configCtx.sdk.url, configCtx.sdk.options)
|
|
454
|
+
},
|
|
455
|
+
project: {
|
|
456
|
+
...configCtx.project
|
|
457
|
+
}
|
|
458
|
+
};
|
|
459
|
+
}
|
|
460
|
+
var OryConfigurationContext = createContext({
|
|
461
|
+
sdk: computeSdkConfig({}),
|
|
462
|
+
project: defaultProject
|
|
463
|
+
});
|
|
464
|
+
function OryConfigurationProvider({
|
|
465
|
+
children,
|
|
466
|
+
sdk: initialConfig,
|
|
467
|
+
project
|
|
468
|
+
}) {
|
|
469
|
+
const configRef = useRef({
|
|
470
|
+
sdk: computeSdkConfig(initialConfig),
|
|
471
|
+
project: {
|
|
472
|
+
...defaultProject,
|
|
473
|
+
...project
|
|
474
|
+
}
|
|
475
|
+
});
|
|
476
|
+
return /* @__PURE__ */ jsx(OryConfigurationContext.Provider, { value: configRef.current, children });
|
|
477
|
+
}
|
|
478
|
+
function computeSdkConfig(config) {
|
|
479
|
+
if ((config == null ? void 0 : config.url) && typeof config.url === "string") {
|
|
480
|
+
console.debug("Using sdk url from config");
|
|
481
|
+
return {
|
|
482
|
+
url: config.url.replace(/\/$/, ""),
|
|
483
|
+
options: config.options || {}
|
|
484
|
+
};
|
|
485
|
+
}
|
|
486
|
+
return {
|
|
487
|
+
url: getSDKUrl(),
|
|
488
|
+
options: (config == null ? void 0 : config.options) || {}
|
|
489
|
+
};
|
|
490
|
+
}
|
|
491
|
+
function getSDKUrl() {
|
|
492
|
+
var _a;
|
|
493
|
+
if (typeof process !== "undefined" && process.versions && process.versions.node) {
|
|
494
|
+
if (isProduction()) {
|
|
495
|
+
const sdkUrl = (_a = process.env["NEXT_PUBLIC_ORY_SDK_URL"]) != null ? _a : process.env["ORY_SDK_URL"];
|
|
496
|
+
if (!sdkUrl) {
|
|
497
|
+
throw new Error(
|
|
498
|
+
"Unable to determine SDK URL. Please set NEXT_PUBLIC_ORY_SDK_URL and/or ORY_SDK_URL in production environments."
|
|
499
|
+
);
|
|
500
|
+
}
|
|
501
|
+
return sdkUrl.replace(/\/$/, "");
|
|
502
|
+
} else {
|
|
503
|
+
if (process.env["__NEXT_PRIVATE_ORIGIN"]) {
|
|
504
|
+
return process.env["__NEXT_PRIVATE_ORIGIN"].replace(/\/$/, "");
|
|
505
|
+
} else if (process.env["VERCEL_URL"]) {
|
|
506
|
+
return `https://${process.env["VERCEL_URL"]}`.replace(/\/$/, "");
|
|
507
|
+
}
|
|
508
|
+
}
|
|
509
|
+
}
|
|
510
|
+
if (typeof window !== "undefined") {
|
|
511
|
+
return window.location.origin;
|
|
512
|
+
}
|
|
513
|
+
throw new Error(
|
|
514
|
+
"Unable to determine SDK URL. Please set NEXT_PUBLIC_ORY_SDK_URL and/or ORY_SDK_URL or supply the sdk.url parameter in the Ory configuration."
|
|
515
|
+
);
|
|
516
|
+
}
|
|
409
517
|
function mergeTranslations(customTranslations) {
|
|
410
518
|
return Object.keys(customTranslations).reduce((acc, key) => {
|
|
411
519
|
acc[key] = { ...OryLocales[key], ...customTranslations[key] };
|
|
@@ -435,17 +543,18 @@ var IntlProvider = ({
|
|
|
435
543
|
function OryProvider({
|
|
436
544
|
children,
|
|
437
545
|
components: Components,
|
|
546
|
+
config,
|
|
438
547
|
...oryFlowProps
|
|
439
548
|
}) {
|
|
440
549
|
var _a, _b, _c;
|
|
441
|
-
return /* @__PURE__ */ jsx(
|
|
550
|
+
return /* @__PURE__ */ jsx(OryConfigurationProvider, { sdk: config.sdk, project: config.project, children: /* @__PURE__ */ jsx(
|
|
442
551
|
IntlProvider,
|
|
443
552
|
{
|
|
444
|
-
locale: (_b = (_a =
|
|
445
|
-
customTranslations: (_c =
|
|
553
|
+
locale: (_b = (_a = config.intl) == null ? void 0 : _a.locale) != null ? _b : "en",
|
|
554
|
+
customTranslations: (_c = config.intl) == null ? void 0 : _c.customTranslations,
|
|
446
555
|
children: /* @__PURE__ */ jsx(OryFlowProvider, { ...oryFlowProps, children: /* @__PURE__ */ jsx(OryComponentProvider, { components: Components, children }) })
|
|
447
556
|
}
|
|
448
|
-
);
|
|
557
|
+
) });
|
|
449
558
|
}
|
|
450
559
|
function OryCardHeader() {
|
|
451
560
|
const { Card } = useComponents();
|
|
@@ -564,18 +673,6 @@ function OryCardContent({ children }) {
|
|
|
564
673
|
const { Card } = useComponents();
|
|
565
674
|
return /* @__PURE__ */ jsx(Card.Content, { children });
|
|
566
675
|
}
|
|
567
|
-
function frontendClient(sdkUrl, opts = {}) {
|
|
568
|
-
const config = new Configuration({
|
|
569
|
-
...opts,
|
|
570
|
-
basePath: sdkUrl,
|
|
571
|
-
credentials: "include",
|
|
572
|
-
headers: {
|
|
573
|
-
Accept: "application/json",
|
|
574
|
-
...opts.headers
|
|
575
|
-
}
|
|
576
|
-
});
|
|
577
|
-
return new FrontendApi(config);
|
|
578
|
-
}
|
|
579
676
|
|
|
580
677
|
// src/util/internal.ts
|
|
581
678
|
function replaceWindowFlowId(flow) {
|
|
@@ -583,9 +680,137 @@ function replaceWindowFlowId(flow) {
|
|
|
583
680
|
url.searchParams.set("flow", flow);
|
|
584
681
|
window.location.href = url.toString();
|
|
585
682
|
}
|
|
683
|
+
function isGenericErrorResponse(response) {
|
|
684
|
+
return typeof response === "object" && !!response && "error" in response && typeof response.error === "object" && !!response.error && "id" in response.error;
|
|
685
|
+
}
|
|
686
|
+
function isNeedsPrivilegedSessionError(response) {
|
|
687
|
+
return isGenericErrorResponse(response) && response.error.id === "session_refresh_required";
|
|
688
|
+
}
|
|
689
|
+
function isSelfServiceFlowExpiredError(response) {
|
|
690
|
+
return isGenericErrorResponse(response) && response.error.id === "self_service_flow_expired";
|
|
691
|
+
}
|
|
692
|
+
function isBrowserLocationChangeRequired(response) {
|
|
693
|
+
return isGenericErrorResponse(response) && isGenericErrorResponse(response) && response.error.id === "browser_location_change_required";
|
|
694
|
+
}
|
|
695
|
+
function isAddressNotVerified(response) {
|
|
696
|
+
return isGenericErrorResponse(response) && response.error.id === "session_verified_address_required";
|
|
697
|
+
}
|
|
698
|
+
function isCsrfError(response) {
|
|
699
|
+
return isGenericErrorResponse(response) && response.error.id === "security_csrf_violation";
|
|
700
|
+
}
|
|
701
|
+
var isResponseError = (err) => {
|
|
702
|
+
if (err instanceof ResponseError) {
|
|
703
|
+
return true;
|
|
704
|
+
}
|
|
705
|
+
return typeof err === "object" && !!err && "name" in err && err.name === "ResponseError";
|
|
706
|
+
};
|
|
707
|
+
var isFetchError = (err) => {
|
|
708
|
+
return err instanceof FetchError;
|
|
709
|
+
};
|
|
710
|
+
|
|
711
|
+
// src/util/sdk-helpers/urlHelpers.ts
|
|
712
|
+
var verificationUrl = (config) => config.sdk.url + "/self-service/verification/browser";
|
|
713
|
+
var handleFlowError = (opts) => async (err) => {
|
|
714
|
+
var _a;
|
|
715
|
+
if (!isResponseError(err)) {
|
|
716
|
+
if (isFetchError(err)) {
|
|
717
|
+
throw new FetchError(
|
|
718
|
+
err,
|
|
719
|
+
"Unable to call the API endpoint. Ensure that CORS is set up correctly and that you have provided a valid SDK URL to Ory Elements."
|
|
720
|
+
);
|
|
721
|
+
}
|
|
722
|
+
throw err;
|
|
723
|
+
}
|
|
724
|
+
const contentType = err.response.headers.get("content-type") || "";
|
|
725
|
+
if (contentType.includes("application/json")) {
|
|
726
|
+
const body = await toBody(err.response);
|
|
727
|
+
if (isSelfServiceFlowExpiredError(body)) {
|
|
728
|
+
opts.onRestartFlow(body.use_flow_id);
|
|
729
|
+
return;
|
|
730
|
+
} else if (isAddressNotVerified(body)) {
|
|
731
|
+
for (const continueWith of ((_a = body.error.details) == null ? void 0 : _a.continue_with) || []) {
|
|
732
|
+
if (continueWith.action === "show_verification_ui" && continueWith.flow.url) {
|
|
733
|
+
opts.onRedirect(continueWith.flow.url, true);
|
|
734
|
+
return;
|
|
735
|
+
}
|
|
736
|
+
}
|
|
737
|
+
opts.onRedirect(verificationUrl(opts.config), true);
|
|
738
|
+
return;
|
|
739
|
+
} else if (isBrowserLocationChangeRequired(body) && body.redirect_browser_to) {
|
|
740
|
+
opts.onRedirect(body.redirect_browser_to, true);
|
|
741
|
+
return;
|
|
742
|
+
} else if (isNeedsPrivilegedSessionError(body) && body.redirect_browser_to) {
|
|
743
|
+
opts.onRedirect(body.redirect_browser_to, true);
|
|
744
|
+
return;
|
|
745
|
+
} else if (isCsrfError(body)) {
|
|
746
|
+
opts.onRestartFlow();
|
|
747
|
+
return;
|
|
748
|
+
}
|
|
749
|
+
switch (err.response.status) {
|
|
750
|
+
case 404:
|
|
751
|
+
opts.onRestartFlow();
|
|
752
|
+
return;
|
|
753
|
+
case 410:
|
|
754
|
+
opts.onRestartFlow();
|
|
755
|
+
return;
|
|
756
|
+
case 400:
|
|
757
|
+
return opts.onValidationError(
|
|
758
|
+
await err.response.json()
|
|
759
|
+
);
|
|
760
|
+
case 403:
|
|
761
|
+
opts.onRestartFlow();
|
|
762
|
+
return;
|
|
763
|
+
case 422: {
|
|
764
|
+
throw new ResponseError(
|
|
765
|
+
err.response,
|
|
766
|
+
"The API returned an error code indicating a required redirect, but the SDK is outdated and does not know how to handle the action. Received response: " + await err.response.json()
|
|
767
|
+
);
|
|
768
|
+
}
|
|
769
|
+
}
|
|
770
|
+
throw new ResponseError(
|
|
771
|
+
err.response,
|
|
772
|
+
"The Ory API endpoint returned a response code the SDK does not know how to handle. Please check the network tab for more information. Received response: " + await err.response.json()
|
|
773
|
+
);
|
|
774
|
+
} else if (
|
|
775
|
+
// Not a JSON response? If it's a text response we will return an error informing the user that the response is not JSON.
|
|
776
|
+
contentType.includes("text/") || contentType.includes("html") || contentType.includes("xml")
|
|
777
|
+
) {
|
|
778
|
+
await logResponseError(err.response, true);
|
|
779
|
+
throw new ResponseError(
|
|
780
|
+
err.response,
|
|
781
|
+
`The Ory API endpoint returned an unexpected HTML or text response. Check your console output for details.`
|
|
782
|
+
);
|
|
783
|
+
}
|
|
784
|
+
await logResponseError(err.response, false);
|
|
785
|
+
throw new ResponseError(
|
|
786
|
+
err.response,
|
|
787
|
+
"The Ory API endpoint returned unexpected content type `" + contentType + "`. Check your console output for details."
|
|
788
|
+
);
|
|
789
|
+
};
|
|
790
|
+
async function toBody(response) {
|
|
791
|
+
try {
|
|
792
|
+
return await response.clone().json();
|
|
793
|
+
} catch (e) {
|
|
794
|
+
await logResponseError(response, true, [e]);
|
|
795
|
+
throw new ResponseError(
|
|
796
|
+
response,
|
|
797
|
+
"Unable to decode API response using JSON."
|
|
798
|
+
);
|
|
799
|
+
}
|
|
800
|
+
}
|
|
801
|
+
async function logResponseError(response, printBody, wrap) {
|
|
802
|
+
console.error("Unable to decode API response", {
|
|
803
|
+
response: {
|
|
804
|
+
status: response.status,
|
|
805
|
+
headers: Object.fromEntries(response.headers.entries()),
|
|
806
|
+
body: printBody ? await response.clone().text() : void 0
|
|
807
|
+
},
|
|
808
|
+
errors: wrap
|
|
809
|
+
});
|
|
810
|
+
}
|
|
586
811
|
|
|
587
812
|
// src/util/onSubmitLogin.ts
|
|
588
|
-
async function onSubmitLogin({
|
|
813
|
+
async function onSubmitLogin({ flow }, config, {
|
|
589
814
|
setFlowContainer,
|
|
590
815
|
body,
|
|
591
816
|
onRedirect
|
|
@@ -614,27 +839,21 @@ async function onSubmitLogin({ config, flow }, {
|
|
|
614
839
|
},
|
|
615
840
|
onValidationError: (body2) => {
|
|
616
841
|
setFlowContainer({
|
|
617
|
-
config,
|
|
618
842
|
flow: body2,
|
|
619
843
|
flowType: FlowType.Login
|
|
620
844
|
});
|
|
621
845
|
},
|
|
622
|
-
onRedirect
|
|
846
|
+
onRedirect,
|
|
847
|
+
config
|
|
623
848
|
})
|
|
624
849
|
);
|
|
625
850
|
}
|
|
626
|
-
async function onSubmitRecovery({
|
|
851
|
+
async function onSubmitRecovery({ flow }, config, {
|
|
627
852
|
setFlowContainer,
|
|
628
853
|
body,
|
|
629
854
|
onRedirect
|
|
630
855
|
}) {
|
|
631
|
-
|
|
632
|
-
if (!config.sdk.url) {
|
|
633
|
-
throw new Error(
|
|
634
|
-
`Please supply your Ory Network SDK url to the Ory Elements configuration.`
|
|
635
|
-
);
|
|
636
|
-
}
|
|
637
|
-
await frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateRecoveryFlowRaw({
|
|
856
|
+
await config.sdk.frontend.updateRecoveryFlowRaw({
|
|
638
857
|
flow: flow.id,
|
|
639
858
|
updateRecoveryFlowBody: body
|
|
640
859
|
}).then(async (res) => {
|
|
@@ -647,8 +866,7 @@ async function onSubmitRecovery({ config, flow }, {
|
|
|
647
866
|
}
|
|
648
867
|
setFlowContainer({
|
|
649
868
|
flow: flow2,
|
|
650
|
-
flowType: FlowType.Recovery
|
|
651
|
-
config
|
|
869
|
+
flowType: FlowType.Recovery
|
|
652
870
|
});
|
|
653
871
|
}).catch(
|
|
654
872
|
handleFlowError({
|
|
@@ -666,12 +884,12 @@ async function onSubmitRecovery({ config, flow }, {
|
|
|
666
884
|
} else {
|
|
667
885
|
setFlowContainer({
|
|
668
886
|
flow: body2,
|
|
669
|
-
flowType: FlowType.Recovery
|
|
670
|
-
config
|
|
887
|
+
flowType: FlowType.Recovery
|
|
671
888
|
});
|
|
672
889
|
}
|
|
673
890
|
},
|
|
674
|
-
onRedirect
|
|
891
|
+
onRedirect,
|
|
892
|
+
config
|
|
675
893
|
})
|
|
676
894
|
);
|
|
677
895
|
}
|
|
@@ -688,19 +906,12 @@ function handleContinueWithRecoveryUIError(error, config, onRedirect) {
|
|
|
688
906
|
}
|
|
689
907
|
onRedirect(recoveryUrl(config), true);
|
|
690
908
|
}
|
|
691
|
-
async function onSubmitRegistration({
|
|
909
|
+
async function onSubmitRegistration({ flow }, config, {
|
|
692
910
|
setFlowContainer,
|
|
693
911
|
body,
|
|
694
912
|
onRedirect
|
|
695
913
|
}) {
|
|
696
|
-
|
|
697
|
-
if (!config.sdk.url) {
|
|
698
|
-
throw new Error(
|
|
699
|
-
`Please supply your Ory Network SDK url to the Ory Elements configuration.`
|
|
700
|
-
);
|
|
701
|
-
}
|
|
702
|
-
const client = frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
|
|
703
|
-
await client.updateRegistrationFlowRaw({
|
|
914
|
+
await config.sdk.frontend.updateRegistrationFlowRaw({
|
|
704
915
|
flow: flow.id,
|
|
705
916
|
updateRegistrationFlowBody: body
|
|
706
917
|
}).then(async (res) => {
|
|
@@ -724,27 +935,20 @@ async function onSubmitRegistration({ config, flow }, {
|
|
|
724
935
|
onValidationError: (body2) => {
|
|
725
936
|
setFlowContainer({
|
|
726
937
|
flow: body2,
|
|
727
|
-
flowType: FlowType.Registration
|
|
728
|
-
config
|
|
938
|
+
flowType: FlowType.Registration
|
|
729
939
|
});
|
|
730
940
|
},
|
|
731
|
-
onRedirect
|
|
941
|
+
onRedirect,
|
|
942
|
+
config
|
|
732
943
|
})
|
|
733
944
|
);
|
|
734
945
|
}
|
|
735
|
-
async function onSubmitSettings({
|
|
946
|
+
async function onSubmitSettings({ flow }, config, {
|
|
736
947
|
setFlowContainer,
|
|
737
948
|
body,
|
|
738
949
|
onRedirect
|
|
739
950
|
}) {
|
|
740
|
-
|
|
741
|
-
if (!config.sdk.url) {
|
|
742
|
-
throw new Error(
|
|
743
|
-
`Please supply your Ory Network SDK url to the Ory Elements configuration.`
|
|
744
|
-
);
|
|
745
|
-
}
|
|
746
|
-
const client = frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {});
|
|
747
|
-
await client.updateSettingsFlowRaw({
|
|
951
|
+
await config.sdk.frontend.updateSettingsFlowRaw({
|
|
748
952
|
flow: flow.id,
|
|
749
953
|
updateSettingsFlowBody: body
|
|
750
954
|
}).then(async (res) => {
|
|
@@ -757,8 +961,7 @@ async function onSubmitSettings({ config, flow }, {
|
|
|
757
961
|
}
|
|
758
962
|
setFlowContainer({
|
|
759
963
|
flow: body2,
|
|
760
|
-
flowType: FlowType.Settings
|
|
761
|
-
config
|
|
964
|
+
flowType: FlowType.Settings
|
|
762
965
|
});
|
|
763
966
|
}).catch(
|
|
764
967
|
handleFlowError({
|
|
@@ -772,14 +975,14 @@ async function onSubmitSettings({ config, flow }, {
|
|
|
772
975
|
onValidationError: (body2) => {
|
|
773
976
|
setFlowContainer({
|
|
774
977
|
flow: body2,
|
|
775
|
-
flowType: FlowType.Settings
|
|
776
|
-
config
|
|
978
|
+
flowType: FlowType.Settings
|
|
777
979
|
});
|
|
778
980
|
},
|
|
779
|
-
onRedirect
|
|
981
|
+
onRedirect,
|
|
982
|
+
config
|
|
780
983
|
})
|
|
781
984
|
).catch((err) => {
|
|
782
|
-
if (isResponseError(err)) {
|
|
985
|
+
if (isResponseError$1(err)) {
|
|
783
986
|
if (err.response.status === 401) {
|
|
784
987
|
return onRedirect(
|
|
785
988
|
loginUrl(config) + "?return_to=" + settingsUrl(config),
|
|
@@ -790,25 +993,18 @@ async function onSubmitSettings({ config, flow }, {
|
|
|
790
993
|
}
|
|
791
994
|
});
|
|
792
995
|
}
|
|
793
|
-
async function onSubmitVerification({
|
|
996
|
+
async function onSubmitVerification({ flow }, config, {
|
|
794
997
|
setFlowContainer,
|
|
795
998
|
body,
|
|
796
999
|
onRedirect
|
|
797
1000
|
}) {
|
|
798
|
-
|
|
799
|
-
if (!config.sdk.url) {
|
|
800
|
-
throw new Error(
|
|
801
|
-
`Please supply your Ory Network SDK URL to the Ory Elements configuration.`
|
|
802
|
-
);
|
|
803
|
-
}
|
|
804
|
-
await frontendClient(config.sdk.url, (_a = config.sdk.options) != null ? _a : {}).updateVerificationFlowRaw({
|
|
1001
|
+
await config.sdk.frontend.updateVerificationFlowRaw({
|
|
805
1002
|
flow: flow.id,
|
|
806
1003
|
updateVerificationFlowBody: body
|
|
807
1004
|
}).then(
|
|
808
1005
|
async (res) => setFlowContainer({
|
|
809
1006
|
flow: await res.value(),
|
|
810
|
-
flowType: FlowType.Verification
|
|
811
|
-
config
|
|
1007
|
+
flowType: FlowType.Verification
|
|
812
1008
|
})
|
|
813
1009
|
).catch(
|
|
814
1010
|
handleFlowError({
|
|
@@ -816,17 +1012,17 @@ async function onSubmitVerification({ config, flow }, {
|
|
|
816
1012
|
if (useFlowId) {
|
|
817
1013
|
replaceWindowFlowId(useFlowId);
|
|
818
1014
|
} else {
|
|
819
|
-
onRedirect(verificationUrl(config), true);
|
|
1015
|
+
onRedirect(verificationUrl$1(config), true);
|
|
820
1016
|
}
|
|
821
1017
|
},
|
|
822
1018
|
onValidationError: (body2) => {
|
|
823
1019
|
setFlowContainer({
|
|
824
1020
|
flow: body2,
|
|
825
|
-
flowType: FlowType.Verification
|
|
826
|
-
config
|
|
1021
|
+
flowType: FlowType.Verification
|
|
827
1022
|
});
|
|
828
1023
|
},
|
|
829
|
-
onRedirect
|
|
1024
|
+
onRedirect,
|
|
1025
|
+
config
|
|
830
1026
|
})
|
|
831
1027
|
);
|
|
832
1028
|
}
|
|
@@ -836,6 +1032,7 @@ var supportsSelectAccountPrompt = ["google", "github"];
|
|
|
836
1032
|
function useOryFormSubmit(onAfterSubmit) {
|
|
837
1033
|
const flowContainer = useOryFlow();
|
|
838
1034
|
const methods = useFormContext();
|
|
1035
|
+
const config = useOryConfiguration();
|
|
839
1036
|
const handleSuccess = (flow) => {
|
|
840
1037
|
flowContainer.setFlowContainer(flow);
|
|
841
1038
|
methods.reset(computeDefaultValues(flow.flow.ui.nodes));
|
|
@@ -852,7 +1049,7 @@ function useOryFormSubmit(onAfterSubmit) {
|
|
|
852
1049
|
if (submitData.method === "code" && data.code) {
|
|
853
1050
|
submitData.resend = "";
|
|
854
1051
|
}
|
|
855
|
-
await onSubmitLogin(flowContainer, {
|
|
1052
|
+
await onSubmitLogin(flowContainer, config, {
|
|
856
1053
|
onRedirect,
|
|
857
1054
|
setFlowContainer: handleSuccess,
|
|
858
1055
|
body: submitData
|
|
@@ -866,7 +1063,7 @@ function useOryFormSubmit(onAfterSubmit) {
|
|
|
866
1063
|
if (submitData.method === "code" && submitData.code) {
|
|
867
1064
|
submitData.resend = "";
|
|
868
1065
|
}
|
|
869
|
-
await onSubmitRegistration(flowContainer, {
|
|
1066
|
+
await onSubmitRegistration(flowContainer, config, {
|
|
870
1067
|
onRedirect,
|
|
871
1068
|
setFlowContainer: handleSuccess,
|
|
872
1069
|
body: submitData
|
|
@@ -874,7 +1071,7 @@ function useOryFormSubmit(onAfterSubmit) {
|
|
|
874
1071
|
break;
|
|
875
1072
|
}
|
|
876
1073
|
case FlowType.Verification:
|
|
877
|
-
await onSubmitVerification(flowContainer, {
|
|
1074
|
+
await onSubmitVerification(flowContainer, config, {
|
|
878
1075
|
onRedirect,
|
|
879
1076
|
setFlowContainer: handleSuccess,
|
|
880
1077
|
body: data
|
|
@@ -887,7 +1084,7 @@ function useOryFormSubmit(onAfterSubmit) {
|
|
|
887
1084
|
if (data.code) {
|
|
888
1085
|
submitData.email = "";
|
|
889
1086
|
}
|
|
890
|
-
await onSubmitRecovery(flowContainer, {
|
|
1087
|
+
await onSubmitRecovery(flowContainer, config, {
|
|
891
1088
|
onRedirect,
|
|
892
1089
|
setFlowContainer: handleSuccess,
|
|
893
1090
|
body: submitData
|
|
@@ -915,7 +1112,7 @@ function useOryFormSubmit(onAfterSubmit) {
|
|
|
915
1112
|
if ("passkey_remove" in submitData) {
|
|
916
1113
|
submitData.method = "passkey";
|
|
917
1114
|
}
|
|
918
|
-
await onSubmitSettings(flowContainer, {
|
|
1115
|
+
await onSubmitSettings(flowContainer, config, {
|
|
919
1116
|
onRedirect,
|
|
920
1117
|
setFlowContainer: handleSuccess,
|
|
921
1118
|
body: submitData
|
|
@@ -1082,7 +1279,20 @@ var NodeInput = ({
|
|
|
1082
1279
|
case UiNodeInputAttributesTypeEnum.Submit:
|
|
1083
1280
|
case UiNodeInputAttributesTypeEnum.Button:
|
|
1084
1281
|
if (isSocial) {
|
|
1085
|
-
return
|
|
1282
|
+
return /* @__PURE__ */ jsx(
|
|
1283
|
+
Node2.OidcButton,
|
|
1284
|
+
{
|
|
1285
|
+
node,
|
|
1286
|
+
attributes: attrs,
|
|
1287
|
+
onClick: () => {
|
|
1288
|
+
setValue(
|
|
1289
|
+
"provider",
|
|
1290
|
+
node.attributes.value
|
|
1291
|
+
);
|
|
1292
|
+
setValue("method", node.group);
|
|
1293
|
+
}
|
|
1294
|
+
}
|
|
1295
|
+
);
|
|
1086
1296
|
}
|
|
1087
1297
|
if (isResendNode || isScreenSelectionNode) {
|
|
1088
1298
|
return null;
|
|
@@ -1172,6 +1382,37 @@ var Node = ({ node, onClick }) => {
|
|
|
1172
1382
|
}
|
|
1173
1383
|
return null;
|
|
1174
1384
|
};
|
|
1385
|
+
function OryTwoStepCardStateMethodActive({
|
|
1386
|
+
formState
|
|
1387
|
+
}) {
|
|
1388
|
+
const { Form } = useComponents();
|
|
1389
|
+
const { flow, flowType, dispatchFormState } = useOryFlow();
|
|
1390
|
+
const { ui } = flow;
|
|
1391
|
+
const nodeSorter = useNodeSorter();
|
|
1392
|
+
const sortNodes = (a, b) => nodeSorter(a, b, { flowType });
|
|
1393
|
+
const groupsToShow = useNodeGroupsWithVisibleNodes(ui.nodes);
|
|
1394
|
+
const finalNodes = getFinalNodes(groupsToShow, formState.method);
|
|
1395
|
+
return /* @__PURE__ */ jsxs(OryCard, { children: [
|
|
1396
|
+
/* @__PURE__ */ jsx(OryCardHeader, {}),
|
|
1397
|
+
/* @__PURE__ */ jsxs(OryCardContent, { children: [
|
|
1398
|
+
/* @__PURE__ */ jsx(OryCardValidationMessages, {}),
|
|
1399
|
+
/* @__PURE__ */ jsx(
|
|
1400
|
+
OryForm,
|
|
1401
|
+
{
|
|
1402
|
+
"data-testid": `ory/form/methods/local`,
|
|
1403
|
+
onAfterSubmit: handleAfterFormSubmit(dispatchFormState),
|
|
1404
|
+
children: /* @__PURE__ */ jsxs(Form.Group, { children: [
|
|
1405
|
+
ui.nodes.filter(
|
|
1406
|
+
(n) => isUiNodeScriptAttributes(n.attributes) || n.group === UiNodeGroupEnum.Default || n.group === UiNodeGroupEnum.Profile
|
|
1407
|
+
).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k)),
|
|
1408
|
+
finalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k))
|
|
1409
|
+
] })
|
|
1410
|
+
}
|
|
1411
|
+
)
|
|
1412
|
+
] }),
|
|
1413
|
+
/* @__PURE__ */ jsx(OryCardFooter, {})
|
|
1414
|
+
] });
|
|
1415
|
+
}
|
|
1175
1416
|
function OryFormOidcButtons() {
|
|
1176
1417
|
const {
|
|
1177
1418
|
flow: { ui }
|
|
@@ -1202,8 +1443,10 @@ function OryFormOidcButtons() {
|
|
|
1202
1443
|
}
|
|
1203
1444
|
function OryFormSocialButtonsForm() {
|
|
1204
1445
|
const {
|
|
1205
|
-
flow: { ui }
|
|
1446
|
+
flow: { ui },
|
|
1447
|
+
formState
|
|
1206
1448
|
} = useOryFlow();
|
|
1449
|
+
console.log(formState);
|
|
1207
1450
|
const filteredNodes = ui.nodes.filter(
|
|
1208
1451
|
(node) => node.group === UiNodeGroupEnum.Saml || node.group === UiNodeGroupEnum.Oidc
|
|
1209
1452
|
);
|
|
@@ -1212,39 +1455,6 @@ function OryFormSocialButtonsForm() {
|
|
|
1212
1455
|
}
|
|
1213
1456
|
return /* @__PURE__ */ jsx(OryFormProvider, { children: /* @__PURE__ */ jsx(OryForm, { "data-testid": `ory/form/methods/oidc-saml`, children: /* @__PURE__ */ jsx(OryFormOidcButtons, {}) }) });
|
|
1214
1457
|
}
|
|
1215
|
-
function OryTwoStepCardStateMethodActive({
|
|
1216
|
-
formState
|
|
1217
|
-
}) {
|
|
1218
|
-
const { Form } = useComponents();
|
|
1219
|
-
const { flow, flowType, dispatchFormState } = useOryFlow();
|
|
1220
|
-
const { ui } = flow;
|
|
1221
|
-
const nodeSorter = useNodeSorter();
|
|
1222
|
-
const sortNodes = (a, b) => nodeSorter(a, b, { flowType });
|
|
1223
|
-
const groupsToShow = useNodeGroupsWithVisibleNodes(ui.nodes);
|
|
1224
|
-
const finalNodes = getFinalNodes(groupsToShow, formState.method);
|
|
1225
|
-
const selectedMethodIsSocial = formState.method === UiNodeGroupEnum.Oidc || formState.method === UiNodeGroupEnum.Saml;
|
|
1226
|
-
return /* @__PURE__ */ jsxs(OryCard, { children: [
|
|
1227
|
-
/* @__PURE__ */ jsx(OryCardHeader, {}),
|
|
1228
|
-
/* @__PURE__ */ jsxs(OryCardContent, { children: [
|
|
1229
|
-
/* @__PURE__ */ jsx(OryCardValidationMessages, {}),
|
|
1230
|
-
selectedMethodIsSocial && /* @__PURE__ */ jsx(OryFormSocialButtonsForm, {}),
|
|
1231
|
-
/* @__PURE__ */ jsx(
|
|
1232
|
-
OryForm,
|
|
1233
|
-
{
|
|
1234
|
-
"data-testid": `ory/form/methods/local`,
|
|
1235
|
-
onAfterSubmit: handleAfterFormSubmit(dispatchFormState),
|
|
1236
|
-
children: /* @__PURE__ */ jsxs(Form.Group, { children: [
|
|
1237
|
-
ui.nodes.filter(
|
|
1238
|
-
(n) => isUiNodeScriptAttributes(n.attributes) || n.group === UiNodeGroupEnum.Captcha || n.group === UiNodeGroupEnum.Default || n.group === UiNodeGroupEnum.Profile
|
|
1239
|
-
).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k)),
|
|
1240
|
-
finalNodes.sort(sortNodes).map((node, k) => /* @__PURE__ */ jsx(Node, { node }, k))
|
|
1241
|
-
] })
|
|
1242
|
-
}
|
|
1243
|
-
)
|
|
1244
|
-
] }),
|
|
1245
|
-
/* @__PURE__ */ jsx(OryCardFooter, {})
|
|
1246
|
-
] });
|
|
1247
|
-
}
|
|
1248
1458
|
function OryTwoStepCardStateProvideIdentifier() {
|
|
1249
1459
|
const { Form, Card } = useComponents();
|
|
1250
1460
|
const { flowType, flow, dispatchFormState } = useOryFlow();
|
|
@@ -4304,6 +4514,6 @@ var OryLocales = {
|
|
|
4304
4514
|
sv: sv_default
|
|
4305
4515
|
};
|
|
4306
4516
|
|
|
4307
|
-
export { HeadlessPageHeader, OryCard, OryCardContent, OryCardFooter, OryCardHeader, OryCardValidationMessages, OryConsentCard, OryForm, OryFormGroupDivider, OryFormGroups, OryFormOidcButtons, OryFormSection, OryFormSocialButtonsForm, OryLocales, OryProvider, OrySettingsCard, OryTwoStepCard, messageTestId, uiTextToFormattedMessage, useComponents, useNodeSorter, useOryFlow };
|
|
4517
|
+
export { HeadlessPageHeader, OryCard, OryCardContent, OryCardFooter, OryCardHeader, OryCardValidationMessages, OryConfigurationProvider, OryConsentCard, OryForm, OryFormGroupDivider, OryFormGroups, OryFormOidcButtons, OryFormSection, OryFormSocialButtonsForm, OryLocales, OryProvider, OrySettingsCard, OryTwoStepCard, messageTestId, uiTextToFormattedMessage, useComponents, useNodeSorter, useOryConfiguration, useOryFlow };
|
|
4308
4518
|
//# sourceMappingURL=index.mjs.map
|
|
4309
4519
|
//# sourceMappingURL=index.mjs.map
|