@thunderid/react 1.0.4 → 1.0.6
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/dist/cjs/components/adapters/Consent.cjs +21 -26
- package/dist/cjs/components/adapters/Consent.cjs.map +1 -1
- package/dist/cjs/components/adapters/ConsentCheckboxList.cjs +9 -3
- package/dist/cjs/components/adapters/ConsentCheckboxList.cjs.map +1 -1
- package/dist/cjs/components/presentation/LanguageSwitcher/LanguageSwitcher.cjs +10 -2
- package/dist/cjs/components/presentation/LanguageSwitcher/LanguageSwitcher.cjs.map +1 -1
- package/dist/cjs/components/presentation/auth/AuthOptionFactory.cjs +1 -2
- package/dist/cjs/components/presentation/auth/AuthOptionFactory.cjs.map +1 -1
- package/dist/cjs/components/presentation/auth/Recovery/BaseRecovery.cjs +1 -1
- package/dist/cjs/components/presentation/auth/Recovery/BaseRecovery.cjs.map +1 -1
- package/dist/cjs/components/presentation/auth/SignIn/BaseSignIn.cjs +6 -3
- package/dist/cjs/components/presentation/auth/SignIn/BaseSignIn.cjs.map +1 -1
- package/dist/cjs/components/presentation/auth/SignUp/BaseSignUp.cjs +1 -1
- package/dist/cjs/components/presentation/auth/SignUp/BaseSignUp.cjs.map +1 -1
- package/dist/cjs/contexts/FlowMeta/FlowMetaProvider.cjs +21 -9
- package/dist/cjs/contexts/FlowMeta/FlowMetaProvider.cjs.map +1 -1
- package/dist/cjs/contexts/ThunderID/ThunderIDProvider.cjs +2 -1
- package/dist/cjs/contexts/ThunderID/ThunderIDProvider.cjs.map +1 -1
- package/dist/cjs/hooks/useForm.cjs +42 -5
- package/dist/cjs/hooks/useForm.cjs.map +1 -1
- package/dist/cjs/utils/resolveTranslationsInObject.cjs +3 -1
- package/dist/cjs/utils/resolveTranslationsInObject.cjs.map +1 -1
- package/dist/components/adapters/Consent.d.ts +1 -18
- package/dist/components/adapters/Consent.d.ts.map +1 -1
- package/dist/components/adapters/Consent.js +21 -25
- package/dist/components/adapters/Consent.js.map +1 -1
- package/dist/components/adapters/ConsentCheckboxList.d.ts +5 -0
- package/dist/components/adapters/ConsentCheckboxList.d.ts.map +1 -1
- package/dist/components/adapters/ConsentCheckboxList.js +9 -3
- package/dist/components/adapters/ConsentCheckboxList.js.map +1 -1
- package/dist/components/presentation/LanguageSwitcher/LanguageSwitcher.d.ts.map +1 -1
- package/dist/components/presentation/LanguageSwitcher/LanguageSwitcher.js +11 -3
- package/dist/components/presentation/LanguageSwitcher/LanguageSwitcher.js.map +1 -1
- package/dist/components/presentation/auth/AuthOptionFactory.d.ts.map +1 -1
- package/dist/components/presentation/auth/AuthOptionFactory.js +1 -2
- package/dist/components/presentation/auth/AuthOptionFactory.js.map +1 -1
- package/dist/components/presentation/auth/Recovery/BaseRecovery.d.ts.map +1 -1
- package/dist/components/presentation/auth/Recovery/BaseRecovery.js +1 -1
- package/dist/components/presentation/auth/Recovery/BaseRecovery.js.map +1 -1
- package/dist/components/presentation/auth/SignIn/BaseSignIn.d.ts.map +1 -1
- package/dist/components/presentation/auth/SignIn/BaseSignIn.js +6 -3
- package/dist/components/presentation/auth/SignIn/BaseSignIn.js.map +1 -1
- package/dist/components/presentation/auth/SignUp/BaseSignUp.js +1 -1
- package/dist/components/presentation/auth/SignUp/BaseSignUp.js.map +1 -1
- package/dist/contexts/FlowMeta/FlowMetaProvider.d.ts +15 -0
- package/dist/contexts/FlowMeta/FlowMetaProvider.d.ts.map +1 -1
- package/dist/contexts/FlowMeta/FlowMetaProvider.js +21 -9
- package/dist/contexts/FlowMeta/FlowMetaProvider.js.map +1 -1
- package/dist/contexts/ThunderID/ThunderIDProvider.d.ts.map +1 -1
- package/dist/contexts/ThunderID/ThunderIDProvider.js +2 -1
- package/dist/contexts/ThunderID/ThunderIDProvider.js.map +1 -1
- package/dist/hooks/useForm.d.ts +5 -0
- package/dist/hooks/useForm.d.ts.map +1 -1
- package/dist/hooks/useForm.js +43 -6
- package/dist/hooks/useForm.js.map +1 -1
- package/dist/models/config.d.ts +2 -0
- package/dist/models/config.d.ts.map +1 -1
- package/dist/utils/resolveTranslationsInObject.d.ts.map +1 -1
- package/dist/utils/resolveTranslationsInObject.js +3 -1
- package/dist/utils/resolveTranslationsInObject.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseSignIn.cjs","names":["BaseSignInContent: FC<BaseSignInProps>","useThunderID","useTheme","customRenderers: ComponentRendererMap","ComponentRendererContext","useTranslation","useFlow","styles: any","useStyles","isLoading: boolean","handleError: any","errorMessage: string","extractErrorMessage","extractFormFields: (components: EmbeddedFlowComponent[]) => FormField[]","fields: FormField[]","identifier: string","useForm","errors: Record<string, string>","touched: Record<string, boolean>","composedData: Record<string, any> | undefined","composeAffixedInputs","filteredInputs: Record<string, any>","payload: EmbeddedSignInFlowRequest","containerClasses: any","cx","inputClasses: any","buttonClasses: any","messageClasses: any","renderComponents: any","renderSignInComponents","renderProps: BaseSignInRenderProps","result: any","CardPrimitive","Spinner","AlertPrimitive","Typography","BaseSignIn: FC<BaseSignInProps>","content: ReactElement","FlowProvider","ComponentPreferencesContext"],"sources":["../../../../../../src/components/presentation/auth/SignIn/BaseSignIn.tsx"],"sourcesContent":["// Copyright 2025-2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n withVendorCSSClassPrefix,\n EmbeddedSignInFlowRequest,\n EmbeddedFlowComponent,\n FieldError,\n FlowMetadataResponse,\n Preferences,\n buildValidatorFromRules,\n} from '@thunderid/browser';\nimport {FC, useEffect, useMemo, useState, useCallback, useContext, ReactElement, ReactNode} from 'react';\nimport useStyles from './BaseSignIn.styles';\nimport ComponentRendererContext, {\n ComponentRendererMap,\n} from '../../../../contexts/ComponentRenderer/ComponentRendererContext';\nimport FlowProvider from '../../../../contexts/Flow/FlowProvider';\nimport useFlow from '../../../../contexts/Flow/useFlow';\nimport ComponentPreferencesContext from '../../../../contexts/I18n/ComponentPreferencesContext';\nimport useTheme from '../../../../contexts/Theme/useTheme';\nimport useThunderID from '../../../../contexts/ThunderID/useThunderID';\nimport {FormField, useForm} from '../../../../hooks/useForm';\nimport useTranslation from '../../../../hooks/useTranslation';\nimport {cx} from '../../../../styles/emotion';\nimport composeAffixedInputs from '../../../../utils/composeAffixedInputs';\nimport {extractErrorMessage} from '../../../../utils/flowTransformer';\nimport AlertPrimitive from '../../../primitives/Alert/Alert';\n// eslint-disable-next-line import/no-named-as-default\nimport CardPrimitive, {CardProps} from '../../../primitives/Card/Card';\nimport Spinner from '../../../primitives/Spinner/Spinner';\nimport Typography from '../../../primitives/Typography/Typography';\nimport {renderSignInComponents} from '../AuthOptionFactory';\n\n/**\n * Render props for custom UI rendering\n */\nexport interface BaseSignInRenderProps {\n /**\n * Flow components\n */\n components: EmbeddedFlowComponent[];\n\n /**\n * API error (if any)\n */\n error?: Error | null;\n\n /**\n * Field validation errors\n */\n fieldErrors: 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: EmbeddedFlowComponent, data?: Record<string, any>) => Promise<void>;\n\n /**\n * Loading state\n */\n isLoading: boolean;\n\n /**\n * Flag indicating if the step timer has reached zero\n */\n isTimeoutDisabled?: 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 metadata returned by the platform (v2 only). `null` while loading or unavailable.\n */\n meta: FlowMetadataResponse | null;\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: () => {fieldErrors: Record<string, string>; isValid: boolean};\n\n /**\n * Form values\n */\n values: Record<string, string>;\n}\n\n/**\n * Props for the BaseSignIn component.\n */\nexport interface BaseSignInProps {\n /**\n * Additional data from the flow response.\n */\n additionalData?: Record<string, any>;\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: BaseSignInRenderProps) => ReactNode;\n\n /**\n * Custom CSS class name for the form container.\n */\n className?: string;\n\n /**\n * Array of flow components to render.\n */\n components?: EmbeddedFlowComponent[];\n\n /**\n * Error object to display\n */\n error?: Error | null;\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 /**\n * Flag to determine if the component is ready to be rendered.\n */\n isLoading?: boolean;\n\n /**\n * Timer flag disabling actions\n */\n isTimeoutDisabled?: boolean;\n\n /**\n * Custom CSS class name for info messages.\n */\n messageClassName?: string;\n\n /**\n * Callback function called when authentication fails.\n * @param error - The error that occurred during authentication.\n */\n onError?: (error: Error) => void;\n\n /**\n * Function to handle form submission.\n * @param payload - The form data to submit.\n * @param component - The component that triggered the submission.\n */\n onSubmit?: (payload: EmbeddedSignInFlowRequest, component: EmbeddedFlowComponent) => Promise<void>;\n\n /**\n * Callback function called when authentication is successful.\n * @param authData - The authentication data returned upon successful completion.\n */\n onSuccess?: (authData: Record<string, any>) => void;\n\n /**\n * Component-level preferences to override global i18n and theme settings.\n * Preferences are deep-merged with global ones, with component preferences\n * taking precedence. Affects this component and all its descendants.\n */\n preferences?: Preferences;\n\n /**\n * HTML id attribute for the form container.\n */\n id?: string;\n\n /**\n * Field-level validation errors returned by the server in `data.fieldErrors` on the\n * most recent flow response. The component collapses these into the form's\n * `fieldErrors` state (first error per field wins), surfacing them through the same\n * render-prop / UI path as client-side validation errors. The full array is preserved\n * here for advanced consumers that want every failing rule per field.\n */\n serverFieldErrors?: FieldError[] | null;\n\n /**\n * When a field has been blurred at least once, re-run validation on every subsequent\n * keystroke so a rendered error clears the moment the value becomes valid. Doesn't\n * affect fields that have never been blurred — the user isn't shown errors while\n * initially typing. Default `false` preserves prior behavior.\n */\n revalidateOnChangeAfterBlur?: 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 * Internal component that consumes FlowContext and renders the sign-in UI.\n */\nconst BaseSignInContent: FC<BaseSignInProps> = ({\n components = [],\n onSubmit,\n onError,\n error: externalError,\n id,\n className = '',\n inputClassName = '',\n buttonClassName = '',\n messageClassName = '',\n size = 'medium',\n variant = 'outlined',\n isLoading: externalIsLoading,\n children,\n additionalData = {},\n isTimeoutDisabled = false,\n serverFieldErrors = null,\n revalidateOnChangeAfterBlur = false,\n}: BaseSignInProps): ReactElement => {\n const {meta, vendor} = useThunderID();\n const {theme} = useTheme();\n const customRenderers: ComponentRendererMap = useContext(ComponentRendererContext);\n const {t} = useTranslation();\n const {subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages} = useFlow();\n const styles: any = useStyles(theme, theme.vars.colors.text.primary);\n\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [apiError, setApiError] = useState<Error | null>(null);\n\n const isLoading: boolean = externalIsLoading || isSubmitting;\n\n /**\n * Component type for which forms validation will be applicable\n */\n const acceptableType = [\n 'TEXT_INPUT',\n 'PASSWORD_INPUT',\n 'EMAIL_INPUT',\n 'PHONE_INPUT',\n 'OTP_INPUT',\n 'SELECT',\n 'DATE_INPUT',\n 'CUSTOM',\n ];\n\n /**\n * Handle error responses and extract meaningful error messages\n * Uses the transformer's extractErrorMessage function for consistency\n */\n const handleError: any = useCallback(\n (error: any) => {\n const errorMessage: string = extractErrorMessage(error, t);\n\n // Set the API error state\n setApiError(error instanceof Error ? error : new Error(errorMessage));\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 /**\n * Extract form fields from flow components\n */\n const extractFormFields: (components: EmbeddedFlowComponent[]) => FormField[] = useCallback(\n (flowComponents: EmbeddedFlowComponent[]): FormField[] => {\n const fields: FormField[] = [];\n\n const processComponents = (comps: EmbeddedFlowComponent[]): any => {\n comps.forEach((component: any) => {\n if (acceptableType.includes(component.type)) {\n const identifier: string = component.ref;\n const ruleValidator = buildValidatorFromRules(component.validation);\n fields.push({\n initialValue: '',\n name: identifier,\n required: component.required || false,\n validator: (value: string) => {\n if (component.required && (!value || value.trim() === '')) {\n return t('validations.required.field.error');\n }\n // Add email validation if it's an email field\n if (\n (component.type === 'EMAIL_INPUT' || component.variant === 'EMAIL') &&\n value &&\n !/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(value)\n ) {\n return t('field.email.invalid');\n }\n // Run declarative rules from meta.components[].validation.\n if (ruleValidator && value) {\n const ruleMessage = ruleValidator(value);\n if (ruleMessage) {\n return t(ruleMessage);\n }\n }\n\n return null;\n },\n });\n }\n if (component.components) {\n processComponents(component.components);\n }\n });\n };\n\n processComponents(flowComponents);\n return fields;\n },\n [t],\n );\n\n const formFields: FormField[] = useMemo(\n () => (components ? extractFormFields(components) : []),\n [components, extractFormFields],\n );\n\n const form: ReturnType<typeof useForm> = useForm<Record<string, string>>({\n fields: formFields,\n initialValues: {},\n requiredMessage: t('validations.required.field.error'),\n revalidateOnChangeAfterBlur,\n validateOnBlur: true,\n validateOnChange: false,\n });\n\n const {\n values: formValues,\n touched: touchedFields,\n errors: formErrors,\n isValid: isFormValid,\n setValue: setFormValue,\n setTouched: setFormTouched,\n setTouchedFields,\n setErrors: setFormErrors,\n clearErrors: clearFormErrors,\n validateForm,\n touchAllFields,\n reset: resetForm,\n } = form;\n\n // Project server-side fieldErrors into form state. `setTouchedFields` is used instead\n // of `setTouched` so client-side `validateField` doesn't wipe server errors when the\n // client rules happen to pass.\n useEffect(() => {\n clearFormErrors();\n if (!serverFieldErrors || serverFieldErrors.length === 0) {\n return;\n }\n const errors: Record<string, string> = {};\n const touched: Record<string, boolean> = {};\n for (const fe of serverFieldErrors) {\n if (!(fe.identifier in errors)) {\n errors[fe.identifier] = fe.message;\n touched[fe.identifier] = true;\n }\n }\n setTouchedFields(touched);\n setFormErrors(errors);\n }, [serverFieldErrors, setFormErrors, setTouchedFields, clearFormErrors]);\n\n /**\n * Handle input value changes.\n * Only updates the value without marking as touched.\n * Touched state is set on blur to avoid premature validation.\n */\n const handleInputChange = (name: string, value: string): void => {\n setFormValue(name, value);\n };\n\n /**\n * Handle input blur event.\n * Marks the field as touched, which triggers validation.\n */\n const handleInputBlur = (name: string): void => {\n setFormTouched(name, true);\n };\n\n /**\n * Handle component submission (for buttons and actions).\n */\n const handleSubmit = async (\n component: EmbeddedFlowComponent,\n data?: Record<string, any>,\n skipValidation?: boolean,\n ): Promise<void> => {\n // Only validate for form submit actions, skip for social/trigger actions\n if (!skipValidation) {\n // Mark all fields as touched before validation\n touchAllFields();\n\n const validation: ReturnType<typeof validateForm> = validateForm();\n\n if (!validation.isValid) {\n return;\n }\n }\n\n setIsSubmitting(true);\n setApiError(null);\n clearMessages();\n\n try {\n const composedData: Record<string, any> | undefined = data\n ? composeAffixedInputs(data as Record<string, string>, vendor)\n : undefined;\n\n // Filter out empty or undefined input values\n const filteredInputs: Record<string, any> = {};\n if (composedData) {\n Object.keys(composedData).forEach((key: any) => {\n if (composedData[key] !== undefined && composedData[key] !== null && composedData[key] !== '') {\n filteredInputs[key] = composedData[key];\n }\n });\n }\n\n let payload: EmbeddedSignInFlowRequest = {};\n\n // For V2, we always send inputs and action\n payload = {\n ...payload,\n ...(component.id && {action: component.id}),\n inputs: filteredInputs,\n };\n\n await onSubmit?.(payload, component);\n } catch (err) {\n handleError(err);\n onError?.(err as Error);\n } finally {\n setIsSubmitting(false);\n }\n };\n\n // Generate CSS classes\n const containerClasses: any = cx(\n [\n withVendorCSSClassPrefix('signin'),\n withVendorCSSClassPrefix(`signin--${size}`),\n withVendorCSSClassPrefix(`signin--${variant}`),\n ],\n className,\n );\n\n const inputClasses: any = cx(\n [\n withVendorCSSClassPrefix('signin__input'),\n size === 'small' && withVendorCSSClassPrefix('signin__input--small'),\n size === 'large' && withVendorCSSClassPrefix('signin__input--large'),\n ],\n inputClassName,\n );\n\n const buttonClasses: any = cx(\n [\n withVendorCSSClassPrefix('signin__button'),\n size === 'small' && withVendorCSSClassPrefix('signin__button--small'),\n size === 'large' && withVendorCSSClassPrefix('signin__button--large'),\n ],\n buttonClassName,\n );\n\n const messageClasses: any = cx([withVendorCSSClassPrefix('signin__messages')], messageClassName);\n\n /**\n * Render components based on flow data using the factory\n */\n const renderComponents: any = useCallback(\n (flowComponents: EmbeddedFlowComponent[]): ReactElement[] =>\n renderSignInComponents(\n flowComponents,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n handleInputChange,\n {\n _customRenderers: customRenderers,\n _theme: theme,\n additionalData,\n buttonClassName: buttonClasses,\n inputClassName: inputClasses,\n isTimeoutDisabled,\n meta,\n onInputBlur: handleInputBlur,\n onSubmit: handleSubmit,\n size,\n t,\n variant,\n vendor,\n },\n ),\n [\n additionalData,\n customRenderers,\n formValues,\n touchedFields,\n formErrors,\n isFormValid,\n meta,\n t,\n theme,\n isLoading,\n size,\n variant,\n vendor,\n inputClasses,\n buttonClasses,\n handleInputBlur,\n handleSubmit,\n isTimeoutDisabled,\n ],\n );\n\n // If render props are provided, use them\n if (children) {\n const renderProps: BaseSignInRenderProps = {\n components,\n error: apiError,\n fieldErrors: formErrors,\n handleInputChange,\n handleSubmit,\n isLoading,\n isTimeoutDisabled,\n isValid: isFormValid,\n messages: flowMessages || [],\n meta,\n subtitle: flowSubtitle ?? '',\n title: flowTitle || t('signin.heading'),\n touched: touchedFields,\n validateForm: () => {\n const result: any = validateForm();\n return {fieldErrors: result.errors, isValid: result.isValid};\n },\n values: formValues,\n };\n\n return (\n <div id={id} className={containerClasses} data-testid=\"thunderid-signin\">\n {children(renderProps)}\n </div>\n );\n }\n\n // Default UI rendering\n if (isLoading) {\n return (\n <CardPrimitive\n id={id}\n className={cx(containerClasses, styles.card)}\n data-testid=\"thunderid-signin\"\n variant={variant}\n >\n <CardPrimitive.Content>\n <div className={(styles as Record<string, string>)['centeredSpinnerContainer']}>\n <Spinner />\n </div>\n </CardPrimitive.Content>\n </CardPrimitive>\n );\n }\n\n if (!components || components.length === 0) {\n return (\n <CardPrimitive\n id={id}\n className={cx(containerClasses, styles.card)}\n data-testid=\"thunderid-signin\"\n variant={variant}\n >\n <CardPrimitive.Content>\n <AlertPrimitive variant=\"warning\">\n <Typography variant=\"body1\">{t('errors.signin.components.not.available')}</Typography>\n </AlertPrimitive>\n </CardPrimitive.Content>\n </CardPrimitive>\n );\n }\n\n return (\n <CardPrimitive\n id={id}\n className={cx(containerClasses, styles.card)}\n data-testid=\"thunderid-signin\"\n variant={variant}\n >\n <CardPrimitive.Content>\n {externalError && (\n <div className={styles.flowMessagesContainer}>\n <AlertPrimitive variant=\"error\" className={cx(styles.flowMessageItem, messageClasses)}>\n <AlertPrimitive.Description>{externalError.message}</AlertPrimitive.Description>\n </AlertPrimitive>\n </div>\n )}\n {flowMessages && flowMessages.length > 0 && (\n <div className={styles.flowMessagesContainer}>\n {flowMessages.map((message: any, index: any) => (\n <AlertPrimitive\n key={index}\n variant={message.type === '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}>{renderComponents(components)}</div>\n </CardPrimitive.Content>\n </CardPrimitive>\n );\n};\n\n/**\n * Base SignIn component that provides generic authentication flow.\n * This component handles component-driven UI rendering and can transform input\n * structure to component-driven format automatically.\n *\n * @example\n * // Default UI\n * ```tsx\n * import { BaseSignIn } from '@thunderid/react';\n *\n * const MySignIn = () => {\n * return (\n * <BaseSignIn\n * components={components}\n * onSubmit={async (payload) => {\n * return await handleAuth(payload);\n * }}\n * onSuccess={(authData) => {\n * console.log('Success:', authData);\n * }}\n * className=\"max-w-md mx-auto\"\n * />\n * );\n * };\n * ```\n *\n * @example\n * // Custom UI with render props\n * ```tsx\n * <BaseSignIn components={components} onSubmit={handleSubmit}>\n * {({values, errors, handleInputChange, handleSubmit, isLoading, components}) => (\n * <div className=\"custom-form\">\n * <input\n * name=\"username\"\n * value={values.username || ''}\n * onChange={(e) => handleInputChange('username', e.target.value)}\n * />\n * {errors.username && <span>{errors.username}</span>}\n * <button\n * onClick={() => handleSubmit(components[0], values)}\n * disabled={isLoading}\n * >\n * Sign In\n * </button>\n * </div>\n * )}\n * </BaseSignIn>\n * ```\n */\nconst BaseSignIn: FC<BaseSignInProps> = ({preferences, ...rest}: BaseSignInProps): ReactElement => {\n const content: ReactElement = (\n <FlowProvider>\n <BaseSignInContent {...rest} />\n </FlowProvider>\n );\n\n if (!preferences) return content;\n\n return <ComponentPreferencesContext.Provider value={preferences}>{content}</ComponentPreferencesContext.Provider>;\n};\n\nexport default BaseSignIn;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseSignIn.cjs","names":["BaseSignInContent: FC<BaseSignInProps>","useThunderID","useTheme","customRenderers: ComponentRendererMap","ComponentRendererContext","useTranslation","useFlow","styles: any","useStyles","isLoading: boolean","handleError: any","errorMessage: string","extractErrorMessage","extractFormFields: (components: EmbeddedFlowComponent[]) => FormField[]","fields: FormField[]","identifier: string","useForm","errors: Record<string, string>","touched: Record<string, boolean>","composedData: Record<string, any> | undefined","composeAffixedInputs","filteredInputs: Record<string, any>","payload: EmbeddedSignInFlowRequest","containerClasses: any","cx","inputClasses: any","buttonClasses: any","messageClasses: any","renderComponents: any","renderSignInComponents","renderProps: BaseSignInRenderProps","result: any","CardPrimitive","Spinner","AlertPrimitive","Typography","BaseSignIn: FC<BaseSignInProps>","content: ReactElement","FlowProvider","ComponentPreferencesContext"],"sources":["../../../../../../src/components/presentation/auth/SignIn/BaseSignIn.tsx"],"sourcesContent":["// Copyright 2025-2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n withVendorCSSClassPrefix,\n EmbeddedSignInFlowRequest,\n EmbeddedFlowComponent,\n FieldError,\n FlowMetadataResponse,\n Preferences,\n buildValidatorFromRules,\n} from '@thunderid/browser';\nimport {FC, useEffect, useMemo, useState, useCallback, useContext, ReactElement, ReactNode} from 'react';\nimport useStyles from './BaseSignIn.styles';\nimport ComponentRendererContext, {\n ComponentRendererMap,\n} from '../../../../contexts/ComponentRenderer/ComponentRendererContext';\nimport FlowProvider from '../../../../contexts/Flow/FlowProvider';\nimport useFlow from '../../../../contexts/Flow/useFlow';\nimport ComponentPreferencesContext from '../../../../contexts/I18n/ComponentPreferencesContext';\nimport useTheme from '../../../../contexts/Theme/useTheme';\nimport useThunderID from '../../../../contexts/ThunderID/useThunderID';\nimport {FormField, useForm} from '../../../../hooks/useForm';\nimport useTranslation from '../../../../hooks/useTranslation';\nimport {cx} from '../../../../styles/emotion';\nimport composeAffixedInputs from '../../../../utils/composeAffixedInputs';\nimport {extractErrorMessage} from '../../../../utils/flowTransformer';\nimport AlertPrimitive from '../../../primitives/Alert/Alert';\n// eslint-disable-next-line import/no-named-as-default\nimport CardPrimitive, {CardProps} from '../../../primitives/Card/Card';\nimport Spinner from '../../../primitives/Spinner/Spinner';\nimport Typography from '../../../primitives/Typography/Typography';\nimport {renderSignInComponents} from '../AuthOptionFactory';\n\n/**\n * Render props for custom UI rendering\n */\nexport interface BaseSignInRenderProps {\n /**\n * Flow components\n */\n components: EmbeddedFlowComponent[];\n\n /**\n * API error (if any)\n */\n error?: Error | null;\n\n /**\n * Field validation errors\n */\n fieldErrors: 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: EmbeddedFlowComponent, data?: Record<string, any>) => Promise<void>;\n\n /**\n * Loading state\n */\n isLoading: boolean;\n\n /**\n * Flag indicating if the step timer has reached zero\n */\n isTimeoutDisabled?: 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 metadata returned by the platform (v2 only). `null` while loading or unavailable.\n */\n meta: FlowMetadataResponse | null;\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: () => {fieldErrors: Record<string, string>; isValid: boolean};\n\n /**\n * Form values\n */\n values: Record<string, string>;\n}\n\n/**\n * Props for the BaseSignIn component.\n */\nexport interface BaseSignInProps {\n /**\n * Additional data from the flow response.\n */\n additionalData?: Record<string, any>;\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: BaseSignInRenderProps) => ReactNode;\n\n /**\n * Custom CSS class name for the form container.\n */\n className?: string;\n\n /**\n * Array of flow components to render.\n */\n components?: EmbeddedFlowComponent[];\n\n /**\n * Error object to display\n */\n error?: Error | null;\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 /**\n * Flag to determine if the component is ready to be rendered.\n */\n isLoading?: boolean;\n\n /**\n * Timer flag disabling actions\n */\n isTimeoutDisabled?: boolean;\n\n /**\n * Custom CSS class name for info messages.\n */\n messageClassName?: string;\n\n /**\n * Callback function called when authentication fails.\n * @param error - The error that occurred during authentication.\n */\n onError?: (error: Error) => void;\n\n /**\n * Function to handle form submission.\n * @param payload - The form data to submit.\n * @param component - The component that triggered the submission.\n */\n onSubmit?: (payload: EmbeddedSignInFlowRequest, component: EmbeddedFlowComponent) => Promise<void>;\n\n /**\n * Callback function called when authentication is successful.\n * @param authData - The authentication data returned upon successful completion.\n */\n onSuccess?: (authData: Record<string, any>) => void;\n\n /**\n * Component-level preferences to override global i18n and theme settings.\n * Preferences are deep-merged with global ones, with component preferences\n * taking precedence. Affects this component and all its descendants.\n */\n preferences?: Preferences;\n\n /**\n * HTML id attribute for the form container.\n */\n id?: string;\n\n /**\n * Field-level validation errors returned by the server in `data.fieldErrors` on the\n * most recent flow response. The component collapses these into the form's\n * `fieldErrors` state (first error per field wins), surfacing them through the same\n * render-prop / UI path as client-side validation errors. The full array is preserved\n * here for advanced consumers that want every failing rule per field.\n */\n serverFieldErrors?: FieldError[] | null;\n\n /**\n * When a field has been blurred at least once, re-run validation on every subsequent\n * keystroke so a rendered error clears the moment the value becomes valid. Doesn't\n * affect fields that have never been blurred — the user isn't shown errors while\n * initially typing. Default `false` preserves prior behavior.\n */\n revalidateOnChangeAfterBlur?: 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 * Internal component that consumes FlowContext and renders the sign-in UI.\n */\nconst BaseSignInContent: FC<BaseSignInProps> = ({\n components = [],\n onSubmit,\n onError,\n error: externalError,\n id,\n className = '',\n inputClassName = '',\n buttonClassName = '',\n messageClassName = '',\n size = 'medium',\n variant = 'outlined',\n isLoading: externalIsLoading,\n children,\n additionalData = {},\n isTimeoutDisabled = false,\n serverFieldErrors = null,\n revalidateOnChangeAfterBlur = false,\n}: BaseSignInProps): ReactElement => {\n const {meta, vendor} = useThunderID();\n const {theme} = useTheme();\n const customRenderers: ComponentRendererMap = useContext(ComponentRendererContext);\n const {t, currentLanguage} = useTranslation();\n const {subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages} = useFlow();\n const styles: any = useStyles(theme, theme.vars.colors.text.primary);\n\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [apiError, setApiError] = useState<Error | null>(null);\n\n const isLoading: boolean = externalIsLoading || isSubmitting;\n\n /**\n * Component type for which forms validation will be applicable\n */\n const acceptableType = [\n 'TEXT_INPUT',\n 'PASSWORD_INPUT',\n 'EMAIL_INPUT',\n 'PHONE_INPUT',\n 'OTP_INPUT',\n 'SELECT',\n 'DATE_INPUT',\n 'CUSTOM',\n ];\n\n /**\n * Handle error responses and extract meaningful error messages\n * Uses the transformer's extractErrorMessage function for consistency\n */\n const handleError: any = useCallback(\n (error: any) => {\n const errorMessage: string = extractErrorMessage(error, t);\n\n // Set the API error state\n setApiError(error instanceof Error ? error : new Error(errorMessage));\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 /**\n * Extract form fields from flow components\n */\n const extractFormFields: (components: EmbeddedFlowComponent[]) => FormField[] = useCallback(\n (flowComponents: EmbeddedFlowComponent[]): FormField[] => {\n const fields: FormField[] = [];\n\n const processComponents = (comps: EmbeddedFlowComponent[]): any => {\n comps.forEach((component: any) => {\n if (acceptableType.includes(component.type)) {\n const identifier: string = component.ref;\n const ruleValidator = buildValidatorFromRules(component.validation);\n fields.push({\n initialValue: '',\n name: identifier,\n required: component.required || false,\n validator: (value: string) => {\n if (component.required && (!value || value.trim() === '')) {\n return t('validations.required.field.error');\n }\n // Run declarative rules from meta.components[].validation.\n if (ruleValidator && value) {\n const ruleMessage = ruleValidator(value);\n if (ruleMessage) {\n return t(ruleMessage);\n }\n }\n // Add email validation if it's an email field\n if (\n (component.type === 'EMAIL_INPUT' || component.variant === 'EMAIL') &&\n value &&\n !/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(value)\n ) {\n return t('field.email.invalid');\n }\n\n return null;\n },\n });\n }\n if (component.components) {\n processComponents(component.components);\n }\n });\n };\n\n processComponents(flowComponents);\n return fields;\n },\n [t],\n );\n\n const formFields: FormField[] = useMemo(\n () => (components ? extractFormFields(components) : []),\n [components, extractFormFields],\n );\n\n const form: ReturnType<typeof useForm> = useForm<Record<string, string>>({\n fields: formFields,\n initialValues: {},\n requiredMessage: t('validations.required.field.error'),\n revalidateOnChangeAfterBlur,\n validateOnBlur: true,\n validateOnChange: false,\n });\n\n const {\n values: formValues,\n touched: touchedFields,\n errors: formErrors,\n isValid: isFormValid,\n setValue: setFormValue,\n setTouched: setFormTouched,\n setTouchedFields,\n setErrors: setFormErrors,\n clearErrors: clearFormErrors,\n validateForm,\n touchAllFields,\n reset: resetForm,\n revalidateTouchedFields,\n } = form;\n\n // Project server-side fieldErrors into form state. `setTouchedFields` is used instead\n // of `setTouched` so client-side `validateField` doesn't wipe server errors when the\n // client rules happen to pass.\n useEffect(() => {\n clearFormErrors();\n if (!serverFieldErrors || serverFieldErrors.length === 0) {\n return;\n }\n const errors: Record<string, string> = {};\n const touched: Record<string, boolean> = {};\n for (const fe of serverFieldErrors) {\n if (!(fe.identifier in errors)) {\n errors[fe.identifier] = fe.message;\n touched[fe.identifier] = true;\n }\n }\n setTouchedFields(touched);\n setFormErrors(errors);\n }, [serverFieldErrors, setFormErrors, setTouchedFields, clearFormErrors]);\n\n // Re-translate displayed validation errors when the UI language changes.\n // revalidateTouchedFields is stable, so this effect fires only on language change.\n useEffect(() => {\n revalidateTouchedFields();\n }, [currentLanguage, revalidateTouchedFields]);\n\n /**\n * Handle input value changes.\n * Only updates the value without marking as touched.\n * Touched state is set on blur to avoid premature validation.\n */\n const handleInputChange = (name: string, value: string): void => {\n setFormValue(name, value);\n };\n\n /**\n * Handle input blur event.\n * Marks the field as touched, which triggers validation.\n */\n const handleInputBlur = (name: string): void => {\n setFormTouched(name, true);\n };\n\n /**\n * Handle component submission (for buttons and actions).\n */\n const handleSubmit = async (\n component: EmbeddedFlowComponent,\n data?: Record<string, any>,\n skipValidation?: boolean,\n ): Promise<void> => {\n // Only validate for form submit actions, skip for social/trigger actions\n if (!skipValidation) {\n // Mark all fields as touched before validation\n touchAllFields();\n\n const validation: ReturnType<typeof validateForm> = validateForm();\n\n if (!validation.isValid) {\n return;\n }\n }\n\n setIsSubmitting(true);\n setApiError(null);\n clearMessages();\n\n try {\n const composedData: Record<string, any> | undefined = data\n ? composeAffixedInputs(data as Record<string, string>, vendor)\n : undefined;\n\n // Filter out empty or undefined input values\n const filteredInputs: Record<string, any> = {};\n if (composedData) {\n Object.keys(composedData).forEach((key: any) => {\n if (composedData[key] !== undefined && composedData[key] !== null && composedData[key] !== '') {\n filteredInputs[key] = composedData[key];\n }\n });\n }\n\n let payload: EmbeddedSignInFlowRequest = {};\n\n // For V2, we always send inputs and action\n payload = {\n ...payload,\n ...(component.id && {action: component.id}),\n inputs: filteredInputs,\n };\n\n await onSubmit?.(payload, component);\n } catch (err) {\n handleError(err);\n onError?.(err as Error);\n } finally {\n setIsSubmitting(false);\n }\n };\n\n // Generate CSS classes\n const containerClasses: any = cx(\n [\n withVendorCSSClassPrefix('signin'),\n withVendorCSSClassPrefix(`signin--${size}`),\n withVendorCSSClassPrefix(`signin--${variant}`),\n ],\n className,\n );\n\n const inputClasses: any = cx(\n [\n withVendorCSSClassPrefix('signin__input'),\n size === 'small' && withVendorCSSClassPrefix('signin__input--small'),\n size === 'large' && withVendorCSSClassPrefix('signin__input--large'),\n ],\n inputClassName,\n );\n\n const buttonClasses: any = cx(\n [\n withVendorCSSClassPrefix('signin__button'),\n size === 'small' && withVendorCSSClassPrefix('signin__button--small'),\n size === 'large' && withVendorCSSClassPrefix('signin__button--large'),\n ],\n buttonClassName,\n );\n\n const messageClasses: any = cx([withVendorCSSClassPrefix('signin__messages')], messageClassName);\n\n /**\n * Render components based on flow data using the factory\n */\n const renderComponents: any = useCallback(\n (flowComponents: EmbeddedFlowComponent[]): ReactElement[] =>\n renderSignInComponents(\n flowComponents,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n handleInputChange,\n {\n _customRenderers: customRenderers,\n _theme: theme,\n additionalData,\n buttonClassName: buttonClasses,\n inputClassName: inputClasses,\n isTimeoutDisabled,\n meta,\n onInputBlur: handleInputBlur,\n onSubmit: handleSubmit,\n size,\n t,\n variant,\n vendor,\n },\n ),\n [\n additionalData,\n customRenderers,\n formValues,\n touchedFields,\n formErrors,\n isFormValid,\n meta,\n t,\n theme,\n isLoading,\n size,\n variant,\n vendor,\n inputClasses,\n buttonClasses,\n handleInputBlur,\n handleSubmit,\n isTimeoutDisabled,\n ],\n );\n\n // If render props are provided, use them\n if (children) {\n const renderProps: BaseSignInRenderProps = {\n components,\n error: apiError,\n fieldErrors: formErrors,\n handleInputChange,\n handleSubmit,\n isLoading,\n isTimeoutDisabled,\n isValid: isFormValid,\n messages: flowMessages || [],\n meta,\n subtitle: flowSubtitle ?? '',\n title: flowTitle || t('signin.heading'),\n touched: touchedFields,\n validateForm: () => {\n const result: any = validateForm();\n return {fieldErrors: result.errors, isValid: result.isValid};\n },\n values: formValues,\n };\n\n return (\n <div id={id} className={containerClasses} data-testid=\"thunderid-signin\">\n {children(renderProps)}\n </div>\n );\n }\n\n // Default UI rendering\n if (isLoading) {\n return (\n <CardPrimitive\n id={id}\n className={cx(containerClasses, styles.card)}\n data-testid=\"thunderid-signin\"\n variant={variant}\n >\n <CardPrimitive.Content>\n <div className={(styles as Record<string, string>)['centeredSpinnerContainer']}>\n <Spinner />\n </div>\n </CardPrimitive.Content>\n </CardPrimitive>\n );\n }\n\n if (!components || components.length === 0) {\n return (\n <CardPrimitive\n id={id}\n className={cx(containerClasses, styles.card)}\n data-testid=\"thunderid-signin\"\n variant={variant}\n >\n <CardPrimitive.Content>\n <AlertPrimitive variant=\"warning\">\n <Typography variant=\"body1\">{t('errors.signin.components.not.available')}</Typography>\n </AlertPrimitive>\n </CardPrimitive.Content>\n </CardPrimitive>\n );\n }\n\n return (\n <CardPrimitive\n id={id}\n className={cx(containerClasses, styles.card)}\n data-testid=\"thunderid-signin\"\n variant={variant}\n >\n <CardPrimitive.Content>\n {externalError && (\n <div className={styles.flowMessagesContainer}>\n <AlertPrimitive variant=\"error\" className={cx(styles.flowMessageItem, messageClasses)}>\n <AlertPrimitive.Description>{externalError.message}</AlertPrimitive.Description>\n </AlertPrimitive>\n </div>\n )}\n {flowMessages && flowMessages.length > 0 && (\n <div className={styles.flowMessagesContainer}>\n {flowMessages.map((message: any, index: any) => (\n <AlertPrimitive\n key={index}\n variant={message.type === '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}>{renderComponents(components)}</div>\n </CardPrimitive.Content>\n </CardPrimitive>\n );\n};\n\n/**\n * Base SignIn component that provides generic authentication flow.\n * This component handles component-driven UI rendering and can transform input\n * structure to component-driven format automatically.\n *\n * @example\n * // Default UI\n * ```tsx\n * import { BaseSignIn } from '@thunderid/react';\n *\n * const MySignIn = () => {\n * return (\n * <BaseSignIn\n * components={components}\n * onSubmit={async (payload) => {\n * return await handleAuth(payload);\n * }}\n * onSuccess={(authData) => {\n * console.log('Success:', authData);\n * }}\n * className=\"max-w-md mx-auto\"\n * />\n * );\n * };\n * ```\n *\n * @example\n * // Custom UI with render props\n * ```tsx\n * <BaseSignIn components={components} onSubmit={handleSubmit}>\n * {({values, errors, handleInputChange, handleSubmit, isLoading, components}) => (\n * <div className=\"custom-form\">\n * <input\n * name=\"username\"\n * value={values.username || ''}\n * onChange={(e) => handleInputChange('username', e.target.value)}\n * />\n * {errors.username && <span>{errors.username}</span>}\n * <button\n * onClick={() => handleSubmit(components[0], values)}\n * disabled={isLoading}\n * >\n * Sign In\n * </button>\n * </div>\n * )}\n * </BaseSignIn>\n * ```\n */\nconst BaseSignIn: FC<BaseSignInProps> = ({preferences, ...rest}: BaseSignInProps): ReactElement => {\n const content: ReactElement = (\n <FlowProvider>\n <BaseSignInContent {...rest} />\n </FlowProvider>\n );\n\n if (!preferences) return content;\n\n return <ComponentPreferencesContext.Provider value={preferences}>{content}</ComponentPreferencesContext.Provider>;\n};\n\nexport default BaseSignIn;\n"],"mappings":"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"}
|
|
@@ -135,11 +135,11 @@ const BaseSignUpContent = ({ afterSignUpUrl, onInitialize, onSubmit, onError, on
|
|
|
135
135
|
required: component.required || false,
|
|
136
136
|
validator: (value) => {
|
|
137
137
|
if (component.required && (!value || value.trim() === "")) return t("validations.required.field.error");
|
|
138
|
-
if ((component.type === __thunderid_browser.EmbeddedFlowComponentType.EmailInput || component.variant === "EMAIL") && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) return t("field.email.invalid");
|
|
139
138
|
if (ruleValidator && value) {
|
|
140
139
|
const ruleMessage = ruleValidator(value);
|
|
141
140
|
if (ruleMessage) return t(ruleMessage);
|
|
142
141
|
}
|
|
142
|
+
if ((component.type === __thunderid_browser.EmbeddedFlowComponentType.EmailInput || component.variant === "EMAIL") && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) return t("field.email.invalid");
|
|
143
143
|
return null;
|
|
144
144
|
}
|
|
145
145
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseSignUp.cjs","names":["logger: ReturnType<typeof createPackageComponentLogger>","BaseSignUpContent: FC<BaseSignUpProps>","useTheme","customRenderers: ComponentRendererMap","ComponentRendererContext","useTranslation","useFlow","useThunderID","styles: any","useStyles","challengeTokenRef: any","initializationAttemptedRef: any","passkeyProcessedRef: any","tempData: any","storageManager: any","handleError: any","errorMessage: string","extractErrorMessage","normalizeFlowResponseLocal: any","normalizeFlowResponse","extractFormFields: any","fields: FormField[]","EmbeddedFlowComponentType","fieldName: any","useForm","responseFieldErrors: FieldError[] | undefined","errors: Record<string, string>","touched: Record<string, boolean>","setupFormFields: any","fields: any","initialValues: Record<string, string>","data: any","components: unknown[] | undefined","EmbeddedSignUpFlowStatus","normalized: any","EmbeddedSignUpFlowType","redirectUrl: any","popup: any","hasProcessedCallback: any","popupMonitor: ReturnType<typeof setInterval> | null","messageHandler: ((event: MessageEvent) => Promise<void>) | null","expectedOrigin: any","payload: EmbeddedSignUpFlowRequest","continueResponse: any","normalizedContinueResponse: any","popupUrl: any","url: any","code: any","state: any","composedData: Record<string, any> | undefined","composeAffixedInputs","filteredInputs: Record<string, any>","response: any","effectiveExecutionIdForPasskey: any","passkeyResponse: any","handlePasskeyRegistration","passkeyResponseObj: any","inputs: any","processedResponse: any","containerClasses: any","cx","inputClasses: any","buttonClasses: any","errorClasses: any","messageClasses: any","renderComponents: any","renderSignUpComponents","urlParams: any","payload: any","url: URL","result: any","CardPrimitive","Spinner","AlertPrimitive","getAuthComponentHeadings","Typography","BaseSignUp: FC<BaseSignUpProps>","content: ReactElement","Logo","FlowProvider","ComponentPreferencesContext"],"sources":["../../../../../../src/components/presentation/auth/SignUp/BaseSignUp.tsx"],"sourcesContent":["// Copyright 2025-2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n EmbeddedSignUpFlowRequest,\n EmbeddedSignUpFlowResponse,\n EmbeddedSignUpFlowStatus,\n EmbeddedSignUpFlowType,\n withVendorCSSClassPrefix,\n EmbeddedFlowComponentType,\n FieldError,\n createPackageComponentLogger,\n buildValidatorFromRules,\n Preferences,\n} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport useStyles from './BaseSignUp.styles';\nimport ComponentRendererContext, {\n ComponentRendererMap,\n} from '../../../../contexts/ComponentRenderer/ComponentRendererContext';\nimport FlowProvider from '../../../../contexts/Flow/FlowProvider';\nimport useFlow from '../../../../contexts/Flow/useFlow';\nimport ComponentPreferencesContext from '../../../../contexts/I18n/ComponentPreferencesContext';\nimport useTheme from '../../../../contexts/Theme/useTheme';\nimport useThunderID from '../../../../contexts/ThunderID/useThunderID';\nimport {useForm, FormField} from '../../../../hooks/useForm';\nimport useTranslation from '../../../../hooks/useTranslation';\nimport {cx} from '../../../../styles/emotion';\nimport composeAffixedInputs from '../../../../utils/composeAffixedInputs';\nimport {normalizeFlowResponse, extractErrorMessage} from '../../../../utils/flowTransformer';\nimport getAuthComponentHeadings from '../../../../utils/getAuthComponentHeadings';\nimport {handlePasskeyRegistration} from '../../../../utils/passkey';\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 {renderSignUpComponents} from '../AuthOptionFactory';\n\nconst logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(\n '@thunderid/react',\n 'BaseSignUp',\n);\n\n/**\n * State for tracking passkey registration\n */\ninterface PasskeyState {\n actionId: string | null;\n creationOptions: string | null;\n error: Error | null;\n executionId: string | null;\n isActive: boolean;\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 * API error (if any)\n */\n error?: Error | null;\n\n /**\n * Field validation errors\n */\n fieldErrors: 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: () => {fieldErrors: 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 * Error object to display\n */\n error?: Error | null;\n\n /**\n * Custom CSS class name for error messages.\n */\n errorClassName?: string;\n\n /**\n * HTML id attribute for the form container.\n */\n id?: 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: EmbeddedSignUpFlowResponse) => 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: EmbeddedSignUpFlowResponse) => void;\n\n /**\n * Function to initialize sign-up flow.\n * @returns Promise resolving to the initial sign-up response.\n */\n onInitialize?: (payload?: EmbeddedSignUpFlowRequest) => Promise<EmbeddedSignUpFlowResponse>;\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: EmbeddedSignUpFlowRequest) => Promise<EmbeddedSignUpFlowResponse>;\n /**\n * Component-level preferences to override global i18n and theme settings.\n * Preferences are deep-merged with global ones, with component preferences\n * taking precedence. Affects this component and all its descendants.\n */\n preferences?: Preferences;\n\n /**\n * When a field has been blurred at least once, re-run validation on every subsequent\n * keystroke so a rendered error clears the moment the value becomes valid. Doesn't\n * affect fields that have never been blurred — the user isn't shown errors while\n * initially typing. Default `false` preserves prior behavior.\n */\n revalidateOnChangeAfterBlur?: boolean;\n\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 * Internal component that consumes FlowContext and renders the sign-up UI.\n */\nconst BaseSignUpContent: FC<BaseSignUpProps> = ({\n afterSignUpUrl,\n onInitialize,\n onSubmit,\n onError,\n onFlowChange,\n onComplete,\n error: externalError,\n id,\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 revalidateOnChangeAfterBlur = false,\n}: BaseSignUpProps): ReactElement => {\n const {theme, colorScheme} = useTheme();\n const customRenderers: ComponentRendererMap = useContext(ComponentRendererContext);\n const {t} = useTranslation();\n const {subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages} = useFlow();\n const {meta, isInitialized: isSdkInitialized, getStorageManager, vendor} = useThunderID();\n const styles: any = useStyles(theme, colorScheme);\n\n const [isLoading, setIsLoading] = useState(false);\n const [isFlowInitialized, setIsFlowInitialized] = useState(false);\n const [currentFlow, setCurrentFlow] = useState<EmbeddedSignUpFlowResponse | null>(null);\n const [apiError, setApiError] = useState<Error | null>(null);\n const [isStorageReady, setIsStorageReady] = useState(false);\n const [passkeyState, setPasskeyState] = useState<PasskeyState>({\n actionId: null,\n creationOptions: null,\n error: null,\n executionId: null,\n isActive: false,\n });\n const challengeTokenRef: any = useRef<string | null>(null);\n\n const initializationAttemptedRef: any = useRef(false);\n const passkeyProcessedRef: any = useRef(false);\n // A completed flow leaves its last step rendered while the consumer navigates away, and the\n // redirect is not instantaneous. Latch the completion so the still-visible submit actions cannot\n // fire again: the executionId is spent, and re-submitting would start a whole new sign-up flow.\n const isFlowCompletedRef = useRef(false);\n\n /**\n * Restore any challenge token persisted before an OAuth redirect.\n */\n useEffect(() => {\n if (!isSdkInitialized) return;\n\n (async (): Promise<void> => {\n try {\n const storageManager: any = await getStorageManager();\n const tempData: any = await storageManager?.getTemporaryData();\n if (tempData?.challengeToken) {\n challengeTokenRef.current = tempData.challengeToken as string;\n }\n } catch {\n // StorageManager unavailable — continue without persisted token\n } finally {\n setIsStorageReady(true);\n }\n })();\n }, [isSdkInitialized]);\n\n /**\n * Updates challengeTokenRef immediately (stale-closure safe) and persists via\n * the provider's StorageManager so the token survives OAuth redirects.\n */\n const setChallengeToken = async (challengeToken: string | null): Promise<void> => {\n challengeTokenRef.current = challengeToken;\n try {\n const storageManager: any = await getStorageManager();\n if (storageManager) {\n if (challengeToken) {\n await storageManager.setTemporaryDataParameter('challengeToken', challengeToken);\n } else {\n await storageManager.removeTemporaryDataParameter('challengeToken');\n }\n }\n } catch {\n logger.warn('Failed to persist challenge token in storage.');\n }\n };\n\n /**\n * Handle error responses and extract meaningful error messages\n * Uses the transformer's extractErrorMessage function.\n */\n const handleError: any = useCallback(\n (error: any) => {\n const errorMessage: string = extractErrorMessage(error, t);\n\n // Set the API error state\n setApiError(error instanceof Error ? error : new Error(errorMessage));\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 /**\n * Normalize flow response to ensure component-driven format\n * Uses normalizeFlowResponse for modern API format responses\n */\n const normalizeFlowResponseLocal: any = useCallback(\n (response: EmbeddedSignUpFlowResponse): EmbeddedSignUpFlowResponse => {\n if (response?.data) {\n const {components} = normalizeFlowResponse(\n response,\n t,\n {\n defaultErrorKey: 'components.signUp.errors.generic',\n resolveTranslations: false,\n },\n meta,\n );\n\n return {\n ...response,\n data: {\n ...(response.data as any),\n components,\n },\n } as EmbeddedSignUpFlowResponse;\n }\n\n return response;\n },\n [t, children],\n );\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 (\n component.type === EmbeddedFlowComponentType.TextInput ||\n component.type === EmbeddedFlowComponentType.PasswordInput ||\n component.type === EmbeddedFlowComponentType.EmailInput ||\n component.type === EmbeddedFlowComponentType.Select ||\n component.type === EmbeddedFlowComponentType.DateInput\n ) {\n // Use component.ref (mapped identifier) as the field name instead of component.id\n // This ensures form field names match what the input components use\n const fieldName: any = component.ref || component.id;\n const ruleValidator = buildValidatorFromRules(component.validation);\n\n fields.push({\n initialValue: '',\n name: fieldName,\n required: component.required || false,\n validator: (value: string) => {\n if (component.required && (!value || value.trim() === '')) {\n return t('validations.required.field.error');\n }\n // Add email validation if it's an email field\n if (\n (component.type === EmbeddedFlowComponentType.EmailInput || component.variant === 'EMAIL') &&\n value &&\n !/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(value)\n ) {\n return t('field.email.invalid');\n }\n // Evaluate declarative validation rules from meta.components[].validation.\n if (ruleValidator && value) {\n const ruleMessage = ruleValidator(value);\n if (ruleMessage) {\n return t(ruleMessage);\n }\n }\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 = useMemo(\n () => ((currentFlow?.data as any)?.components ? extractFormFields((currentFlow!.data as any).components) : []),\n [currentFlow, extractFormFields],\n );\n\n const form: any = useForm<Record<string, string>>({\n fields: formFields,\n initialValues: {},\n requiredMessage: t('validations.required.field.error'),\n revalidateOnChangeAfterBlur,\n validateOnBlur: true,\n validateOnChange: false,\n });\n\n const {\n values: formValues,\n touched: touchedFields,\n errors: formErrors,\n isValid: isFormValid,\n setValue: setFormValue,\n setTouched: setFormTouched,\n setTouchedFields,\n setErrors: setFormErrors,\n clearErrors: clearFormErrors,\n validateForm,\n touchAllFields,\n reset: resetForm,\n } = form;\n\n // Project server-side fieldErrors from the flow response into form state.\n // `setTouchedFields` avoids re-running client-side validation that would wipe\n // server errors when the client rules happen to pass.\n useEffect(() => {\n clearFormErrors();\n const responseFieldErrors: FieldError[] | undefined = (currentFlow?.data as any)?.fieldErrors;\n if (!responseFieldErrors || responseFieldErrors.length === 0) {\n return;\n }\n const errors: Record<string, string> = {};\n const touched: Record<string, boolean> = {};\n for (const fe of responseFieldErrors) {\n if (!(fe.identifier in errors)) {\n errors[fe.identifier] = fe.message;\n touched[fe.identifier] = true;\n }\n }\n setTouchedFields(touched);\n setFormErrors(errors);\n }, [currentFlow, setFormErrors, setTouchedFields, clearFormErrors]);\n\n /**\n * Setup form fields based on the current flow.\n */\n const setupFormFields: any = useCallback(\n (flowResponse: EmbeddedSignUpFlowResponse) => {\n const fields: any = extractFormFields((flowResponse.data as any)?.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 * Determine whether a completed flow finished on a display-only screen.\n * Such a completion must be rendered, not redirected past.\n */\n const isDisplayOnlyCompletion = (response: EmbeddedSignUpFlowResponse): boolean => {\n const data: any = response?.data;\n const components: unknown[] | undefined = data?.components ?? data?.meta?.components;\n\n return (\n response?.flowStatus === EmbeddedSignUpFlowStatus.Complete &&\n Array.isArray(components) &&\n components.length > 0 &&\n !(response as {assertion?: string})?.assertion &&\n !data?.redirectURL &&\n !(response as any)?.redirectUrl\n );\n };\n\n /**\n * Handle a completed flow. A flow can complete on a display-only screen; in\n * that case render the screen and skip onComplete so the wrapper does not\n * immediately redirect away from it. Otherwise hand off to onComplete.\n */\n const handleFlowCompletion = (response: EmbeddedSignUpFlowResponse): void => {\n if (isDisplayOnlyCompletion(response)) {\n const normalized: any = normalizeFlowResponseLocal(response);\n setCurrentFlow(normalized);\n setupFormFields(normalized);\n return;\n }\n\n isFlowCompletedRef.current = true;\n onComplete?.(response);\n };\n\n /**\n * Handle input value changes.\n * Only updates the value without marking as touched.\n * Touched state is set on blur to avoid premature validation.\n */\n const handleInputChange = (name: string, value: string): void => {\n setFormValue(name, value);\n };\n\n /**\n * Handle input blur event.\n * Marks the field as touched, which triggers validation.\n */\n const handleInputBlur = (name: string): void => {\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: EmbeddedSignUpFlowResponse): boolean => {\n if (response?.type === EmbeddedSignUpFlowType.Redirection && (response?.data as any)?.redirectURL) {\n /**\n * Open a popup window to handle redirection prompts for social sign-up\n */\n const redirectUrl: any = (response.data as any).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 let hasProcessedCallback: any = false; // Prevent multiple processing\n let popupMonitor: ReturnType<typeof setInterval> | null = null;\n let messageHandler: ((event: MessageEvent) => Promise<void>) | null = null;\n\n /**\n * Clean up event listener and popup monitor\n */\n const cleanup = (): void => {\n if (messageHandler) {\n window.removeEventListener('message', messageHandler);\n }\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 hasProcessedCallback = true;\n\n const payload: EmbeddedSignUpFlowRequest = {\n ...(currentFlow?.executionId && {executionId: currentFlow.executionId}),\n inputs: {\n code,\n state,\n },\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n };\n\n try {\n const continueResponse: any = await onSubmit!(payload);\n await setChallengeToken(continueResponse.challengeToken ?? null);\n onFlowChange?.(continueResponse);\n\n if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(continueResponse);\n onError?.(continueResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(continueResponse as EmbeddedSignUpFlowResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n const normalizedContinueResponse: any = normalizeFlowResponseLocal(continueResponse);\n setCurrentFlow(normalizedContinueResponse);\n setupFormFields(normalizedContinueResponse);\n\n // Display error from INCOMPLETE response\n if (normalizedContinueResponse?.error) {\n handleError(normalizedContinueResponse);\n }\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: EmbeddedSignUpFlowRequest = {\n ...(currentFlow?.executionId && {executionId: currentFlow.executionId}),\n inputs: {\n code,\n state,\n },\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n };\n\n try {\n const continueResponse: any = await onSubmit!(payload);\n await setChallengeToken(continueResponse.challengeToken ?? null);\n onFlowChange?.(continueResponse);\n\n if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(continueResponse);\n onError?.(continueResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(continueResponse as EmbeddedSignUpFlowResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n const normalizedContinueResponse: any = normalizeFlowResponseLocal(continueResponse);\n setCurrentFlow(normalizedContinueResponse);\n setupFormFields(normalizedContinueResponse);\n\n // Display error from INCOMPLETE response\n if (normalizedContinueResponse?.error) {\n handleError(normalizedContinueResponse);\n }\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>, skipValidation?: boolean): Promise<void> => {\n if (!currentFlow || isFlowCompletedRef.current) {\n return;\n }\n\n // Only validate for form submit actions, skip for social/trigger actions\n if (!skipValidation) {\n // Mark all fields as touched before validation\n touchAllFields();\n\n const validation: ReturnType<typeof validateForm> = validateForm();\n\n if (!validation.isValid) {\n return;\n }\n }\n\n setIsLoading(true);\n setApiError(null);\n clearMessages();\n\n try {\n const composedData: Record<string, any> | undefined = data\n ? composeAffixedInputs(data as Record<string, string>, vendor)\n : undefined;\n\n // Filter out empty or undefined input values\n const filteredInputs: Record<string, any> = {};\n if (composedData) {\n Object.entries(composedData).forEach(([key, value]: [string, any]) => {\n if (value !== null && value !== undefined && value !== '') {\n filteredInputs[key] = value;\n }\n });\n }\n\n const payload: EmbeddedSignUpFlowRequest = {\n ...(currentFlow.executionId && {executionId: currentFlow.executionId}),\n ...(component.id && {action: component.id}),\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n inputs: filteredInputs,\n };\n\n const rawResponse: any = await onSubmit!(payload);\n const response: any = normalizeFlowResponseLocal(rawResponse);\n onFlowChange?.(response);\n\n await setChallengeToken(response.challengeToken ?? null);\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(response);\n onError?.(new Error(extractErrorMessage(response, t)));\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(response as EmbeddedSignUpFlowResponse);\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n if (handleRedirectionIfNeeded(response)) {\n return;\n }\n\n if (response.data?.additionalData?.passkeyCreationOptions) {\n const {passkeyCreationOptions}: any = response.data.additionalData;\n const effectiveExecutionIdForPasskey: any = response.executionId ?? currentFlow?.executionId;\n\n // Reset passkey processed ref to allow processing\n passkeyProcessedRef.current = false;\n\n // Set passkey state to trigger the passkey\n setPasskeyState({\n actionId: component.id || 'submit',\n creationOptions: passkeyCreationOptions,\n error: null,\n executionId: effectiveExecutionIdForPasskey,\n isActive: true,\n });\n setIsLoading(false);\n return;\n }\n setCurrentFlow(response);\n setupFormFields(response);\n\n // Display error from INCOMPLETE response\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n if (response?.error) {\n handleError(response);\n }\n }\n } catch (err) {\n handleError(err);\n onError?.(err as Error);\n } finally {\n setIsLoading(false);\n }\n };\n\n /**\n * Handle passkey registration when passkey state becomes active.\n * This effect auto-triggers the browser passkey popup and submits the result.\n */\n useEffect(() => {\n if (!passkeyState.isActive || !passkeyState.creationOptions || !passkeyState.executionId) {\n return;\n }\n\n // Prevent re-processing\n if (passkeyProcessedRef.current) {\n return;\n }\n passkeyProcessedRef.current = true;\n\n const performPasskeyRegistration = async (): Promise<void> => {\n const passkeyResponse: any = await handlePasskeyRegistration(passkeyState.creationOptions!);\n const passkeyResponseObj: any = JSON.parse(passkeyResponse);\n\n const inputs: any = {\n attestationObject: passkeyResponseObj.response.attestationObject,\n clientDataJSON: passkeyResponseObj.response.clientDataJSON,\n credentialId: passkeyResponseObj.id,\n };\n\n // After successful registration, submit the result to the server\n const payload: EmbeddedSignUpFlowRequest = {\n executionId: passkeyState.executionId ?? undefined,\n inputs,\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n } as any;\n\n const nextResponse: any = await onSubmit!(payload);\n const processedResponse: any = normalizeFlowResponseLocal(nextResponse);\n onFlowChange?.(processedResponse);\n\n if (processedResponse.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(processedResponse as EmbeddedSignUpFlowResponse);\n } else {\n setCurrentFlow(processedResponse);\n setupFormFields(processedResponse);\n }\n };\n\n performPasskeyRegistration()\n .then(() => {\n setPasskeyState({actionId: null, creationOptions: null, error: null, executionId: null, isActive: false});\n })\n .catch((error: any) => {\n setPasskeyState((prev: any) => ({...prev, error: error as Error, isActive: false}));\n handleError(error);\n onError?.(error as Error);\n });\n }, [passkeyState.isActive, passkeyState.creationOptions, passkeyState.executionId]);\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 resetForm,\n handleInputChange,\n {\n _customRenderers: customRenderers,\n _theme: theme,\n buttonClassName: buttonClasses,\n inputClassName: inputClasses,\n onInputBlur: handleInputBlur,\n onSubmit: handleSubmit,\n size,\n variant,\n vendor,\n },\n ),\n [\n customRenderers,\n formValues,\n touchedFields,\n formErrors,\n isFormValid,\n isLoading,\n size,\n theme,\n variant,\n vendor,\n inputClasses,\n buttonClasses,\n handleSubmit,\n handleInputBlur,\n ],\n );\n\n /**\n * Parse URL parameters to check for OAuth redirect state.\n */\n const getUrlParams = (): any => {\n const urlParams: any = new URL(window?.location?.href ?? '').searchParams;\n return {\n code: urlParams.get('code'),\n error: urlParams.get('error'),\n state: urlParams.get('state'),\n };\n };\n\n // Initialize the flow on component mount\n useEffect(() => {\n // Skip initialization if we're in an OAuth redirect state.\n const urlParams: any = getUrlParams();\n if (urlParams.code || urlParams.state) {\n return;\n }\n\n if (isInitialized && isStorageReady && !isFlowInitialized && !initializationAttemptedRef.current) {\n initializationAttemptedRef.current = true;\n\n (async (): Promise<void> => {\n setIsLoading(true);\n setApiError(null);\n clearMessages();\n\n try {\n const payload: any = challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : undefined;\n const rawResponse: any = await onInitialize?.(payload);\n const response: any = normalizeFlowResponseLocal(rawResponse);\n\n await setChallengeToken(response.challengeToken ?? null);\n setCurrentFlow(response);\n setIsFlowInitialized(true);\n onFlowChange?.(response);\n\n // Clean up executionId and applicationId from URL after storing in state\n if (window?.location?.href) {\n const url: URL = new URL(window.location.href);\n url.searchParams.delete('executionId');\n url.searchParams.delete('applicationId');\n window.history.replaceState({}, '', url.toString());\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(response);\n onError?.(new Error(extractErrorMessage(response, t)));\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(response as EmbeddedSignUpFlowResponse);\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n setupFormFields(response);\n\n // Display error from INCOMPLETE response\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n if (response?.error) {\n handleError(response);\n }\n }\n } catch (err) {\n handleError(err);\n onError?.(err as Error);\n } finally {\n setIsLoading(false);\n }\n })();\n }\n }, [\n isInitialized,\n isStorageReady,\n isFlowInitialized,\n onInitialize,\n onComplete,\n onError,\n onFlowChange,\n setupFormFields,\n normalizeFlowResponseLocal,\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 as any)?.components || [],\n error: apiError,\n fieldErrors: 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 const result: any = validateForm();\n return {fieldErrors: result.errors, isValid: result.isValid};\n },\n values: formValues,\n };\n\n return (\n <div id={id} className={containerClasses}>\n {children(renderProps)}\n </div>\n );\n }\n\n if (!isFlowInitialized && isLoading) {\n return (\n <CardPrimitive id={id} 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 id={id} 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 // Extract heading and subheading components and filter them from the main components\n const componentsToRender: any = (currentFlow.data as any)?.components || [];\n const {title, subtitle, componentsWithoutHeadings} = getAuthComponentHeadings(\n componentsToRender,\n flowTitle,\n flowSubtitle,\n t('signup.heading'),\n t('signup.subheading'),\n );\n\n return (\n <CardPrimitive id={id} 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 {title}\n </CardPrimitive.Title>\n )}\n {showSubtitle && (\n <Typography variant=\"body1\" className={styles.subtitle}>\n {subtitle}\n </Typography>\n )}\n </CardPrimitive.Header>\n )}\n <CardPrimitive.Content>\n {externalError && (\n <div className={styles.flowMessagesContainer}>\n <AlertPrimitive variant=\"error\" className={cx(styles.flowMessageItem, messageClasses)}>\n <AlertPrimitive.Description>{externalError.message}</AlertPrimitive.Description>\n </AlertPrimitive>\n </div>\n )}\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 {componentsWithoutHeadings && componentsWithoutHeadings.length > 0 ? (\n renderComponents(componentsWithoutHeadings)\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 ThunderIDV2.\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 */\nconst BaseSignUp: FC<BaseSignUpProps> = ({preferences, showLogo = true, ...rest}: BaseSignUpProps): ReactElement => {\n const {theme, colorScheme} = useTheme();\n const styles: any = useStyles(theme, colorScheme);\n\n const content: ReactElement = (\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 if (!preferences) return content;\n\n return <ComponentPreferencesContext.Provider value={preferences}>{content}</ComponentPreferencesContext.Provider>;\n};\n\nexport default BaseSignUp;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseSignUp.cjs","names":["logger: ReturnType<typeof createPackageComponentLogger>","BaseSignUpContent: FC<BaseSignUpProps>","useTheme","customRenderers: ComponentRendererMap","ComponentRendererContext","useTranslation","useFlow","useThunderID","styles: any","useStyles","challengeTokenRef: any","initializationAttemptedRef: any","passkeyProcessedRef: any","tempData: any","storageManager: any","handleError: any","errorMessage: string","extractErrorMessage","normalizeFlowResponseLocal: any","normalizeFlowResponse","extractFormFields: any","fields: FormField[]","EmbeddedFlowComponentType","fieldName: any","useForm","responseFieldErrors: FieldError[] | undefined","errors: Record<string, string>","touched: Record<string, boolean>","setupFormFields: any","fields: any","initialValues: Record<string, string>","data: any","components: unknown[] | undefined","EmbeddedSignUpFlowStatus","normalized: any","EmbeddedSignUpFlowType","redirectUrl: any","popup: any","hasProcessedCallback: any","popupMonitor: ReturnType<typeof setInterval> | null","messageHandler: ((event: MessageEvent) => Promise<void>) | null","expectedOrigin: any","payload: EmbeddedSignUpFlowRequest","continueResponse: any","normalizedContinueResponse: any","popupUrl: any","url: any","code: any","state: any","composedData: Record<string, any> | undefined","composeAffixedInputs","filteredInputs: Record<string, any>","response: any","effectiveExecutionIdForPasskey: any","passkeyResponse: any","handlePasskeyRegistration","passkeyResponseObj: any","inputs: any","processedResponse: any","containerClasses: any","cx","inputClasses: any","buttonClasses: any","errorClasses: any","messageClasses: any","renderComponents: any","renderSignUpComponents","urlParams: any","payload: any","url: URL","result: any","CardPrimitive","Spinner","AlertPrimitive","getAuthComponentHeadings","Typography","BaseSignUp: FC<BaseSignUpProps>","content: ReactElement","Logo","FlowProvider","ComponentPreferencesContext"],"sources":["../../../../../../src/components/presentation/auth/SignUp/BaseSignUp.tsx"],"sourcesContent":["// Copyright 2025-2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n EmbeddedSignUpFlowRequest,\n EmbeddedSignUpFlowResponse,\n EmbeddedSignUpFlowStatus,\n EmbeddedSignUpFlowType,\n withVendorCSSClassPrefix,\n EmbeddedFlowComponentType,\n FieldError,\n createPackageComponentLogger,\n buildValidatorFromRules,\n Preferences,\n} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport useStyles from './BaseSignUp.styles';\nimport ComponentRendererContext, {\n ComponentRendererMap,\n} from '../../../../contexts/ComponentRenderer/ComponentRendererContext';\nimport FlowProvider from '../../../../contexts/Flow/FlowProvider';\nimport useFlow from '../../../../contexts/Flow/useFlow';\nimport ComponentPreferencesContext from '../../../../contexts/I18n/ComponentPreferencesContext';\nimport useTheme from '../../../../contexts/Theme/useTheme';\nimport useThunderID from '../../../../contexts/ThunderID/useThunderID';\nimport {useForm, FormField} from '../../../../hooks/useForm';\nimport useTranslation from '../../../../hooks/useTranslation';\nimport {cx} from '../../../../styles/emotion';\nimport composeAffixedInputs from '../../../../utils/composeAffixedInputs';\nimport {normalizeFlowResponse, extractErrorMessage} from '../../../../utils/flowTransformer';\nimport getAuthComponentHeadings from '../../../../utils/getAuthComponentHeadings';\nimport {handlePasskeyRegistration} from '../../../../utils/passkey';\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 {renderSignUpComponents} from '../AuthOptionFactory';\n\nconst logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(\n '@thunderid/react',\n 'BaseSignUp',\n);\n\n/**\n * State for tracking passkey registration\n */\ninterface PasskeyState {\n actionId: string | null;\n creationOptions: string | null;\n error: Error | null;\n executionId: string | null;\n isActive: boolean;\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 * API error (if any)\n */\n error?: Error | null;\n\n /**\n * Field validation errors\n */\n fieldErrors: 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: () => {fieldErrors: 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 * Error object to display\n */\n error?: Error | null;\n\n /**\n * Custom CSS class name for error messages.\n */\n errorClassName?: string;\n\n /**\n * HTML id attribute for the form container.\n */\n id?: 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: EmbeddedSignUpFlowResponse) => 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: EmbeddedSignUpFlowResponse) => void;\n\n /**\n * Function to initialize sign-up flow.\n * @returns Promise resolving to the initial sign-up response.\n */\n onInitialize?: (payload?: EmbeddedSignUpFlowRequest) => Promise<EmbeddedSignUpFlowResponse>;\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: EmbeddedSignUpFlowRequest) => Promise<EmbeddedSignUpFlowResponse>;\n /**\n * Component-level preferences to override global i18n and theme settings.\n * Preferences are deep-merged with global ones, with component preferences\n * taking precedence. Affects this component and all its descendants.\n */\n preferences?: Preferences;\n\n /**\n * When a field has been blurred at least once, re-run validation on every subsequent\n * keystroke so a rendered error clears the moment the value becomes valid. Doesn't\n * affect fields that have never been blurred — the user isn't shown errors while\n * initially typing. Default `false` preserves prior behavior.\n */\n revalidateOnChangeAfterBlur?: boolean;\n\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 * Internal component that consumes FlowContext and renders the sign-up UI.\n */\nconst BaseSignUpContent: FC<BaseSignUpProps> = ({\n afterSignUpUrl,\n onInitialize,\n onSubmit,\n onError,\n onFlowChange,\n onComplete,\n error: externalError,\n id,\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 revalidateOnChangeAfterBlur = false,\n}: BaseSignUpProps): ReactElement => {\n const {theme, colorScheme} = useTheme();\n const customRenderers: ComponentRendererMap = useContext(ComponentRendererContext);\n const {t} = useTranslation();\n const {subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages} = useFlow();\n const {meta, isInitialized: isSdkInitialized, getStorageManager, vendor} = useThunderID();\n const styles: any = useStyles(theme, colorScheme);\n\n const [isLoading, setIsLoading] = useState(false);\n const [isFlowInitialized, setIsFlowInitialized] = useState(false);\n const [currentFlow, setCurrentFlow] = useState<EmbeddedSignUpFlowResponse | null>(null);\n const [apiError, setApiError] = useState<Error | null>(null);\n const [isStorageReady, setIsStorageReady] = useState(false);\n const [passkeyState, setPasskeyState] = useState<PasskeyState>({\n actionId: null,\n creationOptions: null,\n error: null,\n executionId: null,\n isActive: false,\n });\n const challengeTokenRef: any = useRef<string | null>(null);\n\n const initializationAttemptedRef: any = useRef(false);\n const passkeyProcessedRef: any = useRef(false);\n // A completed flow leaves its last step rendered while the consumer navigates away, and the\n // redirect is not instantaneous. Latch the completion so the still-visible submit actions cannot\n // fire again: the executionId is spent, and re-submitting would start a whole new sign-up flow.\n const isFlowCompletedRef = useRef(false);\n\n /**\n * Restore any challenge token persisted before an OAuth redirect.\n */\n useEffect(() => {\n if (!isSdkInitialized) return;\n\n (async (): Promise<void> => {\n try {\n const storageManager: any = await getStorageManager();\n const tempData: any = await storageManager?.getTemporaryData();\n if (tempData?.challengeToken) {\n challengeTokenRef.current = tempData.challengeToken as string;\n }\n } catch {\n // StorageManager unavailable — continue without persisted token\n } finally {\n setIsStorageReady(true);\n }\n })();\n }, [isSdkInitialized]);\n\n /**\n * Updates challengeTokenRef immediately (stale-closure safe) and persists via\n * the provider's StorageManager so the token survives OAuth redirects.\n */\n const setChallengeToken = async (challengeToken: string | null): Promise<void> => {\n challengeTokenRef.current = challengeToken;\n try {\n const storageManager: any = await getStorageManager();\n if (storageManager) {\n if (challengeToken) {\n await storageManager.setTemporaryDataParameter('challengeToken', challengeToken);\n } else {\n await storageManager.removeTemporaryDataParameter('challengeToken');\n }\n }\n } catch {\n logger.warn('Failed to persist challenge token in storage.');\n }\n };\n\n /**\n * Handle error responses and extract meaningful error messages\n * Uses the transformer's extractErrorMessage function.\n */\n const handleError: any = useCallback(\n (error: any) => {\n const errorMessage: string = extractErrorMessage(error, t);\n\n // Set the API error state\n setApiError(error instanceof Error ? error : new Error(errorMessage));\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 /**\n * Normalize flow response to ensure component-driven format\n * Uses normalizeFlowResponse for modern API format responses\n */\n const normalizeFlowResponseLocal: any = useCallback(\n (response: EmbeddedSignUpFlowResponse): EmbeddedSignUpFlowResponse => {\n if (response?.data) {\n const {components} = normalizeFlowResponse(\n response,\n t,\n {\n defaultErrorKey: 'components.signUp.errors.generic',\n resolveTranslations: false,\n },\n meta,\n );\n\n return {\n ...response,\n data: {\n ...(response.data as any),\n components,\n },\n } as EmbeddedSignUpFlowResponse;\n }\n\n return response;\n },\n [t, children],\n );\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 (\n component.type === EmbeddedFlowComponentType.TextInput ||\n component.type === EmbeddedFlowComponentType.PasswordInput ||\n component.type === EmbeddedFlowComponentType.EmailInput ||\n component.type === EmbeddedFlowComponentType.Select ||\n component.type === EmbeddedFlowComponentType.DateInput\n ) {\n // Use component.ref (mapped identifier) as the field name instead of component.id\n // This ensures form field names match what the input components use\n const fieldName: any = component.ref || component.id;\n const ruleValidator = buildValidatorFromRules(component.validation);\n\n fields.push({\n initialValue: '',\n name: fieldName,\n required: component.required || false,\n validator: (value: string) => {\n if (component.required && (!value || value.trim() === '')) {\n return t('validations.required.field.error');\n }\n // Evaluate declarative validation rules from meta.components[].validation.\n if (ruleValidator && value) {\n const ruleMessage = ruleValidator(value);\n if (ruleMessage) {\n return t(ruleMessage);\n }\n }\n // Add email validation if it's an email field\n if (\n (component.type === EmbeddedFlowComponentType.EmailInput || component.variant === 'EMAIL') &&\n value &&\n !/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(value)\n ) {\n return t('field.email.invalid');\n }\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 = useMemo(\n () => ((currentFlow?.data as any)?.components ? extractFormFields((currentFlow!.data as any).components) : []),\n [currentFlow, extractFormFields],\n );\n\n const form: any = useForm<Record<string, string>>({\n fields: formFields,\n initialValues: {},\n requiredMessage: t('validations.required.field.error'),\n revalidateOnChangeAfterBlur,\n validateOnBlur: true,\n validateOnChange: false,\n });\n\n const {\n values: formValues,\n touched: touchedFields,\n errors: formErrors,\n isValid: isFormValid,\n setValue: setFormValue,\n setTouched: setFormTouched,\n setTouchedFields,\n setErrors: setFormErrors,\n clearErrors: clearFormErrors,\n validateForm,\n touchAllFields,\n reset: resetForm,\n } = form;\n\n // Project server-side fieldErrors from the flow response into form state.\n // `setTouchedFields` avoids re-running client-side validation that would wipe\n // server errors when the client rules happen to pass.\n useEffect(() => {\n clearFormErrors();\n const responseFieldErrors: FieldError[] | undefined = (currentFlow?.data as any)?.fieldErrors;\n if (!responseFieldErrors || responseFieldErrors.length === 0) {\n return;\n }\n const errors: Record<string, string> = {};\n const touched: Record<string, boolean> = {};\n for (const fe of responseFieldErrors) {\n if (!(fe.identifier in errors)) {\n errors[fe.identifier] = fe.message;\n touched[fe.identifier] = true;\n }\n }\n setTouchedFields(touched);\n setFormErrors(errors);\n }, [currentFlow, setFormErrors, setTouchedFields, clearFormErrors]);\n\n /**\n * Setup form fields based on the current flow.\n */\n const setupFormFields: any = useCallback(\n (flowResponse: EmbeddedSignUpFlowResponse) => {\n const fields: any = extractFormFields((flowResponse.data as any)?.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 * Determine whether a completed flow finished on a display-only screen.\n * Such a completion must be rendered, not redirected past.\n */\n const isDisplayOnlyCompletion = (response: EmbeddedSignUpFlowResponse): boolean => {\n const data: any = response?.data;\n const components: unknown[] | undefined = data?.components ?? data?.meta?.components;\n\n return (\n response?.flowStatus === EmbeddedSignUpFlowStatus.Complete &&\n Array.isArray(components) &&\n components.length > 0 &&\n !(response as {assertion?: string})?.assertion &&\n !data?.redirectURL &&\n !(response as any)?.redirectUrl\n );\n };\n\n /**\n * Handle a completed flow. A flow can complete on a display-only screen; in\n * that case render the screen and skip onComplete so the wrapper does not\n * immediately redirect away from it. Otherwise hand off to onComplete.\n */\n const handleFlowCompletion = (response: EmbeddedSignUpFlowResponse): void => {\n if (isDisplayOnlyCompletion(response)) {\n const normalized: any = normalizeFlowResponseLocal(response);\n setCurrentFlow(normalized);\n setupFormFields(normalized);\n return;\n }\n\n isFlowCompletedRef.current = true;\n onComplete?.(response);\n };\n\n /**\n * Handle input value changes.\n * Only updates the value without marking as touched.\n * Touched state is set on blur to avoid premature validation.\n */\n const handleInputChange = (name: string, value: string): void => {\n setFormValue(name, value);\n };\n\n /**\n * Handle input blur event.\n * Marks the field as touched, which triggers validation.\n */\n const handleInputBlur = (name: string): void => {\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: EmbeddedSignUpFlowResponse): boolean => {\n if (response?.type === EmbeddedSignUpFlowType.Redirection && (response?.data as any)?.redirectURL) {\n /**\n * Open a popup window to handle redirection prompts for social sign-up\n */\n const redirectUrl: any = (response.data as any).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 let hasProcessedCallback: any = false; // Prevent multiple processing\n let popupMonitor: ReturnType<typeof setInterval> | null = null;\n let messageHandler: ((event: MessageEvent) => Promise<void>) | null = null;\n\n /**\n * Clean up event listener and popup monitor\n */\n const cleanup = (): void => {\n if (messageHandler) {\n window.removeEventListener('message', messageHandler);\n }\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 hasProcessedCallback = true;\n\n const payload: EmbeddedSignUpFlowRequest = {\n ...(currentFlow?.executionId && {executionId: currentFlow.executionId}),\n inputs: {\n code,\n state,\n },\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n };\n\n try {\n const continueResponse: any = await onSubmit!(payload);\n await setChallengeToken(continueResponse.challengeToken ?? null);\n onFlowChange?.(continueResponse);\n\n if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(continueResponse);\n onError?.(continueResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(continueResponse as EmbeddedSignUpFlowResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n const normalizedContinueResponse: any = normalizeFlowResponseLocal(continueResponse);\n setCurrentFlow(normalizedContinueResponse);\n setupFormFields(normalizedContinueResponse);\n\n // Display error from INCOMPLETE response\n if (normalizedContinueResponse?.error) {\n handleError(normalizedContinueResponse);\n }\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: EmbeddedSignUpFlowRequest = {\n ...(currentFlow?.executionId && {executionId: currentFlow.executionId}),\n inputs: {\n code,\n state,\n },\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n };\n\n try {\n const continueResponse: any = await onSubmit!(payload);\n await setChallengeToken(continueResponse.challengeToken ?? null);\n onFlowChange?.(continueResponse);\n\n if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(continueResponse);\n onError?.(continueResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(continueResponse as EmbeddedSignUpFlowResponse);\n } else if (continueResponse.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n const normalizedContinueResponse: any = normalizeFlowResponseLocal(continueResponse);\n setCurrentFlow(normalizedContinueResponse);\n setupFormFields(normalizedContinueResponse);\n\n // Display error from INCOMPLETE response\n if (normalizedContinueResponse?.error) {\n handleError(normalizedContinueResponse);\n }\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>, skipValidation?: boolean): Promise<void> => {\n if (!currentFlow || isFlowCompletedRef.current) {\n return;\n }\n\n // Only validate for form submit actions, skip for social/trigger actions\n if (!skipValidation) {\n // Mark all fields as touched before validation\n touchAllFields();\n\n const validation: ReturnType<typeof validateForm> = validateForm();\n\n if (!validation.isValid) {\n return;\n }\n }\n\n setIsLoading(true);\n setApiError(null);\n clearMessages();\n\n try {\n const composedData: Record<string, any> | undefined = data\n ? composeAffixedInputs(data as Record<string, string>, vendor)\n : undefined;\n\n // Filter out empty or undefined input values\n const filteredInputs: Record<string, any> = {};\n if (composedData) {\n Object.entries(composedData).forEach(([key, value]: [string, any]) => {\n if (value !== null && value !== undefined && value !== '') {\n filteredInputs[key] = value;\n }\n });\n }\n\n const payload: EmbeddedSignUpFlowRequest = {\n ...(currentFlow.executionId && {executionId: currentFlow.executionId}),\n ...(component.id && {action: component.id}),\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n inputs: filteredInputs,\n };\n\n const rawResponse: any = await onSubmit!(payload);\n const response: any = normalizeFlowResponseLocal(rawResponse);\n onFlowChange?.(response);\n\n await setChallengeToken(response.challengeToken ?? null);\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(response);\n onError?.(new Error(extractErrorMessage(response, t)));\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(response as EmbeddedSignUpFlowResponse);\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n if (handleRedirectionIfNeeded(response)) {\n return;\n }\n\n if (response.data?.additionalData?.passkeyCreationOptions) {\n const {passkeyCreationOptions}: any = response.data.additionalData;\n const effectiveExecutionIdForPasskey: any = response.executionId ?? currentFlow?.executionId;\n\n // Reset passkey processed ref to allow processing\n passkeyProcessedRef.current = false;\n\n // Set passkey state to trigger the passkey\n setPasskeyState({\n actionId: component.id || 'submit',\n creationOptions: passkeyCreationOptions,\n error: null,\n executionId: effectiveExecutionIdForPasskey,\n isActive: true,\n });\n setIsLoading(false);\n return;\n }\n setCurrentFlow(response);\n setupFormFields(response);\n\n // Display error from INCOMPLETE response\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n if (response?.error) {\n handleError(response);\n }\n }\n } catch (err) {\n handleError(err);\n onError?.(err as Error);\n } finally {\n setIsLoading(false);\n }\n };\n\n /**\n * Handle passkey registration when passkey state becomes active.\n * This effect auto-triggers the browser passkey popup and submits the result.\n */\n useEffect(() => {\n if (!passkeyState.isActive || !passkeyState.creationOptions || !passkeyState.executionId) {\n return;\n }\n\n // Prevent re-processing\n if (passkeyProcessedRef.current) {\n return;\n }\n passkeyProcessedRef.current = true;\n\n const performPasskeyRegistration = async (): Promise<void> => {\n const passkeyResponse: any = await handlePasskeyRegistration(passkeyState.creationOptions!);\n const passkeyResponseObj: any = JSON.parse(passkeyResponse);\n\n const inputs: any = {\n attestationObject: passkeyResponseObj.response.attestationObject,\n clientDataJSON: passkeyResponseObj.response.clientDataJSON,\n credentialId: passkeyResponseObj.id,\n };\n\n // After successful registration, submit the result to the server\n const payload: EmbeddedSignUpFlowRequest = {\n executionId: passkeyState.executionId ?? undefined,\n inputs,\n ...(challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : {}),\n } as any;\n\n const nextResponse: any = await onSubmit!(payload);\n const processedResponse: any = normalizeFlowResponseLocal(nextResponse);\n onFlowChange?.(processedResponse);\n\n if (processedResponse.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(processedResponse as EmbeddedSignUpFlowResponse);\n } else {\n setCurrentFlow(processedResponse);\n setupFormFields(processedResponse);\n }\n };\n\n performPasskeyRegistration()\n .then(() => {\n setPasskeyState({actionId: null, creationOptions: null, error: null, executionId: null, isActive: false});\n })\n .catch((error: any) => {\n setPasskeyState((prev: any) => ({...prev, error: error as Error, isActive: false}));\n handleError(error);\n onError?.(error as Error);\n });\n }, [passkeyState.isActive, passkeyState.creationOptions, passkeyState.executionId]);\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 resetForm,\n handleInputChange,\n {\n _customRenderers: customRenderers,\n _theme: theme,\n buttonClassName: buttonClasses,\n inputClassName: inputClasses,\n onInputBlur: handleInputBlur,\n onSubmit: handleSubmit,\n size,\n variant,\n vendor,\n },\n ),\n [\n customRenderers,\n formValues,\n touchedFields,\n formErrors,\n isFormValid,\n isLoading,\n size,\n theme,\n variant,\n vendor,\n inputClasses,\n buttonClasses,\n handleSubmit,\n handleInputBlur,\n ],\n );\n\n /**\n * Parse URL parameters to check for OAuth redirect state.\n */\n const getUrlParams = (): any => {\n const urlParams: any = new URL(window?.location?.href ?? '').searchParams;\n return {\n code: urlParams.get('code'),\n error: urlParams.get('error'),\n state: urlParams.get('state'),\n };\n };\n\n // Initialize the flow on component mount\n useEffect(() => {\n // Skip initialization if we're in an OAuth redirect state.\n const urlParams: any = getUrlParams();\n if (urlParams.code || urlParams.state) {\n return;\n }\n\n if (isInitialized && isStorageReady && !isFlowInitialized && !initializationAttemptedRef.current) {\n initializationAttemptedRef.current = true;\n\n (async (): Promise<void> => {\n setIsLoading(true);\n setApiError(null);\n clearMessages();\n\n try {\n const payload: any = challengeTokenRef.current ? {challengeToken: challengeTokenRef.current} : undefined;\n const rawResponse: any = await onInitialize?.(payload);\n const response: any = normalizeFlowResponseLocal(rawResponse);\n\n await setChallengeToken(response.challengeToken ?? null);\n setCurrentFlow(response);\n setIsFlowInitialized(true);\n onFlowChange?.(response);\n\n // Clean up executionId and applicationId from URL after storing in state\n if (window?.location?.href) {\n const url: URL = new URL(window.location.href);\n url.searchParams.delete('executionId');\n url.searchParams.delete('applicationId');\n window.history.replaceState({}, '', url.toString());\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Error) {\n handleError(response);\n onError?.(new Error(extractErrorMessage(response, t)));\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Complete) {\n handleFlowCompletion(response as EmbeddedSignUpFlowResponse);\n return;\n }\n\n if (response.flowStatus === EmbeddedSignUpFlowStatus.Incomplete) {\n setupFormFields(response);\n\n // Display error from INCOMPLETE response\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n if (response?.error) {\n handleError(response);\n }\n }\n } catch (err) {\n handleError(err);\n onError?.(err as Error);\n } finally {\n setIsLoading(false);\n }\n })();\n }\n }, [\n isInitialized,\n isStorageReady,\n isFlowInitialized,\n onInitialize,\n onComplete,\n onError,\n onFlowChange,\n setupFormFields,\n normalizeFlowResponseLocal,\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 as any)?.components || [],\n error: apiError,\n fieldErrors: 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 const result: any = validateForm();\n return {fieldErrors: result.errors, isValid: result.isValid};\n },\n values: formValues,\n };\n\n return (\n <div id={id} className={containerClasses}>\n {children(renderProps)}\n </div>\n );\n }\n\n if (!isFlowInitialized && isLoading) {\n return (\n <CardPrimitive id={id} 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 id={id} 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 // Extract heading and subheading components and filter them from the main components\n const componentsToRender: any = (currentFlow.data as any)?.components || [];\n const {title, subtitle, componentsWithoutHeadings} = getAuthComponentHeadings(\n componentsToRender,\n flowTitle,\n flowSubtitle,\n t('signup.heading'),\n t('signup.subheading'),\n );\n\n return (\n <CardPrimitive id={id} 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 {title}\n </CardPrimitive.Title>\n )}\n {showSubtitle && (\n <Typography variant=\"body1\" className={styles.subtitle}>\n {subtitle}\n </Typography>\n )}\n </CardPrimitive.Header>\n )}\n <CardPrimitive.Content>\n {externalError && (\n <div className={styles.flowMessagesContainer}>\n <AlertPrimitive variant=\"error\" className={cx(styles.flowMessageItem, messageClasses)}>\n <AlertPrimitive.Description>{externalError.message}</AlertPrimitive.Description>\n </AlertPrimitive>\n </div>\n )}\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 {componentsWithoutHeadings && componentsWithoutHeadings.length > 0 ? (\n renderComponents(componentsWithoutHeadings)\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 ThunderIDV2.\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 */\nconst BaseSignUp: FC<BaseSignUpProps> = ({preferences, showLogo = true, ...rest}: BaseSignUpProps): ReactElement => {\n const {theme, colorScheme} = useTheme();\n const styles: any = useStyles(theme, colorScheme);\n\n const content: ReactElement = (\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 if (!preferences) return content;\n\n return <ComponentPreferencesContext.Provider value={preferences}>{content}</ComponentPreferencesContext.Provider>;\n};\n\nexport default BaseSignUp;\n"],"mappings":"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"}
|
|
@@ -33,7 +33,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
|
|
|
33
33
|
* </FlowMetaProvider>
|
|
34
34
|
* ```
|
|
35
35
|
*/
|
|
36
|
-
const FlowMetaProvider = ({ children, enabled = true, initialMeta = null }) => {
|
|
36
|
+
const FlowMetaProvider = ({ children, enabled = true, fetchMeta, initialMeta = null, namespace }) => {
|
|
37
37
|
const { baseUrl, endpoints, applicationId, isInitialized } = require_useThunderID.default();
|
|
38
38
|
const i18nContext = require_useI18n.default();
|
|
39
39
|
const [meta, setMeta] = (0, react.useState)(initialMeta);
|
|
@@ -52,13 +52,17 @@ const FlowMetaProvider = ({ children, enabled = true, initialMeta = null }) => {
|
|
|
52
52
|
setIsLoading(true);
|
|
53
53
|
setError(null);
|
|
54
54
|
try {
|
|
55
|
-
setMeta(await (
|
|
55
|
+
setMeta(fetchMeta ? await fetchMeta({
|
|
56
|
+
applicationId,
|
|
57
|
+
language: i18nContext?.currentLanguage
|
|
58
|
+
}) : await (0, __thunderid_browser.getFlowMeta)({
|
|
56
59
|
baseUrl,
|
|
57
60
|
url: (0, __thunderid_browser.resolveResourceEndpoint)("flowMeta", { endpoints }),
|
|
58
61
|
...applicationId ? {
|
|
59
62
|
id: applicationId,
|
|
60
63
|
type: __thunderid_browser.FlowMetaType.App
|
|
61
64
|
} : {},
|
|
65
|
+
...namespace ? { namespace } : {},
|
|
62
66
|
language: i18nContext?.currentLanguage
|
|
63
67
|
}));
|
|
64
68
|
} catch (err) {
|
|
@@ -72,27 +76,33 @@ const FlowMetaProvider = ({ children, enabled = true, initialMeta = null }) => {
|
|
|
72
76
|
endpoints,
|
|
73
77
|
applicationId,
|
|
74
78
|
isInitialized,
|
|
75
|
-
i18nContext?.currentLanguage
|
|
79
|
+
i18nContext?.currentLanguage,
|
|
80
|
+
fetchMeta,
|
|
81
|
+
namespace
|
|
76
82
|
]);
|
|
77
83
|
const switchLanguage = (0, react.useCallback)(async (language) => {
|
|
78
84
|
if (!enabled) return;
|
|
79
85
|
setIsLoading(true);
|
|
80
86
|
setError(null);
|
|
81
87
|
try {
|
|
82
|
-
const result = await (
|
|
88
|
+
const result = fetchMeta ? await fetchMeta({
|
|
89
|
+
applicationId,
|
|
90
|
+
language
|
|
91
|
+
}) : await (0, __thunderid_browser.getFlowMeta)({
|
|
83
92
|
baseUrl,
|
|
84
93
|
url: (0, __thunderid_browser.resolveResourceEndpoint)("flowMeta", { endpoints }),
|
|
85
94
|
...applicationId ? {
|
|
86
95
|
id: applicationId,
|
|
87
96
|
type: __thunderid_browser.FlowMetaType.App
|
|
88
97
|
} : {},
|
|
98
|
+
...namespace ? { namespace } : {},
|
|
89
99
|
language
|
|
90
100
|
});
|
|
91
101
|
if (result.i18n?.translations && i18nContext?.injectBundles) {
|
|
92
102
|
const flatTranslations = {};
|
|
93
|
-
Object.entries(result.i18n.translations).forEach(([namespace, keys]) => {
|
|
103
|
+
Object.entries(result.i18n.translations).forEach(([namespace$1, keys]) => {
|
|
94
104
|
Object.entries(keys).forEach(([key, value$1]) => {
|
|
95
|
-
flatTranslations[`${namespace}.${key}`] = value$1;
|
|
105
|
+
flatTranslations[`${namespace$1}.${key}`] = value$1;
|
|
96
106
|
});
|
|
97
107
|
});
|
|
98
108
|
const bundle = { translations: flatTranslations };
|
|
@@ -110,7 +120,9 @@ const FlowMetaProvider = ({ children, enabled = true, initialMeta = null }) => {
|
|
|
110
120
|
baseUrl,
|
|
111
121
|
endpoints,
|
|
112
122
|
applicationId,
|
|
113
|
-
i18nContext
|
|
123
|
+
i18nContext,
|
|
124
|
+
fetchMeta,
|
|
125
|
+
namespace
|
|
114
126
|
]);
|
|
115
127
|
(0, react.useEffect)(() => {
|
|
116
128
|
if (pendingLanguage && i18nContext?.setLanguage) {
|
|
@@ -134,9 +146,9 @@ const FlowMetaProvider = ({ children, enabled = true, initialMeta = null }) => {
|
|
|
134
146
|
if (!meta?.i18n?.translations || !i18nContext?.injectBundles) return;
|
|
135
147
|
const metaLanguage = meta.i18n.language || __thunderid_browser.TranslationBundleConstants.FALLBACK_LOCALE;
|
|
136
148
|
const flatTranslations = {};
|
|
137
|
-
Object.entries(meta.i18n.translations).forEach(([namespace, keys]) => {
|
|
149
|
+
Object.entries(meta.i18n.translations).forEach(([namespace$1, keys]) => {
|
|
138
150
|
Object.entries(keys).forEach(([key, value$1]) => {
|
|
139
|
-
flatTranslations[`${namespace}.${key}`] = value$1;
|
|
151
|
+
flatTranslations[`${namespace$1}.${key}`] = value$1;
|
|
140
152
|
});
|
|
141
153
|
});
|
|
142
154
|
const bundle = { translations: flatTranslations };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlowMetaProvider.cjs","names":["FlowMetaProvider: FC<PropsWithChildren<FlowMetaProviderProps>>","useThunderID","i18nContext: I18nContextValue","useI18n","lastFetchedRef: RefObject<(() => Promise<void>) | null>","initialMetaConsumedRef: RefObject<boolean>","fetchFlowMeta: () => Promise<void>","FlowMetaType","err: unknown","switchLanguage: (language: string) => Promise<void>","result: FlowMetadataResponse","flatTranslations: Record<string, string>","value","bundle: I18nBundle","metaLanguage: string","TranslationBundleConstants","bundlesToInject: Record<string, I18nBundle>","value: any","FlowMetaContext"],"sources":["../../../../src/contexts/FlowMeta/FlowMetaProvider.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n FlowMetadataResponse,\n FlowMetaType,\n getFlowMeta,\n I18nBundle,\n resolveResourceEndpoint,\n TranslationBundleConstants,\n} from '@thunderid/browser';\nimport {FC, PropsWithChildren, ReactElement, RefObject, useCallback, useEffect, useRef, useState} from 'react';\nimport FlowMetaContext from './FlowMetaContext';\nimport {I18nContextValue} from '../I18n/I18nContext';\nimport useI18n from '../I18n/useI18n';\nimport useThunderID from '../ThunderID/useThunderID';\n\nexport interface FlowMetaProviderProps {\n /**\n * When false the provider skips fetching and provides null meta.\n * @default true\n */\n enabled?: boolean;\n\n /**\n * Flow metadata resolved ahead of time (e.g. fetched server-side during SSR) and used to seed\n * the provider's state. When present, the provider skips its own initial client-side fetch —\n * avoiding a redundant request and the flash of untranslated i18n keys while that fetch is in\n * flight — but still fetches normally on subsequent changes (e.g. an explicit language switch).\n */\n initialMeta?: FlowMetadataResponse | null;\n}\n\n/**\n * FlowMetaProvider fetches flow metadata from the `GET /flow/meta` endpoint\n * (v2 API) and makes it available to child components through `FlowMetaContext`.\n *\n * It is designed to be used in v2 embedded-flow scenarios and integrates with\n * `ThemeProvider` so that theme settings (colors, direction, typography, …)\n * from the server-side design configuration are applied automatically.\n *\n * @example\n * ```tsx\n * <FlowMetaProvider\n * config={{\n * baseUrl: 'https://localhost:8090',\n * type: FlowMetaType.App,\n * id: 'your-app-id',\n * }}\n * >\n * <ThemeProvider>\n * <App />\n * </ThemeProvider>\n * </FlowMetaProvider>\n * ```\n */\nconst FlowMetaProvider: FC<PropsWithChildren<FlowMetaProviderProps>> = ({\n children,\n enabled = true,\n initialMeta = null,\n}: PropsWithChildren<FlowMetaProviderProps>): ReactElement => {\n const {baseUrl, endpoints, applicationId, isInitialized} = useThunderID();\n const i18nContext: I18nContextValue = useI18n();\n\n const [meta, setMeta] = useState<FlowMetadataResponse | null>(initialMeta);\n const [isLoading, setIsLoading] = useState<boolean>(!initialMeta);\n const [error, setError] = useState<Error | null>(null);\n const [pendingLanguage, setPendingLanguage] = useState<string | null>(null);\n\n // Track the last fetchFlowMeta reference that was actually dispatched.\n // This prevents two classes of double-fetch:\n // 1. React StrictMode simulates unmount+remount — the re-mount fires the\n // effect again with the same fetchFlowMeta reference; without this guard\n // the else-branch would issue a redundant second network request.\n // 2. Rapid dependency changes (e.g. baseUrl stabilising) that produce two\n // effect firings before the first fetch completes.\n const lastFetchedRef: RefObject<(() => Promise<void>) | null> = useRef<(() => Promise<void>) | null>(null);\n const initialMetaConsumedRef: RefObject<boolean> = useRef(false);\n const fetchFlowMeta: () => Promise<void> = useCallback(async (): Promise<void> => {\n if (!enabled) {\n setMeta(null);\n setIsLoading(false);\n return;\n }\n\n // Defer until ThunderID finishes initializing (e.g. loading applicationId\n // from storage on refresh). Once initialized, proceed even if applicationId\n // is absent — some flows (e.g. AcceptInvite) have no applicationId by design.\n if (!isInitialized && !applicationId) {\n return;\n }\n\n setIsLoading(true);\n setError(null);\n\n try {\n const result: FlowMetadataResponse = await getFlowMeta({\n baseUrl,\n url: resolveResourceEndpoint('flowMeta', {endpoints}),\n ...(applicationId ? {id: applicationId, type: FlowMetaType.App} : {}),\n language: i18nContext?.currentLanguage,\n });\n setMeta(result);\n } catch (err: unknown) {\n setError(err instanceof Error ? err : new Error(String(err)));\n } finally {\n setIsLoading(false);\n }\n }, [enabled, baseUrl, endpoints, applicationId, isInitialized, i18nContext?.currentLanguage]);\n\n const switchLanguage: (language: string) => Promise<void> = useCallback(\n async (language: string): Promise<void> => {\n if (!enabled) return;\n\n setIsLoading(true);\n setError(null);\n\n try {\n const result: FlowMetadataResponse = await getFlowMeta({\n baseUrl,\n url: resolveResourceEndpoint('flowMeta', {endpoints}),\n ...(applicationId ? {id: applicationId, type: FlowMetaType.App} : {}),\n language,\n });\n\n // Inject translations for the new language before switching\n if (result.i18n?.translations && i18nContext?.injectBundles) {\n const flatTranslations: Record<string, string> = {};\n Object.entries(result.i18n.translations).forEach(([namespace, keys]: [string, Record<string, string>]) => {\n Object.entries(keys).forEach(([key, value]: [string, string]) => {\n flatTranslations[`${namespace}.${key}`] = value;\n });\n });\n const bundle: I18nBundle = {translations: flatTranslations} as unknown as I18nBundle;\n i18nContext.injectBundles({[language]: bundle});\n }\n\n // Defer setLanguage to the next effect cycle so injectBundles state\n // is committed before I18nProvider's setLanguage checks mergedBundles.\n setPendingLanguage(language);\n setMeta(result);\n } catch (err: unknown) {\n setError(err instanceof Error ? err : new Error(String(err)));\n } finally {\n setIsLoading(false);\n }\n },\n [enabled, baseUrl, endpoints, applicationId, i18nContext],\n );\n\n // After injectBundles + setPendingLanguage are batched and committed, this\n // effect fires with the updated i18nContext (mergedBundles now includes the\n // new language), so setLanguage succeeds on the first switch.\n useEffect(() => {\n if (pendingLanguage && i18nContext?.setLanguage) {\n i18nContext.setLanguage(pendingLanguage);\n setPendingLanguage(null);\n }\n }, [pendingLanguage, i18nContext?.setLanguage]);\n\n useEffect(() => {\n if (!initialMetaConsumedRef.current) {\n initialMetaConsumedRef.current = true;\n\n if (initialMeta) {\n // Seeded from SSR (or another caller) — skip the redundant first client-side fetch.\n // Later dependency changes (e.g. an explicit language switch) still fetch normally.\n lastFetchedRef.current = fetchFlowMeta;\n return;\n }\n }\n\n if (lastFetchedRef.current === fetchFlowMeta) {\n // Same reference as the last dispatch — this is a StrictMode re-mount\n // or an effect re-fire with unchanged deps. Skip to avoid a duplicate fetch.\n return;\n }\n\n lastFetchedRef.current = fetchFlowMeta;\n fetchFlowMeta();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [fetchFlowMeta]);\n\n // When meta loads with i18n translations, inject them into the i18n system.\n // Meta translations act as the base layer — prop-provided bundles still take precedence.\n useEffect(() => {\n if (!meta?.i18n?.translations || !i18nContext?.injectBundles) {\n return;\n }\n\n const metaLanguage: string = meta.i18n.language || TranslationBundleConstants.FALLBACK_LOCALE;\n\n // Flatten namespace-keyed translations to dot-path keys:\n // { \"signin\": { \"heading\": \"Sign In\" } } → { \"signin.heading\": \"Sign In\" }\n const flatTranslations: Record<string, string> = {};\n Object.entries(meta.i18n.translations).forEach(([namespace, keys]: [string, Record<string, string>]) => {\n Object.entries(keys).forEach(([key, value]: [string, string]) => {\n flatTranslations[`${namespace}.${key}`] = value;\n });\n });\n\n const bundle: I18nBundle = {translations: flatTranslations} as unknown as I18nBundle;\n\n // Inject under the meta language code and the i18n current language so\n // lookups succeed regardless of whether the system uses \"en\" or \"en-US\".\n const bundlesToInject: Record<string, I18nBundle> = {[metaLanguage]: bundle};\n if (i18nContext.currentLanguage && i18nContext.currentLanguage !== metaLanguage) {\n bundlesToInject[i18nContext.currentLanguage] = bundle;\n }\n if (i18nContext.fallbackLanguage && i18nContext.fallbackLanguage !== metaLanguage) {\n bundlesToInject[i18nContext.fallbackLanguage] = bundle;\n }\n\n i18nContext.injectBundles(bundlesToInject);\n }, [meta?.i18n?.translations, i18nContext?.injectBundles]);\n\n const value: any = {\n error,\n fetchFlowMeta,\n isLoading,\n meta,\n switchLanguage,\n };\n\n return <FlowMetaContext.Provider value={value}>{children}</FlowMetaContext.Provider>;\n};\n\nexport default FlowMetaProvider;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FlowMetaProvider.cjs","names":["FlowMetaProvider: FC<PropsWithChildren<FlowMetaProviderProps>>","useThunderID","i18nContext: I18nContextValue","useI18n","lastFetchedRef: RefObject<(() => Promise<void>) | null>","initialMetaConsumedRef: RefObject<boolean>","fetchFlowMeta: () => Promise<void>","FlowMetaType","err: unknown","switchLanguage: (language: string) => Promise<void>","result: FlowMetadataResponse","flatTranslations: Record<string, string>","namespace","value","bundle: I18nBundle","metaLanguage: string","TranslationBundleConstants","bundlesToInject: Record<string, I18nBundle>","value: any","FlowMetaContext"],"sources":["../../../../src/contexts/FlowMeta/FlowMetaProvider.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n FlowMetadataResponse,\n FlowMetaType,\n getFlowMeta,\n I18nBundle,\n resolveResourceEndpoint,\n TranslationBundleConstants,\n} from '@thunderid/browser';\nimport {FC, PropsWithChildren, ReactElement, RefObject, useCallback, useEffect, useRef, useState} from 'react';\nimport FlowMetaContext from './FlowMetaContext';\nimport {I18nContextValue} from '../I18n/I18nContext';\nimport useI18n from '../I18n/useI18n';\nimport useThunderID from '../ThunderID/useThunderID';\n\nexport interface FlowMetaProviderProps {\n /**\n * When false the provider skips fetching and provides null meta.\n * @default true\n */\n enabled?: boolean;\n\n /**\n * Overrides how flow metadata is fetched, routing the request through a caller-supplied\n * function (e.g. a Next.js Server Action) instead of the provider's default direct\n * browser-to-`baseUrl` `fetch()`. Use this when the ThunderID server's `baseUrl` is a\n * different origin than the app and CORS isn't (or can't be) configured for it — the\n * override runs server-side, so the browser never talks to `baseUrl` directly.\n *\n * Called for both the initial fetch and `switchLanguage()`.\n */\n fetchMeta?: (params: {applicationId?: string; language?: string}) => Promise<FlowMetadataResponse>;\n\n /**\n * Flow metadata resolved ahead of time (e.g. fetched server-side during SSR) and used to seed\n * the provider's state. When present, the provider skips its own initial client-side fetch —\n * avoiding a redundant request and the flash of untranslated i18n keys while that fetch is in\n * flight — but still fetches normally on subsequent changes (e.g. an explicit language switch).\n */\n initialMeta?: FlowMetadataResponse | null;\n\n /** Sent as the flow-meta request's `namespace`, e.g. to scope namespace-keyed i18n data. */\n namespace?: string;\n}\n\n/**\n * FlowMetaProvider fetches flow metadata from the `GET /flow/meta` endpoint\n * (v2 API) and makes it available to child components through `FlowMetaContext`.\n *\n * It is designed to be used in v2 embedded-flow scenarios and integrates with\n * `ThemeProvider` so that theme settings (colors, direction, typography, …)\n * from the server-side design configuration are applied automatically.\n *\n * @example\n * ```tsx\n * <FlowMetaProvider\n * config={{\n * baseUrl: 'https://localhost:8090',\n * type: FlowMetaType.App,\n * id: 'your-app-id',\n * }}\n * >\n * <ThemeProvider>\n * <App />\n * </ThemeProvider>\n * </FlowMetaProvider>\n * ```\n */\nconst FlowMetaProvider: FC<PropsWithChildren<FlowMetaProviderProps>> = ({\n children,\n enabled = true,\n fetchMeta,\n initialMeta = null,\n namespace,\n}: PropsWithChildren<FlowMetaProviderProps>): ReactElement => {\n const {baseUrl, endpoints, applicationId, isInitialized} = useThunderID();\n const i18nContext: I18nContextValue = useI18n();\n\n const [meta, setMeta] = useState<FlowMetadataResponse | null>(initialMeta);\n const [isLoading, setIsLoading] = useState<boolean>(!initialMeta);\n const [error, setError] = useState<Error | null>(null);\n const [pendingLanguage, setPendingLanguage] = useState<string | null>(null);\n\n // Track the last fetchFlowMeta reference that was actually dispatched.\n // This prevents two classes of double-fetch:\n // 1. React StrictMode simulates unmount+remount — the re-mount fires the\n // effect again with the same fetchFlowMeta reference; without this guard\n // the else-branch would issue a redundant second network request.\n // 2. Rapid dependency changes (e.g. baseUrl stabilising) that produce two\n // effect firings before the first fetch completes.\n const lastFetchedRef: RefObject<(() => Promise<void>) | null> = useRef<(() => Promise<void>) | null>(null);\n const initialMetaConsumedRef: RefObject<boolean> = useRef(false);\n const fetchFlowMeta: () => Promise<void> = useCallback(async (): Promise<void> => {\n if (!enabled) {\n setMeta(null);\n setIsLoading(false);\n return;\n }\n\n // Defer until ThunderID finishes initializing (e.g. loading applicationId\n // from storage on refresh). Once initialized, proceed even if applicationId\n // is absent — some flows (e.g. AcceptInvite) have no applicationId by design.\n if (!isInitialized && !applicationId) {\n return;\n }\n\n setIsLoading(true);\n setError(null);\n\n try {\n const result: FlowMetadataResponse = fetchMeta\n ? await fetchMeta({applicationId, language: i18nContext?.currentLanguage})\n : await getFlowMeta({\n baseUrl,\n url: resolveResourceEndpoint('flowMeta', {endpoints}),\n ...(applicationId ? {id: applicationId, type: FlowMetaType.App} : {}),\n ...(namespace ? {namespace} : {}),\n language: i18nContext?.currentLanguage,\n });\n setMeta(result);\n } catch (err: unknown) {\n setError(err instanceof Error ? err : new Error(String(err)));\n } finally {\n setIsLoading(false);\n }\n }, [enabled, baseUrl, endpoints, applicationId, isInitialized, i18nContext?.currentLanguage, fetchMeta, namespace]);\n\n const switchLanguage: (language: string) => Promise<void> = useCallback(\n async (language: string): Promise<void> => {\n if (!enabled) return;\n\n setIsLoading(true);\n setError(null);\n\n try {\n const result: FlowMetadataResponse = fetchMeta\n ? await fetchMeta({applicationId, language})\n : await getFlowMeta({\n baseUrl,\n url: resolveResourceEndpoint('flowMeta', {endpoints}),\n ...(applicationId ? {id: applicationId, type: FlowMetaType.App} : {}),\n ...(namespace ? {namespace} : {}),\n language,\n });\n\n // Inject translations for the new language before switching\n if (result.i18n?.translations && i18nContext?.injectBundles) {\n const flatTranslations: Record<string, string> = {};\n Object.entries(result.i18n.translations).forEach(([namespace, keys]: [string, Record<string, string>]) => {\n Object.entries(keys).forEach(([key, value]: [string, string]) => {\n flatTranslations[`${namespace}.${key}`] = value;\n });\n });\n const bundle: I18nBundle = {translations: flatTranslations} as unknown as I18nBundle;\n i18nContext.injectBundles({[language]: bundle});\n }\n\n // Defer setLanguage to the next effect cycle so injectBundles state\n // is committed before I18nProvider's setLanguage checks mergedBundles.\n setPendingLanguage(language);\n setMeta(result);\n } catch (err: unknown) {\n setError(err instanceof Error ? err : new Error(String(err)));\n } finally {\n setIsLoading(false);\n }\n },\n [enabled, baseUrl, endpoints, applicationId, i18nContext, fetchMeta, namespace],\n );\n\n // After injectBundles + setPendingLanguage are batched and committed, this\n // effect fires with the updated i18nContext (mergedBundles now includes the\n // new language), so setLanguage succeeds on the first switch.\n useEffect(() => {\n if (pendingLanguage && i18nContext?.setLanguage) {\n i18nContext.setLanguage(pendingLanguage);\n setPendingLanguage(null);\n }\n }, [pendingLanguage, i18nContext?.setLanguage]);\n\n useEffect(() => {\n if (!initialMetaConsumedRef.current) {\n initialMetaConsumedRef.current = true;\n\n if (initialMeta) {\n // Seeded from SSR (or another caller) — skip the redundant first client-side fetch.\n // Later dependency changes (e.g. an explicit language switch) still fetch normally.\n lastFetchedRef.current = fetchFlowMeta;\n return;\n }\n }\n\n if (lastFetchedRef.current === fetchFlowMeta) {\n // Same reference as the last dispatch — this is a StrictMode re-mount\n // or an effect re-fire with unchanged deps. Skip to avoid a duplicate fetch.\n return;\n }\n\n lastFetchedRef.current = fetchFlowMeta;\n fetchFlowMeta();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [fetchFlowMeta]);\n\n // When meta loads with i18n translations, inject them into the i18n system.\n // Meta translations act as the base layer — prop-provided bundles still take precedence.\n useEffect(() => {\n if (!meta?.i18n?.translations || !i18nContext?.injectBundles) {\n return;\n }\n\n const metaLanguage: string = meta.i18n.language || TranslationBundleConstants.FALLBACK_LOCALE;\n\n // Flatten namespace-keyed translations to dot-path keys:\n // { \"signin\": { \"heading\": \"Sign In\" } } → { \"signin.heading\": \"Sign In\" }\n const flatTranslations: Record<string, string> = {};\n Object.entries(meta.i18n.translations).forEach(([namespace, keys]: [string, Record<string, string>]) => {\n Object.entries(keys).forEach(([key, value]: [string, string]) => {\n flatTranslations[`${namespace}.${key}`] = value;\n });\n });\n\n const bundle: I18nBundle = {translations: flatTranslations} as unknown as I18nBundle;\n\n // Inject under the meta language code and the i18n current language so\n // lookups succeed regardless of whether the system uses \"en\" or \"en-US\".\n const bundlesToInject: Record<string, I18nBundle> = {[metaLanguage]: bundle};\n if (i18nContext.currentLanguage && i18nContext.currentLanguage !== metaLanguage) {\n bundlesToInject[i18nContext.currentLanguage] = bundle;\n }\n if (i18nContext.fallbackLanguage && i18nContext.fallbackLanguage !== metaLanguage) {\n bundlesToInject[i18nContext.fallbackLanguage] = bundle;\n }\n\n i18nContext.injectBundles(bundlesToInject);\n }, [meta?.i18n?.translations, i18nContext?.injectBundles]);\n\n const value: any = {\n error,\n fetchFlowMeta,\n isLoading,\n meta,\n switchLanguage,\n };\n\n return <FlowMetaContext.Provider value={value}>{children}</FlowMetaContext.Provider>;\n};\n\nexport default FlowMetaProvider;\n"],"mappings":"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"}
|