@thunderid/react 0.1.0 → 0.2.0

package/dist/components/presentation/auth/SignUp/v1/BaseSignUp.js

@@ -0,0 +1,446 @@
+import FlowProvider_default from "../../../../../contexts/Flow/FlowProvider.js";
+import useThunderID_default from "../../../../../contexts/ThunderID/useThunderID.js";
+import useFlow_default from "../../../../../contexts/Flow/useFlow.js";
+import useTheme_default from "../../../../../contexts/Theme/useTheme.js";
+import useTranslation_default from "../../../../../hooks/useTranslation.js";
+import { useForm } from "../../../../../hooks/useForm.js";
+import Spinner_default from "../../../../primitives/Spinner/Spinner.js";
+import Typography_default from "../../../../primitives/Typography/Typography.js";
+import Alert_default from "../../../../primitives/Alert/Alert.js";
+import Card_default from "../../../../primitives/Card/Card.js";
+import Logo_default from "../../../../primitives/Logo/Logo.js";
+import { renderSignUpComponents } from "./SignUpOptionFactory.js";
+import BaseSignUp_styles_default from "../BaseSignUp.styles.js";
+import { EmbeddedFlowComponentType, EmbeddedFlowResponseType, EmbeddedFlowStatus, createPackageComponentLogger, withVendorCSSClassPrefix } from "@thunderid/browser";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "@emotion/css";
+
+//#region src/components/presentation/auth/SignUp/v1/BaseSignUp.tsx
+const logger$1 = createPackageComponentLogger("@thunderid/react", "BaseSignUp");
+/**
+* Component that consumes FlowContext and renders the sign-up UI.
+*
+* @internal
+*/
+const BaseSignUpContent = ({ afterSignUpUrl, onInitialize, onSubmit, onError, onFlowChange, onComplete, className = "", inputClassName = "", buttonClassName = "", errorClassName = "", messageClassName = "", size = "medium", variant = "outlined", isInitialized, children, showTitle = true, showSubtitle = true }) => {
+	const { theme, colorScheme } = useTheme_default();
+	const { t } = useTranslation_default();
+	const { subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages } = useFlow_default();
+	useThunderID_default();
+	const styles = BaseSignUp_styles_default(theme, colorScheme);
+	const handleError = useCallback((error) => {
+		let errorMessage = t("errors.signup.flow.failure");
+		if (error && typeof error === "object") {
+			if (error.code && (error.message || error.description)) errorMessage = error.description || error.message;
+			else if (error instanceof Error && error.name === "ThunderIDAPIError") try {
+				const errorResponse = JSON.parse(error.message);
+				if (errorResponse.description) errorMessage = errorResponse.description;
+				else if (errorResponse.message) errorMessage = errorResponse.message;
+				else errorMessage = error.message;
+			} catch {
+				errorMessage = error.message;
+			}
+			else if (error.message) errorMessage = error.message;
+		} else if (typeof error === "string") errorMessage = error;
+		clearMessages();
+		addMessage({
+			message: errorMessage,
+			type: "error"
+		});
+	}, [
+		t,
+		addMessage,
+		clearMessages
+	]);
+	const [isLoading, setIsLoading] = useState(false);
+	const [isFlowInitialized, setIsFlowInitialized] = useState(false);
+	const [currentFlow, setCurrentFlow] = useState(null);
+	const initializationAttemptedRef = useRef(false);
+	/**
+	* Extract form fields from flow components
+	*/
+	const extractFormFields = useCallback((components) => {
+		const fields = [];
+		const processComponents = (comps) => {
+			comps.forEach((component) => {
+				if (component.type === EmbeddedFlowComponentType.Input) {
+					const config = component.config || {};
+					fields.push({
+						initialValue: config.defaultValue || "",
+						name: config.name || component.id,
+						required: config.required || false,
+						validator: (value) => {
+							if (config.required && (!value || value.trim() === "")) return t("validations.required.field.error");
+							if (config.type === "email" && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) return t("field.email.invalid");
+							if (config.type === "password" && value && value.length < 8) return t("field.password.weak");
+							return null;
+						}
+					});
+				}
+				if (component.components && Array.isArray(component.components)) processComponents(component.components);
+			});
+		};
+		processComponents(components);
+		return fields;
+	}, [t]);
+	const { values: formValues, touched: touchedFields, errors: formErrors, isValid: isFormValid, setValue: setFormValue, setTouched: setFormTouched, validateForm, reset: resetForm } = useForm({
+		fields: currentFlow?.data?.components ? extractFormFields(currentFlow.data.components) : [],
+		initialValues: {},
+		requiredMessage: t("validations.required.field.error"),
+		validateOnBlur: true,
+		validateOnChange: true
+	});
+	/**
+	* Setup form fields based on the current flow.
+	*/
+	const setupFormFields = useCallback((flowResponse) => {
+		const fields = extractFormFields(flowResponse.data?.components || []);
+		const initialValues = {};
+		fields.forEach((field) => {
+			initialValues[field.name] = field.initialValue || "";
+		});
+		resetForm();
+		Object.keys(initialValues).forEach((key) => {
+			setFormValue(key, initialValues[key]);
+		});
+	}, [
+		extractFormFields,
+		resetForm,
+		setFormValue
+	]);
+	/**
+	* Handle input value changes.
+	*/
+	const handleInputChange = (name, value) => {
+		setFormValue(name, value);
+		setFormTouched(name, true);
+	};
+	/**
+	* Check if the response contains a redirection URL and perform the redirect if necessary.
+	* @param response - The sign-up response
+	* @returns true if a redirect was performed, false otherwise
+	*/
+	const handleRedirectionIfNeeded = (response) => {
+		if (response?.type === EmbeddedFlowResponseType.Redirection && response?.data?.redirectURL) {
+			/**
+			* Open a popup window to handle redirection prompts for social sign-up
+			*/
+			const redirectUrl = response.data.redirectURL;
+			const popup = window.open(redirectUrl, "oauth_popup", "width=500,height=600,scrollbars=yes,resizable=yes");
+			if (!popup) {
+				logger$1.error("Failed to open popup window");
+				return false;
+			}
+			/**
+			* Use `let` for messageHandler and popupMonitor to resolve circular references:
+			* messageHandler <-> cleanup <-> popupMonitor.
+			* All are assigned before any of them can be invoked at runtime.
+			*/
+			let hasProcessedCallback = false;
+			let popupMonitor;
+			let messageHandler;
+			const cleanup = () => {
+				window.removeEventListener("message", messageHandler);
+				if (popupMonitor) clearInterval(popupMonitor);
+			};
+			/**
+			* Add an event listener to the window to capture the message from the popup
+			*/
+			messageHandler = async function messageEventHandler(event) {
+				/**
+				* Check if the message is from our popup window
+				*/
+				if (event.source !== popup) return;
+				/**
+				* Check the origin of the message to ensure it's from a trusted source
+				*/
+				const expectedOrigin = afterSignUpUrl ? new URL(afterSignUpUrl).origin : window.location.origin;
+				if (event.origin !== expectedOrigin && event.origin !== window.location.origin) return;
+				const { code, state } = event.data;
+				if (code && state) {
+					const payload = {
+						...currentFlow.flowId && { flowId: currentFlow.flowId },
+						actionId: "",
+						flowType: currentFlow.flowType || "REGISTRATION",
+						inputs: {
+							code,
+							state
+						}
+					};
+					try {
+						const continueResponse = await onSubmit(payload);
+						onFlowChange?.(continueResponse);
+						if (continueResponse.flowStatus === EmbeddedFlowStatus.Complete) onComplete?.(continueResponse);
+						else if (continueResponse.flowStatus === EmbeddedFlowStatus.Incomplete) {
+							setCurrentFlow(continueResponse);
+							setupFormFields(continueResponse);
+						}
+						popup.close();
+						cleanup();
+					} catch (err) {
+						handleError(err);
+						onError?.(err);
+						popup.close();
+						cleanup();
+					}
+				}
+			};
+			window.addEventListener("message", messageHandler);
+			/**
+			* Monitor popup for closure and URL changes
+			*/
+			popupMonitor = setInterval(async () => {
+				try {
+					if (popup.closed) {
+						cleanup();
+						return;
+					}
+					if (hasProcessedCallback) return;
+					try {
+						const popupUrl = popup.location.href;
+						if (popupUrl && (popupUrl.includes("code=") || popupUrl.includes("error="))) {
+							hasProcessedCallback = true;
+							const url = new URL(popupUrl);
+							const code = url.searchParams.get("code");
+							const state = url.searchParams.get("state");
+							if (url.searchParams.get("error")) {
+								logger$1.error("OAuth error:");
+								popup.close();
+								cleanup();
+								return;
+							}
+							if (code && state) {
+								const payload = {
+									...currentFlow.flowId && { flowId: currentFlow.flowId },
+									actionId: "",
+									flowType: currentFlow.flowType || "REGISTRATION",
+									inputs: {
+										code,
+										state
+									}
+								};
+								try {
+									const continueResponse = await onSubmit(payload);
+									onFlowChange?.(continueResponse);
+									if (continueResponse.flowStatus === EmbeddedFlowStatus.Complete) onComplete?.(continueResponse);
+									else if (continueResponse.flowStatus === EmbeddedFlowStatus.Incomplete) {
+										setCurrentFlow(continueResponse);
+										setupFormFields(continueResponse);
+									}
+									popup.close();
+								} catch (err) {
+									handleError(err);
+									onError?.(err);
+									popup.close();
+								}
+							}
+						}
+					} catch (e) {}
+				} catch (e) {
+					logger$1.error("Error monitoring popup:");
+				}
+			}, 1e3);
+			return true;
+		}
+		return false;
+	};
+	/**
+	* Handle component submission (for buttons outside forms).
+	*/
+	const handleSubmit = async (component, data) => {
+		if (!currentFlow) return;
+		setIsLoading(true);
+		clearMessages();
+		try {
+			const filteredInputs = {};
+			if (data) Object.entries(data).forEach(([key, value]) => {
+				if (value !== null && value !== void 0 && value !== "") filteredInputs[key] = value;
+			});
+			const actionId = component.id;
+			const response = await onSubmit({
+				...currentFlow.flowId && { flowId: currentFlow.flowId },
+				flowType: currentFlow.flowType || "REGISTRATION",
+				inputs: filteredInputs,
+				...actionId && { actionId }
+			});
+			onFlowChange?.(response);
+			if (response.flowStatus === EmbeddedFlowStatus.Complete) {
+				onComplete?.(response);
+				return;
+			}
+			if (response.flowStatus === EmbeddedFlowStatus.Incomplete) {
+				if (handleRedirectionIfNeeded(response)) return;
+				setCurrentFlow(response);
+				setupFormFields(response);
+			}
+		} catch (err) {
+			handleError(err);
+			onError?.(err);
+		} finally {
+			setIsLoading(false);
+		}
+	};
+	const containerClasses = cx([
+		withVendorCSSClassPrefix("signup"),
+		withVendorCSSClassPrefix(`signup--${size}`),
+		withVendorCSSClassPrefix(`signup--${variant}`)
+	], className);
+	const inputClasses = cx([
+		withVendorCSSClassPrefix("signup__input"),
+		size === "small" && withVendorCSSClassPrefix("signup__input--small"),
+		size === "large" && withVendorCSSClassPrefix("signup__input--large")
+	], inputClassName);
+	const buttonClasses = cx([
+		withVendorCSSClassPrefix("signup__button"),
+		size === "small" && withVendorCSSClassPrefix("signup__button--small"),
+		size === "large" && withVendorCSSClassPrefix("signup__button--large")
+	], buttonClassName);
+	const errorClasses = cx([withVendorCSSClassPrefix("signup__error")], errorClassName);
+	const messageClasses = cx([withVendorCSSClassPrefix("signup__messages")], messageClassName);
+	/**
+	* Render form components based on flow data using the factory
+	*/
+	const renderComponents = useCallback((components) => renderSignUpComponents(components, formValues, touchedFields, formErrors, isLoading, isFormValid, handleInputChange, {
+		buttonClassName: buttonClasses,
+		inputClassName: inputClasses,
+		onSubmit: handleSubmit,
+		size,
+		variant
+	}), [
+		formValues,
+		touchedFields,
+		formErrors,
+		isFormValid,
+		isLoading,
+		size,
+		variant,
+		inputClasses,
+		buttonClasses,
+		handleSubmit
+	]);
+	useEffect(() => {
+		if (isInitialized && !isFlowInitialized && !initializationAttemptedRef.current) {
+			initializationAttemptedRef.current = true;
+			(async () => {
+				setIsLoading(true);
+				clearMessages();
+				try {
+					const response = await onInitialize?.();
+					setCurrentFlow(response);
+					setIsFlowInitialized(true);
+					onFlowChange?.(response);
+					if (response.flowStatus === EmbeddedFlowStatus.Complete) {
+						onComplete?.(response);
+						return;
+					}
+					if (response.flowStatus === EmbeddedFlowStatus.Incomplete) setupFormFields(response);
+				} catch (err) {
+					handleError(err);
+					onError?.(err);
+				} finally {
+					setIsLoading(false);
+				}
+			})();
+		}
+	}, [
+		isInitialized,
+		isFlowInitialized,
+		onInitialize,
+		onComplete,
+		onError,
+		onFlowChange,
+		setupFormFields,
+		afterSignUpUrl,
+		t
+	]);
+	if (children) return /* @__PURE__ */ jsx("div", {
+		className: containerClasses,
+		children: children({
+			components: currentFlow?.data?.components || [],
+			errors: formErrors,
+			handleInputChange,
+			handleSubmit,
+			isLoading,
+			isValid: isFormValid,
+			messages: flowMessages || [],
+			subtitle: flowSubtitle || t("signup.subheading"),
+			title: flowTitle || t("signup.heading"),
+			touched: touchedFields,
+			validateForm,
+			values: formValues
+		})
+	});
+	if (!isFlowInitialized && isLoading) return /* @__PURE__ */ jsx(Card_default, {
+		className: cx(containerClasses, styles.card),
+		variant,
+		children: /* @__PURE__ */ jsx(Card_default.Content, { children: /* @__PURE__ */ jsx("div", {
+			className: styles.loadingContainer,
+			children: /* @__PURE__ */ jsx(Spinner_default, { size: "medium" })
+		}) })
+	});
+	if (!currentFlow) return /* @__PURE__ */ jsx(Card_default, {
+		className: cx(containerClasses, styles.card),
+		variant,
+		children: /* @__PURE__ */ jsx(Card_default.Content, { children: /* @__PURE__ */ jsxs(Alert_default, {
+			variant: "error",
+			className: errorClasses,
+			children: [/* @__PURE__ */ jsx(Alert_default.Title, { children: t("errors.heading") }), /* @__PURE__ */ jsx(Alert_default.Description, { children: t("errors.signup.flow.initialization.failure") })]
+		}) })
+	});
+	return /* @__PURE__ */ jsxs(Card_default, {
+		className: cx(containerClasses, styles.card),
+		variant,
+		children: [(showTitle || showSubtitle) && /* @__PURE__ */ jsxs(Card_default.Header, {
+			className: styles.header,
+			children: [showTitle && /* @__PURE__ */ jsx(Card_default.Title, {
+				level: 2,
+				className: styles.title,
+				children: flowTitle || t("signup.heading")
+			}), showSubtitle && /* @__PURE__ */ jsx(Typography_default, {
+				variant: "body1",
+				className: styles.subtitle,
+				children: flowSubtitle || t("signup.subheading")
+			})]
+		}), /* @__PURE__ */ jsxs(Card_default.Content, { children: [flowMessages && flowMessages.length > 0 && /* @__PURE__ */ jsx("div", {
+			className: styles.flowMessagesContainer,
+			children: flowMessages.map((message, index) => /* @__PURE__ */ jsx(Alert_default, {
+				variant: message.type?.toLowerCase() === "error" ? "error" : "info",
+				className: cx(styles.flowMessageItem, messageClasses),
+				children: /* @__PURE__ */ jsx(Alert_default.Description, { children: message.message })
+			}, message.id || index))
+		}), /* @__PURE__ */ jsx("div", {
+			className: styles.contentContainer,
+			children: currentFlow.data?.components && currentFlow.data.components.length > 0 ? renderComponents(currentFlow.data.components) : /* @__PURE__ */ jsx(Alert_default, {
+				variant: "warning",
+				children: /* @__PURE__ */ jsx(Typography_default, {
+					variant: "body1",
+					children: t("errors.signup.components.not.available")
+				})
+			})
+		})] })]
+	});
+};
+/**
+* BaseSignUp component that provides embedded sign-up flow for ThunderID.
+* This component handles both the presentation layer and sign-up flow logic.
+* It accepts API functions as props to maintain framework independence.
+*
+* @internal
+*/
+const BaseSignUp = ({ showLogo = true,...rest }) => {
+	const { theme, colorScheme } = useTheme_default();
+	const styles = BaseSignUp_styles_default(theme, colorScheme);
+	return /* @__PURE__ */ jsxs("div", { children: [showLogo && /* @__PURE__ */ jsx("div", {
+		className: styles.logoContainer,
+		children: /* @__PURE__ */ jsx(Logo_default, { size: "large" })
+	}), /* @__PURE__ */ jsx(FlowProvider_default, { children: /* @__PURE__ */ jsx(BaseSignUpContent, {
+		showLogo,
+		...rest
+	}) })] });
+};
+var BaseSignUp_default = BaseSignUp;
+
+//#endregion
+export { BaseSignUp_default as default };
+//# sourceMappingURL=BaseSignUp.js.map

