@asgardeo/react 0.6.23 → 0.6.25
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.
|
@@ -25,7 +25,7 @@ export declare const renderSignInComponents: (components: EmbeddedFlowComponent[
|
|
|
25
25
|
buttonClassName?: string;
|
|
26
26
|
inputClassName?: string;
|
|
27
27
|
onInputBlur?: (name: string) => void;
|
|
28
|
-
onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any
|
|
28
|
+
onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;
|
|
29
29
|
size?: "small" | "medium" | "large";
|
|
30
30
|
variant?: any;
|
|
31
31
|
}) => ReactElement[];
|
|
@@ -36,7 +36,7 @@ export declare const renderSignUpComponents: (components: EmbeddedFlowComponent[
|
|
|
36
36
|
buttonClassName?: string;
|
|
37
37
|
inputClassName?: string;
|
|
38
38
|
onInputBlur?: (name: string) => void;
|
|
39
|
-
onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any
|
|
39
|
+
onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;
|
|
40
40
|
size?: "small" | "medium" | "large";
|
|
41
41
|
variant?: any;
|
|
42
42
|
}) => ReactElement[];
|
package/dist/index.js
CHANGED
|
@@ -6877,9 +6877,10 @@ import {
|
|
|
6877
6877
|
// src/components/presentation/auth/AuthOptionFactory.tsx
|
|
6878
6878
|
import React from "react";
|
|
6879
6879
|
import {
|
|
6880
|
-
AsgardeoRuntimeError as AsgardeoRuntimeError7,
|
|
6881
6880
|
FieldType as FieldType7,
|
|
6882
|
-
EmbeddedFlowComponentTypeV2 as EmbeddedFlowComponentType
|
|
6881
|
+
EmbeddedFlowComponentTypeV2 as EmbeddedFlowComponentType,
|
|
6882
|
+
EmbeddedFlowActionVariantV2 as EmbeddedFlowActionVariant,
|
|
6883
|
+
EmbeddedFlowEventTypeV2 as EmbeddedFlowEventType
|
|
6883
6884
|
} from "@asgardeo/browser";
|
|
6884
6885
|
|
|
6885
6886
|
// src/components/adapters/SmsOtpButton.tsx
|
|
@@ -6944,9 +6945,12 @@ var getTypographyVariant = (variant) => {
|
|
|
6944
6945
|
};
|
|
6945
6946
|
return variantMap[variant] || "h3";
|
|
6946
6947
|
};
|
|
6947
|
-
var matchesSocialProvider = (actionId, eventType, buttonText, provider, authType) => {
|
|
6948
|
+
var matchesSocialProvider = (actionId, eventType, buttonText, provider, authType, componentVariant) => {
|
|
6948
6949
|
const providerId = `${provider}_auth`;
|
|
6949
6950
|
const providerMatches = actionId === providerId || eventType === providerId;
|
|
6951
|
+
if (componentVariant?.toUpperCase() === EmbeddedFlowActionVariant.Social) {
|
|
6952
|
+
return buttonText.toLowerCase().includes(provider);
|
|
6953
|
+
}
|
|
6950
6954
|
if (authType === "signup") {
|
|
6951
6955
|
return providerMatches || buttonText.toLowerCase().includes(provider);
|
|
6952
6956
|
}
|
|
@@ -6981,6 +6985,11 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
|
|
|
6981
6985
|
return React.cloneElement(field, { key });
|
|
6982
6986
|
}
|
|
6983
6987
|
case EmbeddedFlowComponentType.Action: {
|
|
6988
|
+
const actionId = component.id;
|
|
6989
|
+
const eventType = component.eventType || "";
|
|
6990
|
+
const buttonText = component.label || "";
|
|
6991
|
+
const componentVariant = component.variant || "";
|
|
6992
|
+
const shouldSkipValidation = eventType.toUpperCase() === EmbeddedFlowEventType.Trigger;
|
|
6984
6993
|
const handleClick = () => {
|
|
6985
6994
|
if (options.onSubmit) {
|
|
6986
6995
|
const formData = {};
|
|
@@ -6989,28 +6998,25 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
|
|
|
6989
6998
|
formData[field] = formValues[field];
|
|
6990
6999
|
}
|
|
6991
7000
|
});
|
|
6992
|
-
options.onSubmit(component, formData);
|
|
7001
|
+
options.onSubmit(component, formData, shouldSkipValidation);
|
|
6993
7002
|
}
|
|
6994
7003
|
};
|
|
6995
|
-
|
|
6996
|
-
const eventType = component.eventType || "";
|
|
6997
|
-
const buttonText = component.label || "";
|
|
6998
|
-
if (matchesSocialProvider(actionId, eventType, buttonText, "google", authType)) {
|
|
7004
|
+
if (matchesSocialProvider(actionId, eventType, buttonText, "google", authType, componentVariant)) {
|
|
6999
7005
|
return /* @__PURE__ */ jsx55(GoogleButton_default, { onClick: handleClick, className: options.buttonClassName }, key);
|
|
7000
7006
|
}
|
|
7001
|
-
if (matchesSocialProvider(actionId, eventType, buttonText, "github", authType)) {
|
|
7007
|
+
if (matchesSocialProvider(actionId, eventType, buttonText, "github", authType, componentVariant)) {
|
|
7002
7008
|
return /* @__PURE__ */ jsx55(GitHubButton_default, { onClick: handleClick, className: options.buttonClassName }, key);
|
|
7003
7009
|
}
|
|
7004
|
-
if (matchesSocialProvider(actionId, eventType, buttonText, "facebook", authType)) {
|
|
7010
|
+
if (matchesSocialProvider(actionId, eventType, buttonText, "facebook", authType, componentVariant)) {
|
|
7005
7011
|
return /* @__PURE__ */ jsx55(FacebookButton_default, { onClick: handleClick, className: options.buttonClassName }, key);
|
|
7006
7012
|
}
|
|
7007
|
-
if (matchesSocialProvider(actionId, eventType, buttonText, "microsoft", authType)) {
|
|
7013
|
+
if (matchesSocialProvider(actionId, eventType, buttonText, "microsoft", authType, componentVariant)) {
|
|
7008
7014
|
return /* @__PURE__ */ jsx55(MicrosoftButton_default, { onClick: handleClick, className: options.buttonClassName }, key);
|
|
7009
7015
|
}
|
|
7010
|
-
if (matchesSocialProvider(actionId, eventType, buttonText, "linkedin", authType)) {
|
|
7016
|
+
if (matchesSocialProvider(actionId, eventType, buttonText, "linkedin", authType, componentVariant)) {
|
|
7011
7017
|
return /* @__PURE__ */ jsx55(LinkedInButton_default, { onClick: handleClick, className: options.buttonClassName }, key);
|
|
7012
7018
|
}
|
|
7013
|
-
if (matchesSocialProvider(actionId, eventType, buttonText, "ethereum", authType)) {
|
|
7019
|
+
if (matchesSocialProvider(actionId, eventType, buttonText, "ethereum", authType, componentVariant)) {
|
|
7014
7020
|
return /* @__PURE__ */ jsx55(SignInWithEthereumButton_default, { onClick: handleClick, className: options.buttonClassName }, key);
|
|
7015
7021
|
}
|
|
7016
7022
|
if (actionId === "prompt_mobile" || eventType === "prompt_mobile") {
|
|
@@ -7034,6 +7040,9 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
|
|
|
7034
7040
|
const variant = getTypographyVariant(component.variant);
|
|
7035
7041
|
return /* @__PURE__ */ jsx55(Typography_default, { variant, children: component.label || "" }, key);
|
|
7036
7042
|
}
|
|
7043
|
+
case EmbeddedFlowComponentType.Divider: {
|
|
7044
|
+
return /* @__PURE__ */ jsx55(Divider_default, { children: component.label || "" }, key);
|
|
7045
|
+
}
|
|
7037
7046
|
case EmbeddedFlowComponentType.Block: {
|
|
7038
7047
|
if (component.components && component.components.length > 0) {
|
|
7039
7048
|
const blockComponents = component.components.map(
|
|
@@ -7052,17 +7061,13 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
|
|
|
7052
7061
|
}
|
|
7053
7062
|
)
|
|
7054
7063
|
).filter(Boolean);
|
|
7055
|
-
return /* @__PURE__ */ jsx55("
|
|
7064
|
+
return /* @__PURE__ */ jsx55("form", { id: component.id, children: blockComponents }, key);
|
|
7056
7065
|
}
|
|
7057
7066
|
return null;
|
|
7058
7067
|
}
|
|
7059
7068
|
default:
|
|
7060
|
-
|
|
7061
|
-
|
|
7062
|
-
`${authType === "signin" ? "SignIn" : "SignUp"}-UnsupportedComponentType-001`,
|
|
7063
|
-
"react",
|
|
7064
|
-
`Something went wrong while rendering the ${authType} component. Please try again later.`
|
|
7065
|
-
);
|
|
7069
|
+
console.warn(`Unsupported component type: ${component.type}. Skipping render.`);
|
|
7070
|
+
return null;
|
|
7066
7071
|
}
|
|
7067
7072
|
};
|
|
7068
7073
|
var renderSignInComponents = (components, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => components.map(
|
|
@@ -7348,11 +7353,13 @@ var BaseSignInContent2 = ({
|
|
|
7348
7353
|
const handleInputBlur = (name) => {
|
|
7349
7354
|
setFormTouched(name, true);
|
|
7350
7355
|
};
|
|
7351
|
-
const handleSubmit = async (component, data) => {
|
|
7352
|
-
|
|
7353
|
-
|
|
7354
|
-
|
|
7355
|
-
|
|
7356
|
+
const handleSubmit = async (component, data, skipValidation) => {
|
|
7357
|
+
if (!skipValidation) {
|
|
7358
|
+
touchAllFields();
|
|
7359
|
+
const validation = validateForm();
|
|
7360
|
+
if (!validation.isValid) {
|
|
7361
|
+
return;
|
|
7362
|
+
}
|
|
7356
7363
|
}
|
|
7357
7364
|
setIsSubmitting(true);
|
|
7358
7365
|
clearMessages();
|
|
@@ -9150,10 +9157,17 @@ var BaseSignUpContent2 = ({
|
|
|
9150
9157
|
setFormValue(name, value);
|
|
9151
9158
|
setFormTouched(name, true);
|
|
9152
9159
|
};
|
|
9153
|
-
const handleSubmit = async (component, data) => {
|
|
9160
|
+
const handleSubmit = async (component, data, skipValidation) => {
|
|
9154
9161
|
if (!currentFlow) {
|
|
9155
9162
|
return;
|
|
9156
9163
|
}
|
|
9164
|
+
if (!skipValidation) {
|
|
9165
|
+
touchAllFields();
|
|
9166
|
+
const validation = validateForm();
|
|
9167
|
+
if (!validation.isValid) {
|
|
9168
|
+
return;
|
|
9169
|
+
}
|
|
9170
|
+
}
|
|
9157
9171
|
setIsLoading(true);
|
|
9158
9172
|
clearMessages();
|
|
9159
9173
|
try {
|