@asgardeo/react 0.6.25 → 0.6.27

package/dist/cjs/index.js

@@ -7042,9 +7042,6 @@ var matchesSocialProvider = (actionId, eventType, buttonText, provider, authType
 };
 var createAuthComponentFromFlow = (component, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, authType, options = {}) => {
   const key = options.key || component.id;
-  if (authType === "signin") {
-    console.log("Creating sign-in component for:", component);
-  }
   switch (component.type) {
     case import_browser45.EmbeddedFlowComponentTypeV2.TextInput:
     case import_browser45.EmbeddedFlowComponentTypeV2.PasswordInput:
@@ -7078,9 +7075,7 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
         if (options.onSubmit) {
           const formData = {};
           Object.keys(formValues).forEach((field) => {
-            if (formValues[field]) {
-              formData[field] = formValues[field];
-            }
+            formData[field] = formValues[field];
           });
           options.onSubmit(component, formData, shouldSkipValidation);
         }
@@ -7248,17 +7243,66 @@ var resolveTranslationsInArray = (items, t, properties) => {
 var resolveTranslationsInArray_default = resolveTranslationsInArray;
 
 // src/utils/v2/flowTransformer.ts
+var createInputRefMapping = (response) => {
+  const mapping = /* @__PURE__ */ new Map();
+  if (response?.data?.inputs && Array.isArray(response.data.inputs)) {
+    response.data.inputs.forEach((input) => {
+      if (input.ref && input.identifier) {
+        mapping.set(input.ref, input.identifier);
+      }
+    });
+  }
+  return mapping;
+};
+var createActionRefMapping = (response) => {
+  const mapping = /* @__PURE__ */ new Map();
+  if (response?.data?.actions && Array.isArray(response.data.actions)) {
+    response.data.actions.forEach((action) => {
+      if (action.ref && action.nextNode) {
+        mapping.set(action.ref, action.nextNode);
+      }
+    });
+  }
+  return mapping;
+};
+var applyInputRefMapping = (components, refMapping, actionMapping) => {
+  return components.map((component) => {
+    const transformedComponent = { ...component };
+    if (transformedComponent.ref && refMapping.has(transformedComponent.ref)) {
+      transformedComponent.ref = refMapping.get(transformedComponent.ref);
+    }
+    if (transformedComponent.type === "ACTION" && transformedComponent.id && actionMapping.has(transformedComponent.id)) {
+      transformedComponent.actionRef = actionMapping.get(transformedComponent.id);
+    }
+    if (transformedComponent.components && Array.isArray(transformedComponent.components)) {
+      transformedComponent.components = applyInputRefMapping(
+        transformedComponent.components,
+        refMapping,
+        actionMapping
+      );
+    }
+    return transformedComponent;
+  });
+};
 var transformComponents = (response, t, resolveTranslations = true) => {
   if (!response?.data?.meta?.components) {
     return [];
   }
-  const components = response.data.meta.components;
+  let components = response.data.meta.components;
+  const refMapping = createInputRefMapping(response);
+  const actionMapping = createActionRefMapping(response);
+  if (refMapping.size > 0 || actionMapping.size > 0) {
+    components = applyInputRefMapping(components, refMapping, actionMapping);
+  }
   return resolveTranslations ? resolveTranslationsInArray_default(components, t) : components;
 };
 var extractErrorMessage = (error, t, defaultErrorKey = "errors.flow.generic") => {
   if (error && typeof error === "object" && error.failureReason) {
     return error.failureReason;
   }
+  if (error instanceof Error && error.message) {
+    return error.message;
+  }
   return t(defaultErrorKey);
 };
 var checkForErrorResponse = (response, t, defaultErrorKey = "errors.flow.generic") => {
@@ -7354,6 +7398,7 @@ var BaseSignInContent2 = ({
   components = [],
   onSubmit,
   onError,
+  error: externalError,
   className = "",
   inputClassName = "",
   buttonClassName = "",
@@ -7372,10 +7417,12 @@ var BaseSignInContent2 = ({
   const { subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages } = useFlow_default();
   const styles = BaseSignIn_styles_default(theme, theme.vars.colors.text.primary);
   const [isSubmitting, setIsSubmitting] = (0, import_react58.useState)(false);
+  const [apiError, setApiError] = (0, import_react58.useState)(null);
   const isLoading = externalIsLoading || isSubmitting;
   const handleError = (0, import_react58.useCallback)(
     (error) => {
-      const errorMessage = extractErrorMessage(error, t);
+      const errorMessage = error?.failureReason || extractErrorMessage(error, t);
+      setApiError(error instanceof Error ? error : new Error(errorMessage));
       clearMessages();
       addMessage({
         type: "error",
@@ -7389,7 +7436,7 @@ var BaseSignInContent2 = ({
       const fields = [];
       const processComponents = (comps) => {
         comps.forEach((component) => {
-          if (component.type === "TEXT_INPUT" || component.type === "PASSWORD_INPUT") {
+          if (component.type === "TEXT_INPUT" || component.type === "PASSWORD_INPUT" || component.type === "EMAIL_INPUT") {
             const identifier = component.ref;
             fields.push({
               name: identifier,
@@ -7399,6 +7446,9 @@ var BaseSignInContent2 = ({
                 if (component.required && (!value || value.trim() === "")) {
                   return t("validations.required.field.error");
                 }
+                if ((component.type === "EMAIL_INPUT" || component.variant === "EMAIL") && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+                  return t("field.email.invalid");
+                }
                 return null;
               }
             });
@@ -7446,6 +7496,7 @@ var BaseSignInContent2 = ({
       }
     }
     setIsSubmitting(true);
+    setApiError(null);
     clearMessages();
     console.log("Submitting component:", component, "with data:", data);
     try {
@@ -7532,14 +7583,18 @@ var BaseSignInContent2 = ({
   if (children) {
     const renderProps = {
       values: formValues,
-      errors: formErrors,
+      fieldErrors: formErrors,
+      error: apiError,
       touched: touchedFields,
       isValid: isFormValid,
       isLoading,
       components,
       handleInputChange,
       handleSubmit,
-      validateForm,
+      validateForm: () => {
+        const result = validateForm();
+        return { isValid: result.isValid, fieldErrors: result.errors };
+      },
       title: flowTitle || t("signin.heading"),
       subtitle: flowSubtitle || t("signin.subheading"),
       messages: flowMessages || []
@@ -7565,6 +7620,7 @@ var BaseSignInContent2 = ({
       showSubtitle && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Typography_default, { variant: "body1", className: styles.subtitle, children: subtitle })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(Card_default.Content, { children: [
+      externalError && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: styles.flowMessagesContainer, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Alert_default, { variant: "error", className: (0, import_css36.cx)(styles.flowMessageItem, messageClasses), children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Alert_default.Description, { children: externalError.message }) }) }),
       flowMessages && flowMessages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: styles.flowMessagesContainer, children: flowMessages.map((message, index) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
         Alert_default,
         {
@@ -7664,7 +7720,6 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
     window?.history?.replaceState({}, "", url.toString());
   };
   const handleOAuthError = (error, errorDescription) => {
-    console.warn("[SignIn] OAuth error detected:", error);
     clearFlowState();
     const errorMessage = errorDescription || `OAuth error: ${error}`;
     const err = new import_browser48.AsgardeoRuntimeError(errorMessage, "SIGN_IN_ERROR", "react");
@@ -7750,9 +7805,8 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
     } catch (error) {
       const err = error;
       clearFlowState();
-      const errorMessage = err instanceof Error ? err.message : String(err);
-      const displayError = new import_browser48.AsgardeoRuntimeError(errorMessage, "SIGN_IN_ERROR", "react");
-      setError(displayError);
+      const errorMessage = err?.failureReason || (err instanceof Error ? err.message : String(err));
+      setError(new Error(errorMessage));
       initializationAttemptedRef.current = false;
       return;
     }
@@ -7760,10 +7814,6 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
   const handleSubmit = async (payload) => {
     const effectiveFlowId = payload.flowId || currentFlowId;
     if (!effectiveFlowId) {
-      console.error("[SignIn] handleSubmit - ERROR: No flowId available", {
-        payloadFlowId: payload.flowId,
-        currentFlowId
-      });
       throw new Error("No active flow ID");
     }
     try {
@@ -7776,18 +7826,17 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
       if (handleRedirection(response)) {
         return;
       }
-      const { flowId, components: components2 } = normalizeFlowResponse(response, t, {
+      const { flowId, components: components2, ...rest } = normalizeFlowResponse(response, t, {
         resolveTranslations: !children
       });
       if (response.flowStatus === import_browser48.EmbeddedSignInFlowStatusV2.Error) {
-        console.error("[SignIn] Flow returned Error status, clearing flow state");
         clearFlowState();
         const failureReason = response?.failureReason;
         const errorMessage = failureReason || "Authentication flow failed. Please try again.";
-        const err = new import_browser48.AsgardeoRuntimeError(errorMessage, "SIGN_IN_ERROR", "react");
+        const err = new Error(errorMessage);
         setError(err);
         cleanupFlowUrlParams();
-        return;
+        throw err;
       }
       if (response.flowStatus === import_browser48.EmbeddedSignInFlowStatusV2.Complete) {
         const redirectUrl = response?.redirectUrl || response?.redirect_uri;
@@ -7804,8 +7853,6 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
         });
         if (finalRedirectUrl && window?.location) {
           window.location.href = finalRedirectUrl;
-        } else {
-          console.warn("[SignIn] Flow completed but no redirect URL available");
         }
         return;
       }
@@ -7818,16 +7865,14 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
     } catch (error) {
       const err = error;
       clearFlowState();
-      const errorMessage = err instanceof Error ? err.message : String(err);
-      const displayError = new import_browser48.AsgardeoRuntimeError(errorMessage, "SIGN_IN_ERROR", "react");
-      setError(displayError);
+      const errorMessage = err?.failureReason || (err instanceof Error ? err.message : String(err));
+      setError(new Error(errorMessage));
       return;
     } finally {
       setIsSubmitting(false);
     }
   };
   const handleError = (error) => {
-    console.error("Authentication error:", error);
     setError(error);
   };
   (0, import_react59.useEffect)(() => {
@@ -7857,7 +7902,6 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
       }
     };
     handleSubmit(submitPayload).catch((error) => {
-      console.error("[SignIn] OAuth callback submission failed:", error);
       cleanupOAuthUrlParams(true);
     });
   }, [isFlowInitialized, currentFlowId, isInitialized, isLoading, isSubmitting, signIn]);
@@ -7879,6 +7923,7 @@ var SignIn = ({ className, size = "medium", onSuccess, onError, variant, childre
       isLoading: isLoading || !isInitialized || !isFlowInitialized,
       onSubmit: handleSubmit,
       onError: handleError,
+      error: flowError,
       className,
       size,
       variant
@@ -9092,6 +9137,7 @@ var BaseSignUpContent2 = ({
   onError,
   onFlowChange,
   onComplete,
+  error: externalError,
   className = "",
   inputClassName = "",
   buttonClassName = "",
@@ -9111,7 +9157,8 @@ var BaseSignUpContent2 = ({
   const styles = BaseSignUp_styles_default(theme, colorScheme);
   const handleError = (0, import_react62.useCallback)(
     (error) => {
-      const errorMessage = extractErrorMessage(error, t);
+      const errorMessage = error?.failureReason || extractErrorMessage(error, t);
+      setApiError(error instanceof Error ? error : new Error(errorMessage));
       clearMessages();
       addMessage({
         type: "error",
@@ -9123,7 +9170,7 @@ var BaseSignUpContent2 = ({
   const [isLoading, setIsLoading] = (0, import_react62.useState)(false);
   const [isFlowInitialized, setIsFlowInitialized] = (0, import_react62.useState)(false);
   const [currentFlow, setCurrentFlow] = (0, import_react62.useState)(null);
-  const [formData, setFormData] = (0, import_react62.useState)({});
+  const [apiError, setApiError] = (0, import_react62.useState)(null);
   const initializationAttemptedRef = (0, import_react62.useRef)(false);
   const normalizeFlowResponseLocal = (0, import_react62.useCallback)(
     (response) => {
@@ -9156,21 +9203,19 @@ var BaseSignUpContent2 = ({
       const fields = [];
       const processComponents = (comps) => {
         comps.forEach((component) => {
-          if (component.type === import_browser59.EmbeddedFlowComponentTypeV2.TextInput) {
+          if (component.type === import_browser59.EmbeddedFlowComponentTypeV2.TextInput || component.type === import_browser59.EmbeddedFlowComponentTypeV2.PasswordInput || component.type === import_browser59.EmbeddedFlowComponentTypeV2.EmailInput) {
+            const fieldName = component.ref || component.id;
             fields.push({
-              name: component.id,
+              name: fieldName,
               required: component.required || false,
               initialValue: "",
               validator: (value) => {
                 if (component.required && (!value || value.trim() === "")) {
                   return t("validations.required.field.error");
                 }
-                if (component.variant === "EMAIL" && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+                if ((component.type === import_browser59.EmbeddedFlowComponentTypeV2.EmailInput || component.variant === "EMAIL") && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
                   return t("field.email.invalid");
                 }
-                if (component.type === "PASSWORD_INPUT" && value && value.length < 8) {
-                  return t("field.password.weak");
-                }
                 return null;
               }
             });
@@ -9190,7 +9235,7 @@ var BaseSignUpContent2 = ({
     initialValues: {},
     fields: formFields,
     validateOnBlur: true,
-    validateOnChange: true,
+    validateOnChange: false,
     requiredMessage: t("validations.required.field.error")
   });
   const {
@@ -9222,6 +9267,8 @@ var BaseSignUpContent2 = ({
   );
   const handleInputChange = (name, value) => {
     setFormValue(name, value);
+  };
+  const handleInputBlur = (name) => {
     setFormTouched(name, true);
   };
   const handleSubmit = async (component, data, skipValidation) => {
@@ -9236,6 +9283,7 @@ var BaseSignUpContent2 = ({
       }
     }
     setIsLoading(true);
+    setApiError(null);
     clearMessages();
     try {
       const filteredInputs = {};
@@ -9298,7 +9346,7 @@ var BaseSignUpContent2 = ({
               code,
               state
             },
-            actionId: ""
+            action: ""
           };
           try {
             const continueResponse = await onSubmit(payload);
@@ -9358,7 +9406,7 @@ var BaseSignUpContent2 = ({
                     code,
                     state
                   },
-                  actionId: ""
+                  action: ""
                 };
                 try {
                   const continueResponse = await onSubmit(payload);
@@ -9425,6 +9473,7 @@ var BaseSignUpContent2 = ({
       {
         buttonClassName: buttonClasses,
         inputClassName: inputClasses,
+        onInputBlur: handleInputBlur,
         onSubmit: handleSubmit,
         size,
         variant
@@ -9440,7 +9489,8 @@ var BaseSignUpContent2 = ({
       variant,
       inputClasses,
       buttonClasses,
-      handleSubmit
+      handleSubmit,
+      handleInputBlur
     ]
   );
   const getUrlParams = () => {
@@ -9460,6 +9510,7 @@ var BaseSignUpContent2 = ({
       initializationAttemptedRef.current = true;
       (async () => {
         setIsLoading(true);
+        setApiError(null);
         clearMessages();
         try {
           const rawResponse = await onInitialize();
@@ -9497,14 +9548,18 @@ var BaseSignUpContent2 = ({
   if (children) {
     const renderProps = {
       values: formValues,
-      errors: formErrors,
+      fieldErrors: formErrors,
+      error: apiError,
       touched: touchedFields,
       isValid: isFormValid,
       isLoading,
       components: currentFlow?.data?.components || [],
       handleInputChange,
       handleSubmit,
-      validateForm,
+      validateForm: () => {
+        const result = validateForm();
+        return { isValid: result.isValid, fieldErrors: result.errors };
+      },
       title: flowTitle || t("signup.heading"),
       subtitle: flowSubtitle || t("signup.subheading"),
       messages: flowMessages || []
@@ -9534,6 +9589,7 @@ var BaseSignUpContent2 = ({
       showSubtitle && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typography_default, { variant: "body1", className: styles.subtitle, children: subtitle })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(Card_default.Content, { children: [
+      externalError && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: styles.flowMessagesContainer, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Alert_default, { variant: "error", className: (0, import_css39.cx)(styles.flowMessageItem, messageClasses), children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Alert_default.Description, { children: externalError.message }) }) }),
       flowMessages && flowMessages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: styles.flowMessagesContainer, children: flowMessages.map((message, index) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
         Alert_default,
         {