package/dist/components/presentation/auth/SignUp/v1/BaseSignUp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseSignUp.js","names":["logger: ReturnType<typeof createPackageComponentLogger>","BaseSignUpContent: FC<BaseSignUpProps>","useTheme","useTranslation","useFlow","styles: any","useStyles","handleError: any","errorMessage: string","errorResponse: any","initializationAttemptedRef: any","extractFormFields: any","fields: FormField[]","config: any","setupFormFields: any","fields: any","initialValues: Record<string, string>","redirectUrl: any","popup: any","hasProcessedCallback: any","popupMonitor: any","messageHandler: (event: MessageEvent) => Promise<void>","expectedOrigin: any","payload: EmbeddedFlowExecuteRequestPayload","continueResponse: any","popupUrl: any","url: any","code: any","state: any","filteredInputs: Record<string, any>","actionId: string","response: any","containerClasses: any","inputClasses: any","buttonClasses: any","errorClasses: any","messageClasses: any","renderComponents: any","CardPrimitive","Spinner","AlertPrimitive","Typography","BaseSignUp: FC<BaseSignUpProps>","Logo","FlowProvider"],"sources":["../../../../../../src/components/presentation/auth/SignUp/v1/BaseSignUp.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {cx} from '@emotion/css';\nimport {\n  EmbeddedFlowExecuteRequestPayload,\n  EmbeddedFlowExecuteResponse,\n  EmbeddedFlowStatus,\n  EmbeddedFlowComponentType,\n  EmbeddedFlowResponseType,\n  withVendorCSSClassPrefix,\n  createPackageComponentLogger,\n} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useEffect, useState, useCallback, useRef} from 'react';\nimport {renderSignUpComponents} from './SignUpOptionFactory';\nimport FlowProvider from '../../../../../contexts/Flow/FlowProvider';\nimport useFlow from '../../../../../contexts/Flow/useFlow';\nimport useTheme from '../../../../../contexts/Theme/useTheme';\nimport useThunderID from '../../../../../contexts/ThunderID/useThunderID';\nimport {useForm, FormField} from '../../../../../hooks/useForm';\nimport useTranslation from '../../../../../hooks/useTranslation';\nimport AlertPrimitive from '../../../../primitives/Alert/Alert';\n// eslint-disable-next-line import/no-named-as-default\nimport CardPrimitive, {CardProps} from '../../../../primitives/Card/Card';\nimport Logo from '../../../../primitives/Logo/Logo';\nimport Spinner from '../../../../primitives/Spinner/Spinner';\nimport Typography from '../../../../primitives/Typography/Typography';\nimport useStyles from '../BaseSignUp.styles';\n\nconst logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(\n  '@thunderid/react',\n  'BaseSignUp',\n);\n\n/**\n * Render props for custom UI rendering\n */\nexport interface BaseSignUpRenderProps {\n  /**\n   * Flow components\n   */\n  components: any[];\n\n  /**\n   * Form errors\n   */\n  errors: Record<string, string>;\n\n  /**\n   * Function to handle input changes\n   */\n  handleInputChange: (name: string, value: string) => void;\n\n  /**\n   * Function to handle form submission\n   */\n  handleSubmit: (component: any, data?: Record<string, any>) => Promise<void>;\n\n  /**\n   * Loading state\n   */\n  isLoading: boolean;\n\n  /**\n   * Whether the form is valid\n   */\n  isValid: boolean;\n\n  /**\n   * Flow messages\n   */\n  messages: {message: string; type: string}[];\n\n  /**\n   * Flow subtitle\n   */\n  subtitle: string;\n\n  /**\n   * Flow title\n   */\n  title: string;\n\n  /**\n   * Touched fields\n   */\n  touched: Record<string, boolean>;\n\n  /**\n   * Function to validate the form\n   */\n  validateForm: () => {errors: Record<string, string>; isValid: boolean};\n\n  /**\n   * Form values\n   */\n  values: Record<string, string>;\n}\n\n/**\n * Props for the BaseSignUp component.\n */\nexport interface BaseSignUpProps {\n  /**\n   * URL to redirect after successful sign-up.\n   */\n  afterSignUpUrl?: string;\n\n  /**\n   * Custom CSS class name for the submit button.\n   */\n  buttonClassName?: string;\n\n  /**\n   * Render props function for custom UI\n   */\n  children?: (props: BaseSignUpRenderProps) => ReactNode;\n\n  /**\n   * Custom CSS class name for the form container.\n   */\n  className?: string;\n\n  /**\n   * Custom CSS class name for error messages.\n   */\n  errorClassName?: string;\n\n  /**\n   * Custom CSS class name for form inputs.\n   */\n  inputClassName?: string;\n\n  isInitialized?: boolean;\n\n  /**\n   * Custom CSS class name for info messages.\n   */\n  messageClassName?: string;\n\n  /**\n   * Callback function called when the sign-up flow completes and requires redirection.\n   * This allows platform-specific handling of redirects (e.g., Next.js router.push).\n   * @param response - The response from the sign-up flow containing the redirect URL, etc.\n   */\n  onComplete?: (response: EmbeddedFlowExecuteResponse) => void;\n\n  /**\n   * Callback function called when sign-up fails.\n   * @param error - The error that occurred during sign-up.\n   */\n  onError?: (error: Error) => void;\n\n  /**\n   * Callback function called when sign-up flow status changes.\n   * @param response - The current sign-up response.\n   */\n  onFlowChange?: (response: EmbeddedFlowExecuteResponse) => void;\n\n  /**\n   * Function to initialize sign-up flow.\n   * @returns Promise resolving to the initial sign-up response.\n   */\n  onInitialize?: (payload?: EmbeddedFlowExecuteRequestPayload) => Promise<EmbeddedFlowExecuteResponse>;\n\n  /**\n   * Function to handle sign-up steps.\n   * @param payload - The sign-up payload.\n   * @returns Promise resolving to the sign-up response.\n   */\n  onSubmit?: (payload: EmbeddedFlowExecuteRequestPayload) => Promise<EmbeddedFlowExecuteResponse>;\n  /**\n   *  Whether to redirect after sign-up.\n   */\n  shouldRedirectAfterSignUp?: boolean;\n\n  /**\n   * Whether to show the logo.\n   */\n  showLogo?: boolean;\n\n  /**\n   * Whether to show the subtitle.\n   */\n  showSubtitle?: boolean;\n\n  /**\n   * Whether to show the title.\n   */\n  showTitle?: boolean;\n\n  /**\n   * Size variant for the component.\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Theme variant for the component.\n   */\n  variant?: CardProps['variant'];\n}\n\n/**\n * Component that consumes FlowContext and renders the sign-up UI.\n *\n * @internal\n */\nconst BaseSignUpContent: FC<BaseSignUpProps> = ({\n  afterSignUpUrl,\n  onInitialize,\n  onSubmit,\n  onError,\n  onFlowChange,\n  onComplete,\n  className = '',\n  inputClassName = '',\n  buttonClassName = '',\n  errorClassName = '',\n  messageClassName = '',\n  size = 'medium',\n  variant = 'outlined',\n  isInitialized,\n  children,\n  showTitle = true,\n  showSubtitle = true,\n}: BaseSignUpProps): ReactElement => {\n  const {theme, colorScheme} = useTheme();\n  const {t} = useTranslation();\n  const {subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages} = useFlow();\n  useThunderID();\n  const styles: any = useStyles(theme, colorScheme);\n\n  const handleError: any = useCallback(\n    (error: any) => {\n      let errorMessage: string = t('errors.signup.flow.failure');\n\n      if (error && typeof error === 'object') {\n        // Handle ThunderID error format with code and description/message\n        if (error.code && (error.message || error.description)) {\n          errorMessage = error.description || error.message;\n        } else if (error instanceof Error && error.name === 'ThunderIDAPIError') {\n          try {\n            const errorResponse: any = JSON.parse(error.message);\n            if (errorResponse.description) {\n              errorMessage = errorResponse.description;\n            } else if (errorResponse.message) {\n              errorMessage = errorResponse.message;\n            } else {\n              errorMessage = error.message;\n            }\n          } catch {\n            errorMessage = error.message;\n          }\n        } else if (error.message) {\n          errorMessage = error.message;\n        }\n      } else if (typeof error === 'string') {\n        errorMessage = error;\n      }\n\n      // Clear existing messages and add the error message\n      clearMessages();\n      addMessage({\n        message: errorMessage,\n        type: 'error',\n      });\n    },\n    [t, addMessage, clearMessages],\n  );\n\n  const [isLoading, setIsLoading] = useState(false);\n  const [isFlowInitialized, setIsFlowInitialized] = useState(false);\n  const [currentFlow, setCurrentFlow] = useState<EmbeddedFlowExecuteResponse | null>(null);\n\n  const initializationAttemptedRef: any = useRef(false);\n\n  /**\n   * Extract form fields from flow components\n   */\n  const extractFormFields: any = useCallback(\n    (components: any[]): FormField[] => {\n      const fields: FormField[] = [];\n\n      const processComponents = (comps: any[]): any => {\n        comps.forEach((component: any) => {\n          if (component.type === EmbeddedFlowComponentType.Input) {\n            const config: any = component.config || {};\n            fields.push({\n              initialValue: config.defaultValue || '',\n              name: config.name || component.id,\n              required: config.required || false,\n              validator: (value: string) => {\n                if (config.required && (!value || value.trim() === '')) {\n                  return t('validations.required.field.error');\n                }\n                // Add email validation if it's an email field\n                if (config.type === 'email' && value && !/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(value)) {\n                  return t('field.email.invalid');\n                }\n                // Add password strength validation if it's a password field\n                if (config.type === 'password' && value && value.length < 8) {\n                  return t('field.password.weak');\n                }\n                return null;\n              },\n            });\n          }\n\n          if (component.components && Array.isArray(component.components)) {\n            processComponents(component.components);\n          }\n        });\n      };\n\n      processComponents(components);\n      return fields;\n    },\n    [t],\n  );\n\n  const formFields: any = currentFlow?.data?.components ? extractFormFields(currentFlow.data.components) : [];\n\n  const form: any = useForm<Record<string, string>>({\n    fields: formFields,\n    initialValues: {},\n    requiredMessage: t('validations.required.field.error'),\n    validateOnBlur: true,\n    validateOnChange: true,\n  });\n\n  const {\n    values: formValues,\n    touched: touchedFields,\n    errors: formErrors,\n    isValid: isFormValid,\n    setValue: setFormValue,\n    setTouched: setFormTouched,\n    validateForm,\n    reset: resetForm,\n  } = form;\n\n  /**\n   * Setup form fields based on the current flow.\n   */\n  const setupFormFields: any = useCallback(\n    (flowResponse: EmbeddedFlowExecuteResponse) => {\n      const fields: any = extractFormFields(flowResponse.data?.components || []);\n      const initialValues: Record<string, string> = {};\n\n      fields.forEach((field: any) => {\n        initialValues[field.name] = field.initialValue || '';\n      });\n\n      resetForm();\n\n      Object.keys(initialValues).forEach((key: any) => {\n        setFormValue(key, initialValues[key]);\n      });\n    },\n    [extractFormFields, resetForm, setFormValue],\n  );\n\n  /**\n   * Handle input value changes.\n   */\n  const handleInputChange = (name: string, value: string): void => {\n    setFormValue(name, value);\n    setFormTouched(name, true);\n  };\n\n  /**\n   * Check if the response contains a redirection URL and perform the redirect if necessary.\n   * @param response - The sign-up response\n   * @returns true if a redirect was performed, false otherwise\n   */\n  const handleRedirectionIfNeeded = (response: EmbeddedFlowExecuteResponse): boolean => {\n    if (response?.type === EmbeddedFlowResponseType.Redirection && response?.data?.redirectURL) {\n      /**\n       * Open a popup window to handle redirection prompts for social sign-up\n       */\n      const redirectUrl: any = response.data.redirectURL;\n      const popup: any = window.open(redirectUrl, 'oauth_popup', 'width=500,height=600,scrollbars=yes,resizable=yes');\n\n      if (!popup) {\n        logger.error('Failed to open popup window');\n        return false;\n      }\n\n      /**\n       * Use `let` for messageHandler and popupMonitor to resolve circular references:\n       * messageHandler <-> cleanup <-> popupMonitor.\n       * All are assigned before any of them can be invoked at runtime.\n       */\n      let hasProcessedCallback: any = false; // Prevent multiple processing\n      let popupMonitor: any;\n      let messageHandler: (event: MessageEvent) => Promise<void>;\n\n      const cleanup = (): void => {\n        window.removeEventListener('message', messageHandler);\n        if (popupMonitor) {\n          clearInterval(popupMonitor);\n        }\n      };\n\n      /**\n       * Add an event listener to the window to capture the message from the popup\n       */\n      messageHandler = async function messageEventHandler(event: MessageEvent): Promise<void> {\n        /**\n         * Check if the message is from our popup window\n         */\n        if (event.source !== popup) {\n          return;\n        }\n\n        /**\n         * Check the origin of the message to ensure it's from a trusted source\n         */\n        const expectedOrigin: any = afterSignUpUrl ? new URL(afterSignUpUrl).origin : window.location.origin;\n        if (event.origin !== expectedOrigin && event.origin !== window.location.origin) {\n          return;\n        }\n\n        const {code, state} = event.data;\n\n        if (code && state) {\n          const payload: EmbeddedFlowExecuteRequestPayload = {\n            ...(currentFlow!.flowId && {flowId: currentFlow!.flowId}),\n            actionId: '',\n            flowType: (currentFlow as any).flowType || 'REGISTRATION',\n            inputs: {\n              code,\n              state,\n            },\n          } as any;\n\n          try {\n            const continueResponse: any = await onSubmit!(payload);\n            onFlowChange?.(continueResponse);\n\n            if (continueResponse.flowStatus === EmbeddedFlowStatus.Complete) {\n              onComplete?.(continueResponse);\n            } else if (continueResponse.flowStatus === EmbeddedFlowStatus.Incomplete) {\n              setCurrentFlow(continueResponse);\n              setupFormFields(continueResponse);\n            }\n\n            popup.close();\n            cleanup();\n          } catch (err) {\n            handleError(err);\n            onError?.(err as Error);\n            popup.close();\n            cleanup();\n          }\n        }\n      };\n\n      window.addEventListener('message', messageHandler);\n\n      /**\n       * Monitor popup for closure and URL changes\n       */\n      popupMonitor = setInterval(async () => {\n        try {\n          if (popup.closed) {\n            cleanup();\n            return;\n          }\n\n          // Skip if we've already processed a callback\n          if (hasProcessedCallback) {\n            return;\n          }\n\n          // Try to access popup URL to check for callback\n          try {\n            const popupUrl: any = popup.location.href;\n\n            // Check if we've been redirected to the callback URL\n            if (popupUrl && (popupUrl.includes('code=') || popupUrl.includes('error='))) {\n              hasProcessedCallback = true; // Set flag to prevent multiple processing\n\n              // Parse the URL for OAuth parameters\n              const url: any = new URL(popupUrl);\n              const code: any = url.searchParams.get('code');\n              const state: any = url.searchParams.get('state');\n              const error: any = url.searchParams.get('error');\n\n              if (error) {\n                logger.error('OAuth error:');\n                popup.close();\n                cleanup();\n                return;\n              }\n\n              if (code && state) {\n                const payload: EmbeddedFlowExecuteRequestPayload = {\n                  ...(currentFlow!.flowId && {flowId: currentFlow!.flowId}),\n                  actionId: '',\n                  flowType: (currentFlow as any).flowType || 'REGISTRATION',\n                  inputs: {\n                    code,\n                    state,\n                  },\n                } as any;\n\n                try {\n                  const continueResponse: any = await onSubmit!(payload);\n                  onFlowChange?.(continueResponse);\n\n                  if (continueResponse.flowStatus === EmbeddedFlowStatus.Complete) {\n                    onComplete?.(continueResponse);\n                  } else if (continueResponse.flowStatus === EmbeddedFlowStatus.Incomplete) {\n                    setCurrentFlow(continueResponse);\n                    setupFormFields(continueResponse);\n                  }\n\n                  popup.close();\n                } catch (err) {\n                  handleError(err);\n                  onError?.(err as Error);\n                  popup.close();\n                }\n              }\n            }\n          } catch (e) {\n            // Cross-origin error is expected when popup navigates to OAuth provider\n            // This is normal and we can ignore it\n          }\n        } catch (e) {\n          logger.error('Error monitoring popup:');\n        }\n      }, 1000);\n\n      return true;\n    }\n\n    return false;\n  };\n\n  /**\n   * Handle component submission (for buttons outside forms).\n   */\n  const handleSubmit = async (component: any, data?: Record<string, any>): Promise<void> => {\n    if (!currentFlow) {\n      return;\n    }\n\n    setIsLoading(true);\n    clearMessages();\n\n    try {\n      // Filter out empty or undefined input values\n      const filteredInputs: Record<string, any> = {};\n      if (data) {\n        Object.entries(data).forEach(([key, value]: [string, any]) => {\n          if (value !== null && value !== undefined && value !== '') {\n            filteredInputs[key] = value;\n          }\n        });\n      }\n\n      const actionId: string = component.id;\n\n      const payload: EmbeddedFlowExecuteRequestPayload = {\n        ...(currentFlow.flowId && {flowId: currentFlow.flowId}),\n        flowType: (currentFlow as any).flowType || 'REGISTRATION',\n        inputs: filteredInputs,\n        ...(actionId && {actionId: actionId}),\n      } as any;\n\n      const response: any = await onSubmit!(payload);\n      onFlowChange?.(response);\n\n      if (response.flowStatus === EmbeddedFlowStatus.Complete) {\n        onComplete?.(response);\n        return;\n      }\n\n      if (response.flowStatus === EmbeddedFlowStatus.Incomplete) {\n        if (handleRedirectionIfNeeded(response)) {\n          return;\n        }\n\n        setCurrentFlow(response);\n        setupFormFields(response);\n      }\n    } catch (err) {\n      handleError(err);\n      onError?.(err as Error);\n    } finally {\n      setIsLoading(false);\n    }\n  };\n\n  const containerClasses: any = cx(\n    [\n      withVendorCSSClassPrefix('signup'),\n      withVendorCSSClassPrefix(`signup--${size}`),\n      withVendorCSSClassPrefix(`signup--${variant}`),\n    ],\n    className,\n  );\n\n  const inputClasses: any = cx(\n    [\n      withVendorCSSClassPrefix('signup__input'),\n      size === 'small' && withVendorCSSClassPrefix('signup__input--small'),\n      size === 'large' && withVendorCSSClassPrefix('signup__input--large'),\n    ],\n    inputClassName,\n  );\n\n  const buttonClasses: any = cx(\n    [\n      withVendorCSSClassPrefix('signup__button'),\n      size === 'small' && withVendorCSSClassPrefix('signup__button--small'),\n      size === 'large' && withVendorCSSClassPrefix('signup__button--large'),\n    ],\n    buttonClassName,\n  );\n\n  const errorClasses: any = cx([withVendorCSSClassPrefix('signup__error')], errorClassName);\n\n  const messageClasses: any = cx([withVendorCSSClassPrefix('signup__messages')], messageClassName);\n\n  /**\n   * Render form components based on flow data using the factory\n   */\n  const renderComponents: any = useCallback(\n    (components: any[]): ReactElement[] =>\n      renderSignUpComponents(\n        components,\n        formValues,\n        touchedFields,\n        formErrors,\n        isLoading,\n        isFormValid,\n        handleInputChange,\n        {\n          buttonClassName: buttonClasses,\n          inputClassName: inputClasses,\n          onSubmit: handleSubmit,\n          size,\n          variant,\n        },\n      ),\n    [\n      formValues,\n      touchedFields,\n      formErrors,\n      isFormValid,\n      isLoading,\n      size,\n      variant,\n      inputClasses,\n      buttonClasses,\n      handleSubmit,\n    ],\n  );\n\n  // Initialize the flow on component mount\n  useEffect(() => {\n    if (isInitialized && !isFlowInitialized && !initializationAttemptedRef.current) {\n      initializationAttemptedRef.current = true;\n\n      (async (): Promise<void> => {\n        setIsLoading(true);\n        clearMessages();\n\n        try {\n          const response: any = await onInitialize?.();\n\n          setCurrentFlow(response);\n          setIsFlowInitialized(true);\n          onFlowChange?.(response);\n\n          if (response.flowStatus === EmbeddedFlowStatus.Complete) {\n            onComplete?.(response);\n            return;\n          }\n\n          if (response.flowStatus === EmbeddedFlowStatus.Incomplete) {\n            setupFormFields(response);\n          }\n        } catch (err) {\n          handleError(err);\n          onError?.(err as Error);\n        } finally {\n          setIsLoading(false);\n        }\n      })();\n    }\n  }, [\n    isInitialized,\n    isFlowInitialized,\n    onInitialize,\n    onComplete,\n    onError,\n    onFlowChange,\n    setupFormFields,\n    afterSignUpUrl,\n    t,\n  ]);\n\n  // If render props are provided, use them\n  if (children) {\n    const renderProps: BaseSignUpRenderProps = {\n      components: currentFlow?.data?.components || [],\n      errors: formErrors,\n      handleInputChange,\n      handleSubmit,\n      isLoading,\n      isValid: isFormValid,\n      messages: flowMessages || [],\n      subtitle: flowSubtitle || t('signup.subheading'),\n      title: flowTitle || t('signup.heading'),\n      touched: touchedFields,\n      validateForm,\n      values: formValues,\n    };\n\n    return <div className={containerClasses}>{children(renderProps)}</div>;\n  }\n\n  if (!isFlowInitialized && isLoading) {\n    return (\n      <CardPrimitive className={cx(containerClasses, styles.card)} variant={variant}>\n        <CardPrimitive.Content>\n          <div className={styles.loadingContainer}>\n            <Spinner size=\"medium\" />\n          </div>\n        </CardPrimitive.Content>\n      </CardPrimitive>\n    );\n  }\n\n  if (!currentFlow) {\n    return (\n      <CardPrimitive className={cx(containerClasses, styles.card)} variant={variant}>\n        <CardPrimitive.Content>\n          <AlertPrimitive variant=\"error\" className={errorClasses}>\n            <AlertPrimitive.Title>{t('errors.heading')}</AlertPrimitive.Title>\n            <AlertPrimitive.Description>{t('errors.signup.flow.initialization.failure')}</AlertPrimitive.Description>\n          </AlertPrimitive>\n        </CardPrimitive.Content>\n      </CardPrimitive>\n    );\n  }\n\n  return (\n    <CardPrimitive className={cx(containerClasses, styles.card)} variant={variant}>\n      {(showTitle || showSubtitle) && (\n        <CardPrimitive.Header className={styles.header}>\n          {showTitle && (\n            <CardPrimitive.Title level={2} className={styles.title}>\n              {flowTitle || t('signup.heading')}\n            </CardPrimitive.Title>\n          )}\n          {showSubtitle && (\n            <Typography variant=\"body1\" className={styles.subtitle}>\n              {flowSubtitle || t('signup.subheading')}\n            </Typography>\n          )}\n        </CardPrimitive.Header>\n      )}\n      <CardPrimitive.Content>\n        {flowMessages && flowMessages.length > 0 && (\n          <div className={styles.flowMessagesContainer}>\n            {flowMessages.map((message: any, index: number) => (\n              <AlertPrimitive\n                key={message.id || index}\n                variant={message.type?.toLowerCase() === 'error' ? 'error' : 'info'}\n                className={cx(styles.flowMessageItem, messageClasses)}\n              >\n                <AlertPrimitive.Description>{message.message}</AlertPrimitive.Description>\n              </AlertPrimitive>\n            ))}\n          </div>\n        )}\n        <div className={styles.contentContainer}>\n          {currentFlow.data?.components && currentFlow.data.components.length > 0 ? (\n            renderComponents(currentFlow.data.components)\n          ) : (\n            <AlertPrimitive variant=\"warning\">\n              <Typography variant=\"body1\">{t('errors.signup.components.not.available')}</Typography>\n            </AlertPrimitive>\n          )}\n        </div>\n      </CardPrimitive.Content>\n    </CardPrimitive>\n  );\n};\n\n/**\n * BaseSignUp component that provides embedded sign-up flow for ThunderID.\n * This component handles both the presentation layer and sign-up flow logic.\n * It accepts API functions as props to maintain framework independence.\n *\n * @internal\n */\nconst BaseSignUp: FC<BaseSignUpProps> = ({showLogo = true, ...rest}: BaseSignUpProps): ReactElement => {\n  const {theme, colorScheme} = useTheme();\n  const styles: any = useStyles(theme, colorScheme);\n\n  return (\n    <div>\n      {showLogo && (\n        <div className={styles.logoContainer}>\n          <Logo size=\"large\" />\n        </div>\n      )}\n      <FlowProvider>\n        <BaseSignUpContent showLogo={showLogo} {...rest} />\n      </FlowProvider>\n    </div>\n  );\n};\n\nexport default BaseSignUp;\n"],"mappings":"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"}

package/dist/components/presentation/auth/SignUp/v1/SignUp.js

@@ -0,0 +1,51 @@
+import useThunderID_default from "../../../../../contexts/ThunderID/useThunderID.js";
+import BaseSignUp_default from "./BaseSignUp.js";
+import { EmbeddedFlowResponseType, EmbeddedFlowType } from "@thunderid/browser";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/presentation/auth/SignUp/v1/SignUp.tsx
+/**
+* A styled SignUp component for ThunderID platform that provides embedded sign-up flow with pre-built styling.
+* This component handles the API calls for sign-up and delegates UI logic to BaseSignUp.
+*/
+const SignUp = ({ className, size = "medium", afterSignUpUrl, onError, onComplete, shouldRedirectAfterSignUp = true, children,...rest }) => {
+	const { signUp, isInitialized } = useThunderID_default();
+	/**
+	* Initialize the sign-up flow.
+	*/
+	const handleInitialize = async (payload) => {
+		return await signUp(payload || { flowType: EmbeddedFlowType.Registration });
+	};
+	/**
+	* Handle sign-up steps.
+	*/
+	const handleOnSubmit = async (payload) => await signUp(payload);
+	/**
+	* Handle successful sign-up and redirect.
+	*/
+	const handleComplete = (response) => {
+		onComplete?.(response);
+		if (shouldRedirectAfterSignUp && response?.type !== EmbeddedFlowResponseType.Redirection && afterSignUpUrl) window.location.href = afterSignUpUrl;
+		if (shouldRedirectAfterSignUp && response?.type === EmbeddedFlowResponseType.Redirection && response?.data?.redirectURL && !response.data.redirectURL.includes("oauth") && !response.data.redirectURL.includes("auth")) window.location.href = response.data.redirectURL;
+	};
+	return /* @__PURE__ */ jsx(BaseSignUp_default, {
+		afterSignUpUrl,
+		onInitialize: handleInitialize,
+		onSubmit: handleOnSubmit,
+		onError,
+		onComplete: handleComplete,
+		className,
+		size,
+		isInitialized,
+		children,
+		showLogo: true,
+		showTitle: false,
+		showSubtitle: false,
+		...rest
+	});
+};
+var SignUp_default = SignUp;
+
+//#endregion
+export { SignUp_default as default };
+//# sourceMappingURL=SignUp.js.map

package/dist/components/presentation/auth/SignUp/v1/SignUp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SignUp.js","names":["SignUp: FC<SignUpProps>","useThunderID","BaseSignUp"],"sources":["../../../../../../src/components/presentation/auth/SignUp/v1/SignUp.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {\n  EmbeddedFlowExecuteRequestPayload,\n  EmbeddedFlowExecuteResponse,\n  EmbeddedFlowResponseType,\n  EmbeddedFlowType,\n} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode} from 'react';\n// eslint-disable-next-line import/no-named-as-default\nimport BaseSignUp, {BaseSignUpProps, BaseSignUpRenderProps} from './BaseSignUp';\nimport useThunderID from '../../../../../contexts/ThunderID/useThunderID';\n\n/**\n * Render props function parameters (re-exported from BaseSignUp for convenience)\n */\nexport type SignUpRenderProps = BaseSignUpRenderProps;\n\n/**\n * Props for the SignUp component.\n */\nexport type SignUpProps = BaseSignUpProps & {\n  /**\n   * Render props function for custom UI\n   */\n  children?: (props: SignUpRenderProps) => ReactNode;\n};\n\n/**\n * A styled SignUp component for ThunderID platform that provides embedded sign-up flow with pre-built styling.\n * This component handles the API calls for sign-up and delegates UI logic to BaseSignUp.\n */\nconst SignUp: FC<SignUpProps> = ({\n  className,\n  size = 'medium',\n  afterSignUpUrl,\n  onError,\n  onComplete,\n  shouldRedirectAfterSignUp = true,\n  children,\n  ...rest\n}: SignUpProps): ReactElement => {\n  const {signUp, isInitialized} = useThunderID();\n\n  /**\n   * Initialize the sign-up flow.\n   */\n  const handleInitialize = async (\n    payload?: EmbeddedFlowExecuteRequestPayload,\n  ): Promise<EmbeddedFlowExecuteResponse> => {\n    // Uses simple initialization without applicationId\n    const initialPayload: any = payload || {\n      flowType: EmbeddedFlowType.Registration,\n    };\n\n    return (await signUp(initialPayload)) as EmbeddedFlowExecuteResponse;\n  };\n\n  /**\n   * Handle sign-up steps.\n   */\n  const handleOnSubmit = async (payload: EmbeddedFlowExecuteRequestPayload): Promise<EmbeddedFlowExecuteResponse> =>\n    (await signUp(payload)) as EmbeddedFlowExecuteResponse;\n\n  /**\n   * Handle successful sign-up and redirect.\n   */\n  const handleComplete = (response: EmbeddedFlowExecuteResponse): any => {\n    onComplete?.(response);\n\n    // For non-redirection responses (regular sign-up completion), handle redirect if configured\n    if (shouldRedirectAfterSignUp && response?.type !== EmbeddedFlowResponseType.Redirection && afterSignUpUrl) {\n      window.location.href = afterSignUpUrl;\n    }\n\n    // For redirection responses (social sign-up), handle direct redirect\n    if (\n      shouldRedirectAfterSignUp &&\n      response?.type === EmbeddedFlowResponseType.Redirection &&\n      response?.data?.redirectURL &&\n      !response.data.redirectURL.includes('oauth') && // Not a social provider redirect\n      !response.data.redirectURL.includes('auth') // Not an auth provider redirect\n    ) {\n      window.location.href = response.data.redirectURL;\n    }\n  };\n\n  return (\n    <BaseSignUp\n      afterSignUpUrl={afterSignUpUrl}\n      onInitialize={handleInitialize}\n      onSubmit={handleOnSubmit}\n      onError={onError}\n      onComplete={handleComplete}\n      className={className}\n      size={size}\n      isInitialized={isInitialized}\n      children={children}\n      showLogo={true}\n      showTitle={false}\n      showSubtitle={false}\n      {...rest}\n    />\n  );\n};\n\nexport default SignUp;\n"],"mappings":";;;;;;;;;;AAgDA,MAAMA,UAA2B,EAC/B,WACA,OAAO,UACP,gBACA,SACA,YACA,4BAA4B,MAC5B,SACA,GAAG,WAC4B;CAC/B,MAAM,EAAC,QAAQ,kBAAiBC,sBAAc;;;;CAK9C,MAAM,mBAAmB,OACvB,YACyC;AAMzC,SAAQ,MAAM,OAJc,WAAW,EACrC,UAAU,iBAAiB,cAC5B,CAEmC;;;;;CAMtC,MAAM,iBAAiB,OAAO,YAC3B,MAAM,OAAO,QAAQ;;;;CAKxB,MAAM,kBAAkB,aAA+C;AACrE,eAAa,SAAS;AAGtB,MAAI,6BAA6B,UAAU,SAAS,yBAAyB,eAAe,eAC1F,QAAO,SAAS,OAAO;AAIzB,MACE,6BACA,UAAU,SAAS,yBAAyB,eAC5C,UAAU,MAAM,eAChB,CAAC,SAAS,KAAK,YAAY,SAAS,QAAQ,IAC5C,CAAC,SAAS,KAAK,YAAY,SAAS,OAAO,CAE3C,QAAO,SAAS,OAAO,SAAS,KAAK;;AAIzC,QACE,oBAACC;EACiB;EAChB,cAAc;EACd,UAAU;EACD;EACT,YAAY;EACD;EACL;EACS;EACL;EACV,UAAU;EACV,WAAW;EACX,cAAc;EACd,GAAI;GACJ;;AAIN,qBAAe"}