npm - @thunderid/react - Versions diffs - 1.0.8 → 1.2.0 - Mend

@thunderid/react 1.0.8 → 1.2.0

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.

Files changed (230) hide show

package/dist/cjs/components/presentation/UserDropdown/BaseUserDropdown.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseUserDropdown.cjs","names":["BaseUserDropdown: FC<BaseUserDropdownProps>","useTheme","styles: Record<string, string>","useStyles","autoUpdate","mergedMappings: Record<string, string \| string[]>","defaultMenuItems: MenuItem[]","User","LogOut","allMenuItems: MenuItem[]","cx","Button","Avatar","getMappedUserProfileValue","getDisplayName","Typography","FloatingPortal","FloatingFocusManager","css"],"sources":["../../../../../src/components/presentation/UserDropdown/BaseUserDropdown.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n useFloating,\n autoUpdate,\n offset,\n flip,\n shift,\n useClick,\n useDismiss,\n useRole,\n useInteractions,\n FloatingFocusManager,\n FloatingPortal,\n} from '@floating-ui/react';\nimport {withVendorCSSClassPrefix} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useState} from 'react';\nimport useStyles from './BaseUserDropdown.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport {css, cx} from '../../../styles/emotion';\nimport getDisplayName from '../../../utils/getDisplayName';\nimport getMappedUserProfileValue from '../../../utils/getMappedUserProfileValue';\nimport {Avatar} from '../../primitives/Avatar/Avatar';\nimport Button from '../../primitives/Button/Button';\nimport LogOut from '../../primitives/Icons/LogOut';\nimport User from '../../primitives/Icons/User';\nimport Typography from '../../primitives/Typography/Typography';\n\ninterface MenuItem {\n href?: string;\n icon?: ReactNode;\n label: ReactNode;\n onClick?: () => void;\n}\n\nexport interface BaseUserDropdownProps {\n /*\n Mapping of component attribute names to identity provider field names.\n * Allows customizing which user profile fields should be used for each attribute.\n /\n attributeMapping?: {\n [key: string]: string \| string[] \| undefined;\n firstName?: string \| string[];\n lastName?: string \| string[];\n picture?: string \| string[];\n username?: string \| string[];\n };\n /\n Optional size for the avatar\n /\n avatarSize?: number;\n /\n Optional className for the dropdown container.\n /\n className?: string;\n /\n Optional element to render when no user is signed in.\n /\n fallback?: ReactElement \| null;\n /\n Whether the user data is currently loading\n /\n isLoading?: boolean;\n /\n Menu items to display in the dropdown\n /\n menuItems?: MenuItem[];\n /\n Callback function for \"Manage Profile\" action\n /\n onManageProfile?: () => void;\n /\n Callback function for \"Sign Out\" action\n /\n onSignOut?: () => void;\n /\n The HTML element ID where the portal should be mounted\n /\n portalId?: string;\n /\n Show dropdown header with user information\n /\n showDropdownHeader?: boolean;\n /\n Show user's display name next to avatar in the trigger button\n /\n showTriggerLabel?: boolean;\n /\n The user object containing profile information\n /\n user: any;\n}\n\n/\n BaseUserDropdown component displays a user avatar with a dropdown menu.\n * When clicked, it shows a popover with customizable menu items.\n * This component serves as the base for framework-specific implementations.\n /\nexport const BaseUserDropdown: FC<BaseUserDropdownProps> = ({\n fallback = null,\n className = '',\n user,\n isLoading = false,\n portalId = 'thunderid-user-dropdown',\n menuItems = [],\n showTriggerLabel = false,\n avatarSize = 32,\n onManageProfile,\n onSignOut,\n attributeMapping = {},\n}: BaseUserDropdownProps): ReactElement \| null => {\n const {theme, colorScheme} = useTheme();\n const styles: Record<string, string> = useStyles(theme, colorScheme);\n const [isOpen, setIsOpen] = useState(false);\n const [hoveredItemIndex, setHoveredItemIndex] = useState<number \| null>(null);\n\n const {refs, floatingStyles, context} = useFloating({\n middleware: [offset(5), flip({fallbackAxisSideDirection: 'end'}), shift({padding: 5})],\n onOpenChange: setIsOpen,\n open: isOpen,\n placement: 'bottom-end',\n whileElementsMounted: autoUpdate,\n });\n\n const click: any = useClick(context);\n const dismiss: any = useDismiss(context);\n const role: any = useRole(context);\n\n const {getReferenceProps, getFloatingProps} = useInteractions([click, dismiss, role]);\n\n const defaultAttributeMappings: Record<string, string \| string[]> = {\n email: ['emails'],\n firstName: ['name.givenName', 'given_name'],\n lastName: ['name.familyName', 'family_name'],\n picture: ['profile', 'profileUrl', 'picture', 'URL'],\n username: ['userName', 'username', 'user_name'],\n };\n\n const mergedMappings: Record<string, string \| string[]> = Object.fromEntries(\n Object.entries({...defaultAttributeMappings, ...attributeMapping}).filter(\n (entry): entry is [string, string \| string[]] => entry[1] !== undefined,\n ),\n );\n\n if (fallback && !user && !isLoading) {\n return fallback;\n }\n\n const handleMenuItemClick = (item: MenuItem): void => {\n if (item.onClick) {\n item.onClick();\n }\n setIsOpen(false);\n };\n\n const defaultMenuItems: MenuItem[] = [];\n\n if (onManageProfile) {\n defaultMenuItems.push({\n icon: <User width=\"16\" height=\"16\" />,\n label: 'Manage Profile',\n onClick: onManageProfile,\n });\n }\n\n if (onSignOut) {\n defaultMenuItems.push({\n icon: <LogOut width=\"16\" height=\"16\" />,\n label: 'Sign Out',\n onClick: onSignOut,\n });\n }\n\n const allMenuItems: MenuItem[] = [...menuItems];\n\n if (defaultMenuItems.length > 0) {\n if (menuItems.length > 0) {\n allMenuItems.push({label: '', onClick: undefined});\n }\n\n allMenuItems.push(...defaultMenuItems);\n }\n\n return (\n <div className={cx(withVendorCSSClassPrefix('user-dropdown'), className)}>\n <Button\n ref={refs.setReference}\n className={cx(withVendorCSSClassPrefix('user-dropdown__trigger'), styles['trigger'])}\n color=\"tertiary\"\n variant=\"text\"\n size=\"medium\"\n data-testid=\"thunderid-user-dropdown-trigger\"\n startIcon={\n <Avatar\n imageUrl={getMappedUserProfileValue('picture', mergedMappings, user)}\n name={getDisplayName(mergedMappings, user)}\n size={avatarSize}\n alt={`${getDisplayName(mergedMappings, user)}'s avatar`}\n />\n }\n {...getReferenceProps()}\n >\n {showTriggerLabel && (\n <Typography\n variant=\"body2\"\n className={cx(withVendorCSSClassPrefix('user-dropdown__trigger-label'), styles['userName'])}\n >\n {getDisplayName(mergedMappings, user)}\n </Typography>\n )}\n </Button>\n\n {isOpen && (\n <FloatingPortal id={portalId}>\n <FloatingFocusManager context={context} modal={false} initialFocus={-1}>\n <div\n ref={refs.setFloating}\n className={cx(\n withVendorCSSClassPrefix('user-dropdown__content'),\n styles['dropdownContent'],\n // Floating UI recomputes the position on every render, so this class is generated\n // fresh each time rather than memoized - Emotion still injects it into the shared,\n // nonce-tagged `<style>` element, so no inline `style` attribute is needed.\n css({\n ...floatingStyles,\n // Floating UI doesn't set a z-index by default, so we set a high value to ensure the dropdown appears above other elements.\n // https://floating-ui.com/docs/misc#z-index-stacking\n zIndex: 9999,\n }),\n )}\n {...getFloatingProps()}\n >\n <div className={cx(withVendorCSSClassPrefix('user-dropdown__header'), styles['dropdownHeader'])}>\n <Avatar\n imageUrl={getMappedUserProfileValue('picture', mergedMappings, user)}\n name={getDisplayName(mergedMappings, user)}\n size={avatarSize 1.25}\n alt={`${getDisplayName(mergedMappings, user)}'s avatar`}\n />\n <div className={cx(withVendorCSSClassPrefix('user-dropdown__header-info'), styles['headerInfo'])}>\n <Typography\n noWrap\n className={withVendorCSSClassPrefix('user-dropdown__header-name')}\n variant=\"body1\"\n fontWeight=\"medium\"\n >\n {getDisplayName(mergedMappings, user)}\n </Typography>\n <Typography\n noWrap\n className={withVendorCSSClassPrefix('user-dropdown__header-email')}\n variant=\"caption\"\n color=\"secondary\"\n >\n {getMappedUserProfileValue('username', mergedMappings, user) \|\|\n getMappedUserProfileValue('email', mergedMappings, user)}\n </Typography>\n </div>\n </div>\n <div className={cx(withVendorCSSClassPrefix('user-dropdown__menu'), styles['dropdownMenu'])}>\n {allMenuItems.map((item: any, index: number) => (\n <div key={index}>\n {((): ReactElement => {\n if (item.label === '') {\n return (\n <div\n className={cx(withVendorCSSClassPrefix('user-dropdown__menu-divider'), styles['divider'])}\n />\n );\n }\n if (item.href) {\n return (\n <a\n href={item.href}\n className={cx(\n withVendorCSSClassPrefix('user-dropdown__menu-item'),\n styles['menuItemAnchor'],\n hoveredItemIndex === index && styles['menuItemHighlighted'],\n )}\n onMouseEnter={(): void => setHoveredItemIndex(index)}\n onMouseLeave={(): void => setHoveredItemIndex(null)}\n onFocus={(): void => setHoveredItemIndex(index)}\n onBlur={(): void => setHoveredItemIndex(null)}\n >\n {item.icon}\n <span>{item.label}</span>\n </a>\n );\n }\n return (\n <Button\n onClick={(): void => handleMenuItemClick(item)}\n className={cx(\n withVendorCSSClassPrefix('user-dropdown__menu-item'),\n styles['menuItem'],\n hoveredItemIndex === index && styles['menuItemHighlighted'],\n )}\n color=\"tertiary\"\n variant=\"text\"\n size=\"small\"\n startIcon={item.icon}\n onMouseEnter={(): void => setHoveredItemIndex(index)}\n onMouseLeave={(): void => setHoveredItemIndex(null)}\n >\n {item.label}\n </Button>\n );\n })()}\n </div>\n ))}\n </div>\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n )}\n </div>\n );\n};\n\nexport default BaseUserDropdown;\n"],"mappings":"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"}
1	+ {"version":3,"file":"BaseUserDropdown.cjs","names":["BaseUserDropdown: FC<BaseUserDropdownProps>","useTheme","styles: Record<string, string>","useStyles","autoUpdate","mergedMappings: Record<string, string \| string[]>","defaultMenuItems: MenuItem[]","User","LogOut","allMenuItems: MenuItem[]","cx","Button","Avatar","getMappedUserProfileValue","getDisplayName","Typography","FloatingPortal","FloatingFocusManager","css"],"sources":["../../../../../src/components/presentation/UserDropdown/BaseUserDropdown.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n useFloating,\n autoUpdate,\n offset,\n flip,\n shift,\n useClick,\n useDismiss,\n useRole,\n useInteractions,\n FloatingFocusManager,\n FloatingPortal,\n} from '@floating-ui/react';\nimport {withVendorCSSClassPrefix} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useState} from 'react';\nimport useStyles from './BaseUserDropdown.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport {css, cx} from '../../../styles/emotion';\nimport getDisplayName from '../../../utils/getDisplayName';\nimport getMappedUserProfileValue from '../../../utils/getMappedUserProfileValue';\nimport {Avatar} from '../../primitives/Avatar/Avatar';\nimport Button from '../../primitives/Button/Button';\nimport LogOut from '../../primitives/Icons/LogOut';\nimport User from '../../primitives/Icons/User';\nimport Typography from '../../primitives/Typography/Typography';\n\ninterface MenuItem {\n href?: string;\n icon?: ReactNode;\n label: ReactNode;\n onClick?: () => void;\n}\n\nexport interface BaseUserDropdownProps {\n /*\n Mapping of component attribute names to identity provider field names.\n * Allows customizing which user profile fields should be used for each attribute.\n /\n attributeMapping?: {\n [key: string]: string \| string[] \| undefined;\n firstName?: string \| string[];\n lastName?: string \| string[];\n picture?: string \| string[];\n username?: string \| string[];\n };\n /\n Optional size for the avatar\n /\n avatarSize?: number;\n /\n Optional className for the dropdown container.\n /\n className?: string;\n /\n Optional element to render when no user is signed in.\n /\n fallback?: ReactElement \| null;\n /\n Whether the user data is currently loading\n /\n isLoading?: boolean;\n /\n Label for the \"Manage Profile\" menu item. Defaults to `'Manage Profile'`; set this\n * to relabel the action (e.g. `'Manage Account'`) without replacing the whole item.\n /\n manageProfileLabel?: string;\n /\n Menu items to display in the dropdown\n /\n menuItems?: MenuItem[];\n /\n Callback function for \"Manage Profile\" action\n /\n onManageProfile?: () => void;\n /\n Callback function for \"Sign Out\" action\n /\n onSignOut?: () => void;\n /\n The HTML element ID where the portal should be mounted\n /\n portalId?: string;\n /\n Show dropdown header with user information\n /\n showDropdownHeader?: boolean;\n /\n Show user's display name next to avatar in the trigger button\n /\n showTriggerLabel?: boolean;\n /\n The user object containing profile information\n /\n user: any;\n}\n\n/\n BaseUserDropdown component displays a user avatar with a dropdown menu.\n * When clicked, it shows a popover with customizable menu items.\n * This component serves as the base for framework-specific implementations.\n /\nexport const BaseUserDropdown: FC<BaseUserDropdownProps> = ({\n fallback = null,\n className = '',\n user,\n isLoading = false,\n portalId = 'thunderid-user-dropdown',\n menuItems = [],\n showTriggerLabel = false,\n avatarSize = 32,\n manageProfileLabel = 'Manage Profile',\n onManageProfile,\n onSignOut,\n attributeMapping = {},\n}: BaseUserDropdownProps): ReactElement \| null => {\n const {theme, colorScheme} = useTheme();\n const styles: Record<string, string> = useStyles(theme, colorScheme);\n const [isOpen, setIsOpen] = useState(false);\n const [hoveredItemIndex, setHoveredItemIndex] = useState<number \| null>(null);\n\n const {refs, floatingStyles, context} = useFloating({\n middleware: [offset(5), flip({fallbackAxisSideDirection: 'end'}), shift({padding: 5})],\n onOpenChange: setIsOpen,\n open: isOpen,\n placement: 'bottom-end',\n whileElementsMounted: autoUpdate,\n });\n\n const click: any = useClick(context);\n const dismiss: any = useDismiss(context);\n const role: any = useRole(context);\n\n const {getReferenceProps, getFloatingProps} = useInteractions([click, dismiss, role]);\n\n const defaultAttributeMappings: Record<string, string \| string[]> = {\n email: ['emails'],\n firstName: ['name.givenName', 'given_name'],\n lastName: ['name.familyName', 'family_name'],\n picture: ['profile', 'profileUrl', 'picture', 'URL'],\n username: ['userName', 'username', 'user_name'],\n };\n\n const mergedMappings: Record<string, string \| string[]> = Object.fromEntries(\n Object.entries({...defaultAttributeMappings, ...attributeMapping}).filter(\n (entry): entry is [string, string \| string[]] => entry[1] !== undefined,\n ),\n );\n\n if (fallback && !user && !isLoading) {\n return fallback;\n }\n\n const handleMenuItemClick = (item: MenuItem): void => {\n if (item.onClick) {\n item.onClick();\n }\n setIsOpen(false);\n };\n\n const defaultMenuItems: MenuItem[] = [];\n\n if (onManageProfile) {\n defaultMenuItems.push({\n icon: <User width=\"16\" height=\"16\" />,\n label: manageProfileLabel,\n onClick: onManageProfile,\n });\n }\n\n if (onSignOut) {\n defaultMenuItems.push({\n icon: <LogOut width=\"16\" height=\"16\" />,\n label: 'Sign Out',\n onClick: onSignOut,\n });\n }\n\n const allMenuItems: MenuItem[] = [...menuItems];\n\n if (defaultMenuItems.length > 0) {\n if (menuItems.length > 0) {\n allMenuItems.push({label: '', onClick: undefined});\n }\n\n allMenuItems.push(...defaultMenuItems);\n }\n\n return (\n <div className={cx(withVendorCSSClassPrefix('user-dropdown'), className)}>\n <Button\n ref={refs.setReference}\n className={cx(withVendorCSSClassPrefix('user-dropdown__trigger'), styles['trigger'])}\n color=\"tertiary\"\n variant=\"text\"\n size=\"medium\"\n data-testid=\"thunderid-user-dropdown-trigger\"\n startIcon={\n <Avatar\n imageUrl={getMappedUserProfileValue('picture', mergedMappings, user)}\n name={getDisplayName(mergedMappings, user)}\n size={avatarSize}\n alt={`${getDisplayName(mergedMappings, user)}'s avatar`}\n />\n }\n {...getReferenceProps()}\n >\n {showTriggerLabel && (\n <Typography\n variant=\"body2\"\n className={cx(withVendorCSSClassPrefix('user-dropdown__trigger-label'), styles['userName'])}\n >\n {getDisplayName(mergedMappings, user)}\n </Typography>\n )}\n </Button>\n\n {isOpen && (\n <FloatingPortal id={portalId}>\n <FloatingFocusManager context={context} modal={false} initialFocus={-1}>\n <div\n ref={refs.setFloating}\n className={cx(\n withVendorCSSClassPrefix('user-dropdown__content'),\n styles['dropdownContent'],\n // Floating UI recomputes the position on every render, so this class is generated\n // fresh each time rather than memoized - Emotion still injects it into the shared,\n // nonce-tagged `<style>` element, so no inline `style` attribute is needed.\n css({\n ...floatingStyles,\n // Floating UI doesn't set a z-index by default, so we set a high value to ensure the dropdown appears above other elements.\n // https://floating-ui.com/docs/misc#z-index-stacking\n zIndex: 9999,\n }),\n )}\n {...getFloatingProps()}\n >\n <div className={cx(withVendorCSSClassPrefix('user-dropdown__header'), styles['dropdownHeader'])}>\n <Avatar\n imageUrl={getMappedUserProfileValue('picture', mergedMappings, user)}\n name={getDisplayName(mergedMappings, user)}\n size={avatarSize 1.25}\n alt={`${getDisplayName(mergedMappings, user)}'s avatar`}\n />\n <div className={cx(withVendorCSSClassPrefix('user-dropdown__header-info'), styles['headerInfo'])}>\n <Typography\n noWrap\n className={withVendorCSSClassPrefix('user-dropdown__header-name')}\n variant=\"body1\"\n fontWeight=\"medium\"\n >\n {getDisplayName(mergedMappings, user)}\n </Typography>\n <Typography\n noWrap\n className={withVendorCSSClassPrefix('user-dropdown__header-email')}\n variant=\"caption\"\n color=\"secondary\"\n >\n {getMappedUserProfileValue('username', mergedMappings, user) \|\|\n getMappedUserProfileValue('email', mergedMappings, user)}\n </Typography>\n </div>\n </div>\n <div className={cx(withVendorCSSClassPrefix('user-dropdown__menu'), styles['dropdownMenu'])}>\n {allMenuItems.map((item: any, index: number) => (\n <div key={index}>\n {((): ReactElement => {\n if (item.label === '') {\n return (\n <div\n className={cx(withVendorCSSClassPrefix('user-dropdown__menu-divider'), styles['divider'])}\n />\n );\n }\n if (item.href) {\n return (\n <a\n href={item.href}\n className={cx(\n withVendorCSSClassPrefix('user-dropdown__menu-item'),\n styles['menuItemAnchor'],\n hoveredItemIndex === index && styles['menuItemHighlighted'],\n )}\n onMouseEnter={(): void => setHoveredItemIndex(index)}\n onMouseLeave={(): void => setHoveredItemIndex(null)}\n onFocus={(): void => setHoveredItemIndex(index)}\n onBlur={(): void => setHoveredItemIndex(null)}\n >\n {item.icon}\n <span>{item.label}</span>\n </a>\n );\n }\n return (\n <Button\n onClick={(): void => handleMenuItemClick(item)}\n className={cx(\n withVendorCSSClassPrefix('user-dropdown__menu-item'),\n styles['menuItem'],\n hoveredItemIndex === index && styles['menuItemHighlighted'],\n )}\n color=\"tertiary\"\n variant=\"text\"\n size=\"small\"\n startIcon={item.icon}\n onMouseEnter={(): void => setHoveredItemIndex(index)}\n onMouseLeave={(): void => setHoveredItemIndex(null)}\n >\n {item.label}\n </Button>\n );\n })()}\n </div>\n ))}\n </div>\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n )}\n </div>\n );\n};\n\nexport default BaseUserDropdown;\n"],"mappings":"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"}

package/dist/cjs/components/presentation/UserDropdown/UserDropdown.cjs CHANGED Viewed

@@ -54,10 +54,14 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 * />
 * ```
 */
-const UserDropdown = ({ children, renderTrigger, renderDropdown, onSignOut,...rest }) => {
+const UserDropdown = ({ children, renderTrigger, renderDropdown, onManageProfile: onManageProfileOverride, onSignOut,...rest }) => {
 	const { user, isLoading, signOut, meta } = require_useThunderID.default();
 	const [isProfileOpen, setIsProfileOpen] = (0, react.useState)(false);
 	const handleManageProfile = () => {
+		if (onManageProfileOverride) {
+			onManageProfileOverride();
+			return;
+		}
 		setIsProfileOpen(true);
 	};
 	const handleSignOut = () => {
@@ -76,7 +80,7 @@ const UserDropdown = ({ children, renderTrigger, renderDropdown, onSignOut,...re
 		signOut: handleSignOut,
 		user
 	};
-	if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [children(renderProps), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UserProfile.default, {
+	if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [children(renderProps), !onManageProfileOverride && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UserProfile.default, {
 		mode: "popup",
 		open: isProfileOpen,
 		onOpenChange: setIsProfileOpen
@@ -87,7 +91,7 @@ const UserDropdown = ({ children, renderTrigger, renderDropdown, onSignOut,...re
 		onManageProfile: handleManageProfile,
 		onSignOut: handleSignOut,
 		...rest
-	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UserProfile.default, {
+	}), !onManageProfileOverride && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UserProfile.default, {
 		mode: "popup",
 		open: isProfileOpen,
 		onOpenChange: setIsProfileOpen
@@ -98,7 +102,7 @@ const UserDropdown = ({ children, renderTrigger, renderDropdown, onSignOut,...re
 		onManageProfile: handleManageProfile,
 		onSignOut: handleSignOut,
 		...rest
-	}), isProfileOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UserProfile.default, {
+	}), !onManageProfileOverride && isProfileOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UserProfile.default, {
 		mode: "popup",
 		open: isProfileOpen,
 		onOpenChange: setIsProfileOpen

package/dist/cjs/components/presentation/UserDropdown/UserDropdown.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserDropdown.cjs","names":["UserDropdown: FC<UserDropdownProps>","useThunderID","renderProps: UserDropdownRenderProps","UserProfile","BaseUserDropdownComponent"],"sources":["../../../../../src/components/presentation/UserDropdown/UserDropdown.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {FlowMetadataResponse} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useState} from 'react';\nimport {BaseUserDropdown as BaseUserDropdownComponent, BaseUserDropdownProps} from './BaseUserDropdown';\nimport useThunderID from '../../../contexts/ThunderID/useThunderID';\nimport UserProfile from '../UserProfile/UserProfile';\n\n/*\n Render props data passed to the children function\n /\nexport interface UserDropdownRenderProps {\n /* Function to close the profile dialog /\n closeProfile: () => void;\n /* Whether user data is currently loading /\n isLoading: boolean;\n /* Whether the profile dialog is currently open /\n isProfileOpen: boolean;\n /* Flow metadata returned by the platform (v2 only). `null` while loading or unavailable. /\n meta: FlowMetadataResponse \| null;\n /* Function to open the user profile dialog /\n openProfile: () => void;\n /* Function to sign out the user /\n signOut: () => void;\n /* The authenticated user object /\n user: any;\n}\n\n/\n Props for the UserDropdown component.\n * Extends BaseUserDropdownProps but excludes user, onManageProfile, and onSignOut since they're handled internally\n /\nexport type UserDropdownProps = Omit<BaseUserDropdownProps, 'user' \| 'onManageProfile'> & {\n /\n Render prop function that receives user state and actions.\n * When provided, this completely replaces the default dropdown rendering.\n /\n children?: (props: UserDropdownRenderProps) => ReactNode;\n /\n Custom render function for the dropdown content.\n * When provided, this replaces just the dropdown content while keeping the trigger.\n /\n renderDropdown?: (props: UserDropdownRenderProps) => ReactNode;\n /\n Custom render function for the trigger button.\n * When provided, this replaces just the trigger button while keeping the dropdown.\n /\n renderTrigger?: (props: UserDropdownRenderProps) => ReactNode;\n};\n\n/\n UserDropdown component displays a user avatar with a dropdown menu.\n * When clicked, it shows a popover with customizable menu items.\n * This component is the React-specific implementation that uses the BaseUserDropdown\n * and automatically retrieves the user data from ThunderID context.\n \n Supports render props for complete customization of the dropdown appearance and behavior.\n \n @example\n * ```tsx\n * // Basic usage - will use user from ThunderID context\n * <UserDropdown menuItems={[\n * { label: 'Profile', onClick: () => {} },\n * { label: 'Settings', href: '/settings' },\n * { label: 'Sign Out', onClick: () => {} }\n * ]} />\n \n // With custom configuration\n * <UserDropdown\n * showTriggerLabel={true}\n * avatarSize={40}\n * fallback={<div>Please sign in</div>}\n * />\n \n // Using render props for complete customization\n * <UserDropdown>\n * {({ user, isLoading, openProfile, signOut }) => (\n * <div>\n * <button onClick={openProfile}>\n * {user?.name \|\| 'Loading...'}\n * </button>\n * <button onClick={signOut}>Logout</button>\n * </div>\n * )}\n * </UserDropdown>\n \n // Using partial render props\n * <UserDropdown\n * renderTrigger={({ user, openProfile }) => (\n * <button onClick={openProfile} className=\"custom-trigger\">\n * Welcome, {user?.name}!\n * </button>\n * )}\n * />\n * ```\n /\nconst UserDropdown: FC<UserDropdownProps> = ({\n children,\n renderTrigger,\n renderDropdown,\n onSignOut,\n ...rest\n}: UserDropdownProps): ReactElement => {\n const {user, isLoading, signOut, meta} = useThunderID();\n const [isProfileOpen, setIsProfileOpen] = useState(false);\n\n const handleManageProfile = (): void => {\n setIsProfileOpen(true);\n };\n\n const handleSignOut = (): void => {\n signOut();\n if (onSignOut) {\n onSignOut();\n }\n };\n\n const closeProfile = (): void => {\n setIsProfileOpen(false);\n };\n\n // Prepare render props data\n const renderProps: UserDropdownRenderProps = {\n closeProfile,\n isLoading: isLoading,\n isProfileOpen,\n meta,\n openProfile: handleManageProfile,\n signOut: handleSignOut,\n user,\n };\n\n // If children render prop is provided, use it for complete customization\n if (children) {\n return (\n <>\n {children(renderProps)}\n <UserProfile mode=\"popup\" open={isProfileOpen} onOpenChange={setIsProfileOpen} ~~/>\~~n </>\n );\n }\n\n // If partial render props are provided, customize specific parts\n if (renderTrigger \|\| renderDropdown) {\n // This would require significant changes to BaseUserDropdown to support partial customization\n // For now, we'll provide a simple implementation that shows how it could work\n return (\n <>\n {renderTrigger ? (\n renderTrigger(renderProps)\n ) : (\n <BaseUserDropdownComponent\n user={user}\n isLoading={isLoading}\n onManageProfile={handleManageProfile}\n onSignOut={handleSignOut}\n {...rest}\n />\n )}\n {/ Note: renderDropdown would need BaseUserDropdown modifications to implement properly */}\n <UserProfile mode=\"popup\" open={isProfileOpen} onOpenChange={setIsProfileOpen} ~~/>\~~n </>\n );\n }\n\n // Default behavior - use BaseUserDropdown as before\n return (\n <>\n <BaseUserDropdownComponent\n user={user}\n isLoading={isLoading}\n onManageProfile={handleManageProfile}\n onSignOut={handleSignOut}\n {...rest}\n />\n {isProfileOpen && <UserProfile mode=\"popup\" open={isProfileOpen} onOpenChange={setIsProfileOpen} />}\n </>\n );\n};\n\nexport default UserDropdown;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAiGA~~,MAAMA,gBAAuC,EAC3C,UACA,eACA,gBACA,UACA,GAAG,WACkC;CACrC,MAAM,EAAC,MAAM,WAAW,SAAS,SAAQC,8BAAc;CACvD,MAAM,CAAC,eAAe,wCAA6B,MAAM;CAEzD,MAAM,4BAAkC;AACtC,mBAAiB,KAAK;;CAGxB,MAAM,sBAA4B;AAChC,WAAS;AACT,MAAI,UACF,YAAW;;CAIf,MAAM,qBAA2B;AAC/B,mBAAiB,MAAM;;CAIzB,MAAMC,cAAuC;EAC3C;EACW;EACX;EACA;EACA,aAAa;EACb,SAAS;EACT;EACD;AAGD,KAAI,SACF,QACE,qFACG,SAAS,YAAY,~~EACtB~~,2CAACC;EAAY,MAAK;EAAQ,MAAM;EAAe,cAAc;GAAoB,~~IAChF~~;AAKP,KAAI,iBAAiB,eAGnB,QACE,qFACG,gBACC,cAAc,YAAY,GAE1B,2CAACC;EACO;EACK;EACX,iBAAiB;EACjB,WAAW;EACX,GAAI;GACJ,~~EAGJ~~,2CAACD;EAAY,MAAK;EAAQ,MAAM;EAAe,cAAc;GAAoB,~~IAChF~~;AAKP,QACE,qFACE,2CAACC;EACO;EACK;EACX,iBAAiB;EACjB,WAAW;EACX,GAAI;GACJ,EACD,~~iBAAiB~~,2CAACD;EAAY,MAAK;EAAQ,MAAM;EAAe,cAAc;GAAoB,~~IAClG~~;;AAIP,2BAAe"}
1	+ {"version":3,"file":"UserDropdown.cjs","names":["UserDropdown: FC<UserDropdownProps>","useThunderID","renderProps: UserDropdownRenderProps","UserProfile","BaseUserDropdownComponent"],"sources":["../../../../../src/components/presentation/UserDropdown/UserDropdown.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {FlowMetadataResponse} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useState} from 'react';\nimport {BaseUserDropdown as BaseUserDropdownComponent, BaseUserDropdownProps} from './BaseUserDropdown';\nimport useThunderID from '../../../contexts/ThunderID/useThunderID';\nimport UserProfile from '../UserProfile/UserProfile';\n\n/*\n Render props data passed to the children function\n /\nexport interface UserDropdownRenderProps {\n /* Function to close the profile dialog /\n closeProfile: () => void;\n /* Whether user data is currently loading /\n isLoading: boolean;\n /* Whether the profile dialog is currently open /\n isProfileOpen: boolean;\n /* Flow metadata returned by the platform (v2 only). `null` while loading or unavailable. /\n meta: FlowMetadataResponse \| null;\n /* Function to open the user profile dialog /\n openProfile: () => void;\n /* Function to sign out the user /\n signOut: () => void;\n /* The authenticated user object /\n user: any;\n}\n\n/\n Props for the UserDropdown component.\n * Extends BaseUserDropdownProps but excludes user, onManageProfile, and onSignOut since they're handled internally\n /\nexport type UserDropdownProps = Omit<BaseUserDropdownProps, 'user' \| 'onManageProfile'> & {\n /\n Render prop function that receives user state and actions.\n * When provided, this completely replaces the default dropdown rendering.\n /\n children?: (props: UserDropdownRenderProps) => ReactNode;\n /\n Called instead of opening the built-in \"Manage Profile\" popup when the \"Manage Profile\"\n * menu item (see `manageProfileLabel`) is clicked. Use this when the app has its own\n * profile/account page it wants to navigate to instead, for example with a router's\n * `navigate()`.\n \n @example\n * ```tsx\n * <UserDropdown manageProfileLabel=\"Manage Account\" onManageProfile={() => navigate('/account')} />\n * ```\n /\n onManageProfile?: () => void;\n /\n Custom render function for the dropdown content.\n * When provided, this replaces just the dropdown content while keeping the trigger.\n /\n renderDropdown?: (props: UserDropdownRenderProps) => ReactNode;\n /\n Custom render function for the trigger button.\n * When provided, this replaces just the trigger button while keeping the dropdown.\n /\n renderTrigger?: (props: UserDropdownRenderProps) => ReactNode;\n};\n\n/\n UserDropdown component displays a user avatar with a dropdown menu.\n * When clicked, it shows a popover with customizable menu items.\n * This component is the React-specific implementation that uses the BaseUserDropdown\n * and automatically retrieves the user data from ThunderID context.\n \n Supports render props for complete customization of the dropdown appearance and behavior.\n \n @example\n * ```tsx\n * // Basic usage - will use user from ThunderID context\n * <UserDropdown menuItems={[\n * { label: 'Profile', onClick: () => {} },\n * { label: 'Settings', href: '/settings' },\n * { label: 'Sign Out', onClick: () => {} }\n * ]} />\n \n // With custom configuration\n * <UserDropdown\n * showTriggerLabel={true}\n * avatarSize={40}\n * fallback={<div>Please sign in</div>}\n * />\n \n // Using render props for complete customization\n * <UserDropdown>\n * {({ user, isLoading, openProfile, signOut }) => (\n * <div>\n * <button onClick={openProfile}>\n * {user?.name \|\| 'Loading...'}\n * </button>\n * <button onClick={signOut}>Logout</button>\n * </div>\n * )}\n * </UserDropdown>\n \n // Using partial render props\n * <UserDropdown\n * renderTrigger={({ user, openProfile }) => (\n * <button onClick={openProfile} className=\"custom-trigger\">\n * Welcome, {user?.name}!\n * </button>\n * )}\n * />\n * ```\n /\nconst UserDropdown: FC<UserDropdownProps> = ({\n children,\n renderTrigger,\n renderDropdown,\n onManageProfile: onManageProfileOverride,\n onSignOut,\n ...rest\n}: UserDropdownProps): ReactElement => {\n const {user, isLoading, signOut, meta} = useThunderID();\n const [isProfileOpen, setIsProfileOpen] = useState(false);\n\n const handleManageProfile = (): void => {\n if (onManageProfileOverride) {\n onManageProfileOverride();\n return;\n }\n setIsProfileOpen(true);\n };\n\n const handleSignOut = (): void => {\n signOut();\n if (onSignOut) {\n onSignOut();\n }\n };\n\n const closeProfile = (): void => {\n setIsProfileOpen(false);\n };\n\n // Prepare render props data\n const renderProps: UserDropdownRenderProps = {\n closeProfile,\n isLoading: isLoading,\n isProfileOpen,\n meta,\n openProfile: handleManageProfile,\n signOut: handleSignOut,\n user,\n };\n\n // If children render prop is provided, use it for complete customization\n if (children) {\n return (\n <>\n {children(renderProps)}\n {!onManageProfileOverride && <UserProfile mode=\"popup\" open={isProfileOpen} onOpenChange={setIsProfileOpen} />}\n </>\n );\n }\n\n // If partial render props are provided, customize specific parts\n if (renderTrigger \|\| renderDropdown) {\n // This would require significant changes to BaseUserDropdown to support partial customization\n // For now, we'll provide a simple implementation that shows how it could work\n return (\n <>\n {renderTrigger ? (\n renderTrigger(renderProps)\n ) : (\n <BaseUserDropdownComponent\n user={user}\n isLoading={isLoading}\n onManageProfile={handleManageProfile}\n onSignOut={handleSignOut}\n {...rest}\n />\n )}\n {/ Note: renderDropdown would need BaseUserDropdown modifications to implement properly */}\n {!onManageProfileOverride && <UserProfile mode=\"popup\" open={isProfileOpen} onOpenChange={setIsProfileOpen} />}\n </>\n );\n }\n\n // Default behavior - use BaseUserDropdown as before\n return (\n <>\n <BaseUserDropdownComponent\n user={user}\n isLoading={isLoading}\n onManageProfile={handleManageProfile}\n onSignOut={handleSignOut}\n {...rest}\n />\n {!onManageProfileOverride && isProfileOpen && (\n <UserProfile mode=\"popup\" open={isProfileOpen} onOpenChange={setIsProfileOpen} />\n )}\n </>\n );\n};\n\nexport default UserDropdown;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6GA,MAAMA,gBAAuC,EAC3C,UACA,eACA,gBACA,iBAAiB,yBACjB,UACA,GAAG,WACkC;CACrC,MAAM,EAAC,MAAM,WAAW,SAAS,SAAQC,8BAAc;CACvD,MAAM,CAAC,eAAe,wCAA6B,MAAM;CAEzD,MAAM,4BAAkC;AACtC,MAAI,yBAAyB;AAC3B,4BAAyB;AACzB;;AAEF,mBAAiB,KAAK;;CAGxB,MAAM,sBAA4B;AAChC,WAAS;AACT,MAAI,UACF,YAAW;;CAIf,MAAM,qBAA2B;AAC/B,mBAAiB,MAAM;;CAIzB,MAAMC,cAAuC;EAC3C;EACW;EACX;EACA;EACA,aAAa;EACb,SAAS;EACT;EACD;AAGD,KAAI,SACF,QACE,qFACG,SAAS,YAAY,EACrB,CAAC,2BAA2B,2CAACC;EAAY,MAAK;EAAQ,MAAM;EAAe,cAAc;GAAoB,IAC7G;AAKP,KAAI,iBAAiB,eAGnB,QACE,qFACG,gBACC,cAAc,YAAY,GAE1B,2CAACC;EACO;EACK;EACX,iBAAiB;EACjB,WAAW;EACX,GAAI;GACJ,EAGH,CAAC,2BAA2B,2CAACD;EAAY,MAAK;EAAQ,MAAM;EAAe,cAAc;GAAoB,IAC7G;AAKP,QACE,qFACE,2CAACC;EACO;EACK;EACX,iBAAiB;EACjB,WAAW;EACX,GAAI;GACJ,EACD,CAAC,2BAA2B,iBAC3B,2CAACD;EAAY,MAAK;EAAQ,MAAM;EAAe,cAAc;GAAoB,IAElF;;AAIP,2BAAe"}

package/dist/cjs/components/presentation/UserProfile/BaseUserProfile.styles.cjs CHANGED Viewed

@@ -33,6 +33,7 @@ const useStyles = (theme, colorScheme) => {
     display: flex;
     align-items: center;
     gap: ${theme.vars.spacing.unit};
+    min-width: 0;
   `;
 	const fieldActions = require_emotion.css`
     display: flex;
@@ -140,6 +141,7 @@ const useStyles = (theme, colorScheme) => {
       align-items: center;
       gap: ${theme.vars.spacing.unit};
       overflow: hidden;
+      min-width: 0;
       min-height: 28px;
       line-height: 28px;
       word-break: break-word;

package/dist/cjs/components/presentation/UserProfile/BaseUserProfile.styles.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseUserProfile.styles.cjs","names":["valuePlaceholder: string","editButton: string","fieldInner: string","fieldActions: string","complexTextarea: string","objectKey: string","objectValue: string","root: string","card: string","header: string","profileInfo: string","name: string","profileSummary: string","sectionRow: string","sectionLabel: string","sectionValue: string","infoContainer: string","info: string","field: string","lastField: string","label: string","value: string","popup: string"],"sources":["../../../../../src/components/presentation/UserProfile/BaseUserProfile.styles.ts"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Theme, withVendorCSSClassPrefix} from '@thunderid/browser';\nimport {useMemo} from 'react';\nimport {css} from '../../../styles/emotion';\n\n/*\n Creates styles for the BaseUserProfile component\n * @param theme - The theme object containing design tokens\n * @param colorScheme - The current color scheme (used for memoization)\n * @returns Object containing CSS class names for component styling\n /\nconst useStyles = (theme: Theme, colorScheme: string): Record<string, string> => {\n const valuePlaceholder: string = css`\n font-style: italic;\n opacity: 0.7;\n `;\n\n const editButton: string = css`\n font-style: italic;\n text-decoration: underline;\n opacity: 0.7;\n padding: 0;\n min-height: auto;\n\n &:hover:not(:disabled) {\n background-color: transparent;\n }\n `;\n\n const fieldInner: string = css`\n flex: 1;\n display: flex;\n align-items: center;\n gap: ${theme.vars.spacing.unit};\n `;\n\n const fieldActions: string = css`\n display: flex;\n gap: calc(${theme.vars.spacing.unit} / 2);\n align-items: center;\n margin-inline-start: calc(${theme.vars.spacing.unit} 4);\n `;\n\n const complexTextarea: string = css`\n min-height: 60px;\n width: 100%;\n padding: 8px;\n border: 1px solid ${theme.vars.colors.border};\n border-radius: ${theme.vars.borderRadius.small};\n resize: vertical;\n `;\n\n const objectKey: string = css`\n padding: ${theme.vars.spacing.unit};\n vertical-align: top;\n `;\n\n const objectValue: string = css`\n padding: ${theme.vars.spacing.unit};\n vertical-align: top;\n `;\n\n return useMemo(() => {\n const root: string = css`\n padding: calc(${theme.vars.spacing.unit} * 4);\n min-width: 600px;\n margin: 0 auto;\n font-family: ${theme.vars.typography.fontFamily};\n `;\n\n const card: string = css`\n background: ${theme.vars.colors.background.surface};\n border-radius: ${theme.vars.borderRadius.large};\n `;\n\n const header: string = css`\n display: flex;\n align-items: center;\n gap: calc(${theme.vars.spacing.unit} * 1.5);\n margin-bottom: calc(${theme.vars.spacing.unit} * 1.5);\n `;\n\n const profileInfo: string = css`\n flex: 1;\n `;\n\n const name: string = css`\n font-size: 1.5rem;\n font-weight: 600;\n margin: 0;\n color: ${theme.vars.colors.text.primary};\n `;\n\n const profileSummary: string = css`\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n `;\n\n const sectionRow: string = css`\n display: flex;\n align-items: center;\n padding: calc(${theme.vars.spacing.unit} * 1) 0;\n `;\n\n const sectionLabel: string = css`\n font-size: 0.875rem;\n font-weight: 600;\n color: ${theme.vars.colors.text.primary};\n width: 160px;\n flex-shrink: 0;\n `;\n\n const sectionValue: string = css`\n flex: 1;\n display: flex;\n align-items: center;\n gap: calc(${theme.vars.spacing.unit} * 1.5);\n font-size: 0.875rem;\n color: ${theme.vars.colors.text.primary};\n `;\n\n const infoContainer: string = css`\n display: flex;\n flex-direction: column;\n `;\n\n const info: string = css`\n padding: calc(${theme.vars.spacing.unit} * 1.5) 0;\n border-bottom: 1px solid ${theme.vars.colors.border};\n `;\n\n const field: string = css`\n display: flex;\n align-items: center;\n padding: calc(${theme.vars.spacing.unit} / 2) 0;\n min-height: 28px;\n `;\n\n const lastField: string = css`\n border-bottom: none;\n `;\n\n const label: string = css`\n font-size: 0.875rem;\n font-weight: 500;\n color: ${theme.vars.colors.text.secondary};\n width: 120px;\n flex-shrink: 0;\n line-height: 28px;\n text-align: start;\n `;\n\n const value: string = css`\n color: ${theme.vars.colors.text.primary};\n flex: 1;\n display: inline-block;\n align-items: center;\n gap: ${theme.vars.spacing.unit};\n overflow: hidden;\n min-height: 28px;\n line-height: 28px;\n word-break: break-word;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 350px;\n text-align: start;\n\n .${withVendorCSSClassPrefix('form-control')} {\n margin-bottom: 0;\n }\n\n input {\n margin: 0;\n }\n\n table {\n background-color: ${theme.vars.colors.background.surface};\n border-radius: ${theme.vars.borderRadius.medium};\n white-space: normal;\n }\n\n td {\n border-color: ${theme.vars.colors.border};\n }\n `;\n\n const popup: string = css`\n padding: calc(${theme.vars.spacing.unit} * 2);\n `;\n\n const alert: string = css`\n margin-bottom: calc(${theme.vars.spacing.unit} * 3);\n `;\n\n return {\n alert,\n card,\n complexTextarea,\n editButton,\n field,\n fieldActions,\n fieldInner,\n header,\n info,\n infoContainer,\n label,\n lastField,\n name,\n objectKey,\n objectValue,\n popup,\n profileInfo,\n profileSummary,\n root,\n sectionLabel,\n sectionRow,\n sectionValue,\n value,\n valuePlaceholder,\n };\n }, [\n theme.vars.colors.background.surface,\n theme.vars.colors.text.primary,\n theme.vars.colors.text.secondary,\n theme.vars.colors.border,\n theme.vars.borderRadius.large,\n theme.vars.borderRadius.medium,\n theme.vars.spacing.unit,\n theme.vars.typography.fontFamily,\n colorScheme,\n ]);\n};\n\nexport default useStyles;\n"],"mappings":";;;;;;;;;;;;;;AAaA,MAAM,aAAa,OAAc,gBAAgD;CAC/E,MAAMA,mBAA2B,mBAAG;;;;CAKpC,MAAMC,aAAqB,mBAAG;;;;;;;;;;;CAY9B,MAAMC,aAAqB,mBAAG;;;;WAIrB,MAAM,KAAK,QAAQ,KAAK~~;;CAGjC~~,MAAMC,eAAuB,mBAAG;;gBAElB,MAAM,KAAK,QAAQ,KAAK;;gCAER,MAAM,KAAK,QAAQ,KAAK;;CAGtD,MAAMC,kBAA0B,mBAAG;;;;wBAIb,MAAM,KAAK,OAAO,OAAO;qBAC5B,MAAM,KAAK,aAAa,MAAM;;;CAIjD,MAAMC,YAAoB,mBAAG;eAChB,MAAM,KAAK,QAAQ,KAAK;;;CAIrC,MAAMC,cAAsB,mBAAG;eAClB,MAAM,KAAK,QAAQ,KAAK;;;AAIrC,iCAAqB;EACnB,MAAMC,OAAe,mBAAG;sBACN,MAAM,KAAK,QAAQ,KAAK;;;qBAGzB,MAAM,KAAK,WAAW,WAAW;;EAGlD,MAAMC,OAAe,mBAAG;oBACR,MAAM,KAAK,OAAO,WAAW,QAAQ;uBAClC,MAAM,KAAK,aAAa,MAAM;;EAGjD,MAAMC,SAAiB,mBAAG;;;kBAGZ,MAAM,KAAK,QAAQ,KAAK;4BACd,MAAM,KAAK,QAAQ,KAAK;;EAGhD,MAAMC,cAAsB,mBAAG;;;EAI/B,MAAMC,OAAe,mBAAG;;;;eAIb,MAAM,KAAK,OAAO,KAAK,QAAQ;;EAG1C,MAAMC,iBAAyB,mBAAG;;;;;EAMlC,MAAMC,aAAqB,mBAAG;;;sBAGZ,MAAM,KAAK,QAAQ,KAAK;;EAG1C,MAAMC,eAAuB,mBAAG;;;eAGrB,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;EAK1C,MAAMC,eAAuB,mBAAG;;;;kBAIlB,MAAM,KAAK,QAAQ,KAAK;;eAE3B,MAAM,KAAK,OAAO,KAAK,QAAQ;;EAG1C,MAAMC,gBAAwB,mBAAG;;;;EAKjC,MAAMC,OAAe,mBAAG;sBACN,MAAM,KAAK,QAAQ,KAAK;iCACb,MAAM,KAAK,OAAO,OAAO;;EAGtD,MAAMC,QAAgB,mBAAG;;;sBAGP,MAAM,KAAK,QAAQ,KAAK;;;EAI1C,MAAMC,YAAoB,mBAAG;;;EAI7B,MAAMC,QAAgB,mBAAG;;;eAGd,MAAM,KAAK,OAAO,KAAK,UAAU;;;;;;EAO5C,MAAMC,QAAgB,mBAAG;eACd,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;aAIjC,MAAM,KAAK,QAAQ,KAAK~~;;;;;;;;;;2DAUH~~,eAAe,CAAC;;;;;;;;;4BAStB,MAAM,KAAK,OAAO,WAAW,QAAQ;yBACxC,MAAM,KAAK,aAAa,OAAO;;;;;wBAKhC,MAAM,KAAK,OAAO,OAAO;;;EAI7C,MAAMC,QAAgB,mBAAG;sBACP,MAAM,KAAK,QAAQ,KAAK;;AAO1C,SAAO;GACL,OALoB,mBAAG;4BACD,MAAM,KAAK,QAAQ,KAAK;;GAK9C;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;IACA;EACD,MAAM,KAAK,OAAO,WAAW;EAC7B,MAAM,KAAK,OAAO,KAAK;EACvB,MAAM,KAAK,OAAO,KAAK;EACvB,MAAM,KAAK,OAAO;EAClB,MAAM,KAAK,aAAa;EACxB,MAAM,KAAK,aAAa;EACxB,MAAM,KAAK,QAAQ;EACnB,MAAM,KAAK,WAAW;EACtB;EACD,CAAC;;AAGJ,qCAAe"}
1	+ {"version":3,"file":"BaseUserProfile.styles.cjs","names":["valuePlaceholder: string","editButton: string","fieldInner: string","fieldActions: string","complexTextarea: string","objectKey: string","objectValue: string","root: string","card: string","header: string","profileInfo: string","name: string","profileSummary: string","sectionRow: string","sectionLabel: string","sectionValue: string","infoContainer: string","info: string","field: string","lastField: string","label: string","value: string","popup: string"],"sources":["../../../../../src/components/presentation/UserProfile/BaseUserProfile.styles.ts"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Theme, withVendorCSSClassPrefix} from '@thunderid/browser';\nimport {useMemo} from 'react';\nimport {css} from '../../../styles/emotion';\n\n/*\n Creates styles for the BaseUserProfile component\n * @param theme - The theme object containing design tokens\n * @param colorScheme - The current color scheme (used for memoization)\n * @returns Object containing CSS class names for component styling\n /\nconst useStyles = (theme: Theme, colorScheme: string): Record<string, string> => {\n const valuePlaceholder: string = css`\n font-style: italic;\n opacity: 0.7;\n `;\n\n const editButton: string = css`\n font-style: italic;\n text-decoration: underline;\n opacity: 0.7;\n padding: 0;\n min-height: auto;\n\n &:hover:not(:disabled) {\n background-color: transparent;\n }\n `;\n\n const fieldInner: string = css`\n flex: 1;\n display: flex;\n align-items: center;\n gap: ${theme.vars.spacing.unit};\n min-width: 0;\n `;\n\n const fieldActions: string = css`\n display: flex;\n gap: calc(${theme.vars.spacing.unit} / 2);\n align-items: center;\n margin-inline-start: calc(${theme.vars.spacing.unit} 4);\n `;\n\n const complexTextarea: string = css`\n min-height: 60px;\n width: 100%;\n padding: 8px;\n border: 1px solid ${theme.vars.colors.border};\n border-radius: ${theme.vars.borderRadius.small};\n resize: vertical;\n `;\n\n const objectKey: string = css`\n padding: ${theme.vars.spacing.unit};\n vertical-align: top;\n `;\n\n const objectValue: string = css`\n padding: ${theme.vars.spacing.unit};\n vertical-align: top;\n `;\n\n return useMemo(() => {\n const root: string = css`\n padding: calc(${theme.vars.spacing.unit} * 4);\n min-width: 600px;\n margin: 0 auto;\n font-family: ${theme.vars.typography.fontFamily};\n `;\n\n const card: string = css`\n background: ${theme.vars.colors.background.surface};\n border-radius: ${theme.vars.borderRadius.large};\n `;\n\n const header: string = css`\n display: flex;\n align-items: center;\n gap: calc(${theme.vars.spacing.unit} * 1.5);\n margin-bottom: calc(${theme.vars.spacing.unit} * 1.5);\n `;\n\n const profileInfo: string = css`\n flex: 1;\n `;\n\n const name: string = css`\n font-size: 1.5rem;\n font-weight: 600;\n margin: 0;\n color: ${theme.vars.colors.text.primary};\n `;\n\n const profileSummary: string = css`\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n `;\n\n const sectionRow: string = css`\n display: flex;\n align-items: center;\n padding: calc(${theme.vars.spacing.unit} * 1) 0;\n `;\n\n const sectionLabel: string = css`\n font-size: 0.875rem;\n font-weight: 600;\n color: ${theme.vars.colors.text.primary};\n width: 160px;\n flex-shrink: 0;\n `;\n\n const sectionValue: string = css`\n flex: 1;\n display: flex;\n align-items: center;\n gap: calc(${theme.vars.spacing.unit} * 1.5);\n font-size: 0.875rem;\n color: ${theme.vars.colors.text.primary};\n `;\n\n const infoContainer: string = css`\n display: flex;\n flex-direction: column;\n `;\n\n const info: string = css`\n padding: calc(${theme.vars.spacing.unit} * 1.5) 0;\n border-bottom: 1px solid ${theme.vars.colors.border};\n `;\n\n const field: string = css`\n display: flex;\n align-items: center;\n padding: calc(${theme.vars.spacing.unit} / 2) 0;\n min-height: 28px;\n `;\n\n const lastField: string = css`\n border-bottom: none;\n `;\n\n const label: string = css`\n font-size: 0.875rem;\n font-weight: 500;\n color: ${theme.vars.colors.text.secondary};\n width: 120px;\n flex-shrink: 0;\n line-height: 28px;\n text-align: start;\n `;\n\n const value: string = css`\n color: ${theme.vars.colors.text.primary};\n flex: 1;\n display: inline-block;\n align-items: center;\n gap: ${theme.vars.spacing.unit};\n overflow: hidden;\n min-width: 0;\n min-height: 28px;\n line-height: 28px;\n word-break: break-word;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 350px;\n text-align: start;\n\n .${withVendorCSSClassPrefix('form-control')} {\n margin-bottom: 0;\n }\n\n input {\n margin: 0;\n }\n\n table {\n background-color: ${theme.vars.colors.background.surface};\n border-radius: ${theme.vars.borderRadius.medium};\n white-space: normal;\n }\n\n td {\n border-color: ${theme.vars.colors.border};\n }\n `;\n\n const popup: string = css`\n padding: calc(${theme.vars.spacing.unit} * 2);\n `;\n\n const alert: string = css`\n margin-bottom: calc(${theme.vars.spacing.unit} * 3);\n `;\n\n return {\n alert,\n card,\n complexTextarea,\n editButton,\n field,\n fieldActions,\n fieldInner,\n header,\n info,\n infoContainer,\n label,\n lastField,\n name,\n objectKey,\n objectValue,\n popup,\n profileInfo,\n profileSummary,\n root,\n sectionLabel,\n sectionRow,\n sectionValue,\n value,\n valuePlaceholder,\n };\n }, [\n theme.vars.colors.background.surface,\n theme.vars.colors.text.primary,\n theme.vars.colors.text.secondary,\n theme.vars.colors.border,\n theme.vars.borderRadius.large,\n theme.vars.borderRadius.medium,\n theme.vars.spacing.unit,\n theme.vars.typography.fontFamily,\n colorScheme,\n ]);\n};\n\nexport default useStyles;\n"],"mappings":";;;;;;;;;;;;;;AAaA,MAAM,aAAa,OAAc,gBAAgD;CAC/E,MAAMA,mBAA2B,mBAAG;;;;CAKpC,MAAMC,aAAqB,mBAAG;;;;;;;;;;;CAY9B,MAAMC,aAAqB,mBAAG;;;;WAIrB,MAAM,KAAK,QAAQ,KAAK;;;CAIjC,MAAMC,eAAuB,mBAAG;;gBAElB,MAAM,KAAK,QAAQ,KAAK;;gCAER,MAAM,KAAK,QAAQ,KAAK;;CAGtD,MAAMC,kBAA0B,mBAAG;;;;wBAIb,MAAM,KAAK,OAAO,OAAO;qBAC5B,MAAM,KAAK,aAAa,MAAM;;;CAIjD,MAAMC,YAAoB,mBAAG;eAChB,MAAM,KAAK,QAAQ,KAAK;;;CAIrC,MAAMC,cAAsB,mBAAG;eAClB,MAAM,KAAK,QAAQ,KAAK;;;AAIrC,iCAAqB;EACnB,MAAMC,OAAe,mBAAG;sBACN,MAAM,KAAK,QAAQ,KAAK;;;qBAGzB,MAAM,KAAK,WAAW,WAAW;;EAGlD,MAAMC,OAAe,mBAAG;oBACR,MAAM,KAAK,OAAO,WAAW,QAAQ;uBAClC,MAAM,KAAK,aAAa,MAAM;;EAGjD,MAAMC,SAAiB,mBAAG;;;kBAGZ,MAAM,KAAK,QAAQ,KAAK;4BACd,MAAM,KAAK,QAAQ,KAAK;;EAGhD,MAAMC,cAAsB,mBAAG;;;EAI/B,MAAMC,OAAe,mBAAG;;;;eAIb,MAAM,KAAK,OAAO,KAAK,QAAQ;;EAG1C,MAAMC,iBAAyB,mBAAG;;;;;EAMlC,MAAMC,aAAqB,mBAAG;;;sBAGZ,MAAM,KAAK,QAAQ,KAAK;;EAG1C,MAAMC,eAAuB,mBAAG;;;eAGrB,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;EAK1C,MAAMC,eAAuB,mBAAG;;;;kBAIlB,MAAM,KAAK,QAAQ,KAAK;;eAE3B,MAAM,KAAK,OAAO,KAAK,QAAQ;;EAG1C,MAAMC,gBAAwB,mBAAG;;;;EAKjC,MAAMC,OAAe,mBAAG;sBACN,MAAM,KAAK,QAAQ,KAAK;iCACb,MAAM,KAAK,OAAO,OAAO;;EAGtD,MAAMC,QAAgB,mBAAG;;;sBAGP,MAAM,KAAK,QAAQ,KAAK;;;EAI1C,MAAMC,YAAoB,mBAAG;;;EAI7B,MAAMC,QAAgB,mBAAG;;;eAGd,MAAM,KAAK,OAAO,KAAK,UAAU;;;;;;EAO5C,MAAMC,QAAgB,mBAAG;eACd,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;aAIjC,MAAM,KAAK,QAAQ,KAAK;;;;;;;;;;;2DAWH,eAAe,CAAC;;;;;;;;;4BAStB,MAAM,KAAK,OAAO,WAAW,QAAQ;yBACxC,MAAM,KAAK,aAAa,OAAO;;;;;wBAKhC,MAAM,KAAK,OAAO,OAAO;;;EAI7C,MAAMC,QAAgB,mBAAG;sBACP,MAAM,KAAK,QAAQ,KAAK;;AAO1C,SAAO;GACL,OALoB,mBAAG;4BACD,MAAM,KAAK,QAAQ,KAAK;;GAK9C;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;IACA;EACD,MAAM,KAAK,OAAO,WAAW;EAC7B,MAAM,KAAK,OAAO,KAAK;EACvB,MAAM,KAAK,OAAO,KAAK;EACvB,MAAM,KAAK,OAAO;EAClB,MAAM,KAAK,aAAa;EACxB,MAAM,KAAK,aAAa;EACxB,MAAM,KAAK,QAAQ;EACnB,MAAM,KAAK,WAAW;EACtB;EACD,CAAC;;AAGJ,qCAAe"}

package/dist/cjs/components/presentation/auth/AuthOptionFactory.cjs CHANGED Viewed

@@ -20,6 +20,7 @@ const require_FieldFactory = require('../../factories/FieldFactory.cjs');
 const require_CopyableText = require('../../primitives/CopyableText/CopyableText.cjs');
 const require_Divider = require('../../primitives/Divider/Divider.cjs');
 const require_flowIconRegistry = require('../../primitives/Icons/flowIconRegistry.cjs');
+const require_KeyValueList = require('../../primitives/KeyValueList/KeyValueList.cjs');
 const require_AffixedField = require('../../primitives/AffixedField/AffixedField.cjs');
 let __thunderid_browser = require("@thunderid/browser");
 __thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
@@ -547,6 +548,18 @@ const createAuthComponentFromFlow = (component, formValues, touchedFields, formE
 				value
 			}, key);
 		}
+		case __thunderid_browser.EmbeddedFlowComponentType.KeyValueList: {
+			const sourceKey = component.source;
+			const pairs = (0, __thunderid_browser.parseKeyValuePairs)(sourceKey && options.additionalData ? options.additionalData[sourceKey] : void 0).map((pair) => ({
+				...pair,
+				label: resolve(pair.label)
+			}));
+			if (pairs.length === 0) return null;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_KeyValueList.default, {
+				label: resolve(component.label) || void 0,
+				pairs
+			}, key);
+		}
 		default:
 			logger.warn(`Unsupported component type: ${component.type}. Skipping render.`);
 			return null;

package/dist/cjs/components/presentation/auth/AuthOptionFactory.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AuthOptionFactory.cjs","names":["logger: ReturnType<typeof createPackageComponentLogger>","richTextClassCache: string \| undefined","authOptionIconClassCache: string \| undefined","css","EmbeddedFlowComponentType","FieldType","providerId: any","providerMatches: any","theme: any","customRenderers: ComponentRendererMap","key: string \| number","customRenderer: ComponentRenderer \| undefined","identifier: string","value: string","error: string","fieldType: string","hasPrefixes: boolean","hasPostfix: boolean","prefixStateKey: string","affixPrefixKey","postfixStateKey: string","affixPostfixKey","defaultPrefixValue: string","selectedPrefix: string","AffixedField","cx","createField","reportedLength: number","otpLength: number \| undefined","numericOnly: boolean","actionId: string","eventType: string","buttonText: string","componentVariant: string","shouldSkipValidation: boolean","EmbeddedFlowEventType","buttonType: HTMLButtonElement['type']","formData: Record<string, any>","consentPrompt: ConsentPromptData \| undefined","isDeny: boolean","decisions: ConsentDecisions","ConsentConstants","getConsentOptionalKey","socialButtonClassName: string","GoogleButton","GitHubButton","FacebookButton","MicrosoftButton","LinkedInButton","SignInWithEthereumButton","SmsOtpButton","startIconEl: ReactElement \| null","endIconEl: ReactElement \| null","Button","variant: any","textAlignClass: string","Typography","Divider","selectOptions: any","Select","DatePicker","formClass: string","blockComponents: any","richTextAction: EmbeddedFlowComponentAction \| undefined","syntheticAction: EmbeddedFlowComponent","formData: Record<string, string>","handleRichTextClick: React.MouseEventHandler<HTMLDivElement> \| undefined","anchor: HTMLAnchorElement \| null","handleRichTextKeyDown: React.KeyboardEventHandler<HTMLDivElement> \| undefined","DOMPurify","explicitHeight: string","explicitWidth: string","ImageComponent","iconName: string","IconComponent: any","flowIconRegistry","direction: string","gap: number","align: string","justify: string","rawItems: string \| number \| undefined","parsedItems: number","items: number \| null","isColumn: boolean","gridJustify: string","track: string","stackClass: string","stackChildren: (ReactElement \| null)[]","consentPromptRawData: ConsentPromptData \| string \| undefined","Consent","textTemplate: string","timeoutMs: number","FlowTimer","sourceKey: string \| undefined","CopyableText"],"sources":["../../../../../src/components/presentation/auth/AuthOptionFactory.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport type {CSSInterpolation} from '@emotion/css/create-instance';\nimport {\n ConsentConstants,\n FieldType,\n FlowMetadataResponse,\n EmbeddedFlowComponent,\n EmbeddedFlowComponentAction,\n EmbeddedFlowComponentType,\n EmbeddedFlowTextVariant,\n EmbeddedFlowEventType,\n createPackageComponentLogger,\n resolveFlowTemplateLiterals,\n resolveEmojiUrisInHtml,\n ConsentPurposeData,\n ConsentPromptData,\n ConsentDecisions,\n ConsentPurposeDecision,\n ConsentAttributeElement,\n OrganizationUnitListResponse,\n PrefixOption,\n} from '@thunderid/browser';\nimport DOMPurify from 'dompurify';\nimport {ChangeEvent, cloneElement, CSSProperties, FormEvent, ReactElement} from 'react';\nimport {\n ComponentRenderer,\n ComponentRenderContext,\n ComponentRendererMap,\n} from '../../../contexts/ComponentRenderer/ComponentRendererContext';\nimport {UseTranslation} from '../../../hooks/useTranslation';\nimport {css, cx} from '../../../styles/emotion';\nimport Consent from '../../adapters/Consent';\nimport {getConsentOptionalKey} from '../../adapters/ConsentCheckboxList';\nimport FacebookButton from '../../adapters/FacebookButton';\nimport FlowTimer from '../../adapters/FlowTimer';\nimport GitHubButton from '../../adapters/GitHubButton';\nimport GoogleButton from '../../adapters/GoogleButton';\nimport ImageComponent from '../../adapters/ImageComponent';\nimport LinkedInButton from '../../adapters/LinkedInButton';\nimport MicrosoftButton from '../../adapters/MicrosoftButton';\nimport SignInWithEthereumButton from '../../adapters/SignInWithEthereumButton';\nimport SmsOtpButton from '../../adapters/SmsOtpButton';\nimport {createField} from '../../factories/FieldFactory';\nimport Button from '../../primitives/Button/Button';\nimport CopyableText from '../../primitives/CopyableText/CopyableText';\nimport DatePicker from '../../primitives/DatePicker/DatePicker';\nimport Divider from '../../primitives/Divider/Divider';\nimport flowIconRegistry from '../../primitives/Icons/flowIconRegistry';\nimport AffixedField from '../../primitives/AffixedField/AffixedField';\nimport Select from '../../primitives/Select/Select';\nimport {affixPostfixKey, affixPrefixKey} from '../../../utils/composeAffixedInputs';\nimport Typography from '../../primitives/Typography/Typography';\nimport {TypographyVariant} from '../../primitives/Typography/Typography.styles';\n\nconst logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(\n '@thunderid/react',\n 'AuthOptionFactory',\n);\n\n/*\n Replaces `emoji:` URIs embedded in HTML before DOMPurify sanitization.\n \n DOMPurify strips unknown URI schemes from attributes (e.g. `src=\"emoji:🦊\"` → `src=\"\"`).\n * This function converts:\n * - `<img src=\"emoji:X\" alt=\"Y\">` → `<span role=\"img\" aria-label=\"Y\">X</span>`\n * - Any remaining `emoji:X` text occurrences → `X`\n /\n\n// This module's functions (renderSignInComponents, etc.) are called imperatively from a\n// component's render, not React components/hooks themselves — so these classes can't be computed\n// at module scope: that runs at import time, before <ThunderIDProvider> has had a chance to\n// configure Emotion's CSP nonce, which would insert them into an un-nonced <style> tag. Instead\n// they're computed lazily, on first actual use (still just once — Emotion's own cache dedupes any\n// further calls to a no-op after that).\nlet richTextClassCache: string \| undefined;\n\n/* Ensures rich-text content (including all inner elements from the server) always word-wraps. /\nfunction getRichTextClass(): string {\n richTextClassCache ??= css`\n overflow-wrap: anywhere;\n & {\n overflow-wrap: anywhere;\n word-break: break-word;\n }\n & .rich-text-align-left {\n text-align: left;\n }\n & .rich-text-align-center {\n text-align: center;\n }\n & .rich-text-align-right {\n text-align: right;\n }\n & .rich-text-align-justify {\n text-align: justify;\n }\n & a,\n & .rich-text-link {\n text-decoration: underline;\n }\n & span[role='img'] {\n display: inline-block;\n }\n `;\n return richTextClassCache;\n}\n\nlet authOptionIconClassCache: string \| undefined;\n\nfunction getAuthOptionIconClass(): string {\n authOptionIconClassCache ??= css({height: '1.25em', objectFit: 'contain', width: '1.25em'});\n return authOptionIconClassCache;\n}\n\nexport type AuthType = 'signin' \| 'signup' \| 'recovery';\n\n/*\n Get the appropriate FieldType for an input component.\n /\n/* Upper bound on STACK grid slots, so a mistyped `items` cannot render thousands of cells. /\nconst MAX_STACK_ITEMS = 12;\n\nconst getFieldType = (variant: EmbeddedFlowComponentType): FieldType => {\n switch (variant) {\n case EmbeddedFlowComponentType.EmailInput:\n return FieldType.Email;\n case EmbeddedFlowComponentType.PhoneInput:\n return FieldType.Tel;\n case EmbeddedFlowComponentType.PasswordInput:\n return FieldType.Password;\n case EmbeddedFlowComponentType.TextInput:\n default:\n return FieldType.Text;\n }\n};\n\n/\n Get typography variant from component variant.\n /\nconst getTypographyVariant = (variant: string): any => {\n const variantMap: Record<EmbeddedFlowTextVariant, TypographyVariant> = {\n BODY_1: 'body1',\n BODY_2: 'body2',\n BUTTON_TEXT: 'button',\n CAPTION: 'caption',\n HEADING_1: 'h1',\n HEADING_2: 'h2',\n HEADING_3: 'h3',\n HEADING_4: 'h4',\n HEADING_5: 'h5',\n HEADING_6: 'h6',\n OVERLINE: 'overline',\n SUBTITLE_1: 'subtitle1',\n SUBTITLE_2: 'subtitle2',\n };\n\n return variantMap[variant] \|\| 'h3';\n};\n\n/\n Check if a button text or action matches a social provider.\n /\nconst matchesSocialProvider = (\n actionId: string,\n eventType: string,\n buttonText: string,\n provider: string,\n authType: AuthType,\n / eslint-disable-next-line @typescript-eslint/no-unused-vars /\n _componentVariant?: string,\n): boolean => {\n const providerId: any = `${provider}_auth`;\n const providerMatches: any = actionId === providerId \|\| eventType === providerId;\n\n // Social buttons usually have \"Sign in with X\" or \"Continue with X\" text,\n // so also check button text for the provider name to increase chances of correct detection (especially for signup flows where action IDs are less standardized)\n if (buttonText.toLowerCase().includes(provider)) {\n return true;\n }\n\n // For signup, also check button text\n if (authType === 'signup') {\n return providerMatches \|\| buttonText.toLowerCase().includes(provider);\n }\n\n return providerMatches;\n};\n\n/\n Create an auth component from flow component configuration.\n /\nconst createAuthComponentFromFlow = (\n component: EmbeddedFlowComponent,\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n authType: AuthType,\n options: {\n /* @internal Passed from the host React component so hooks aren't called inside a loop. /\n _customRenderers?: ComponentRendererMap;\n /* @internal Passed from the host React component so hooks aren't called inside a loop. /\n _theme?: any;\n /* Additional data from the flow response, used for different dynamic data /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n /* Current consent purpose being rendered. Set by CONSENT_PURPOSE block iteration. /\n currentConsentPurpose?: ConsentPurposeData;\n inStack?: boolean;\n inputClassName?: string;\n /* Flag to determine if the step timeline has expired /\n isTimeoutDisabled?: boolean;\n key?: string \| number;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n } = {},\n): ReactElement \| null => {\n const theme: any = options._theme;\n const customRenderers: ComponentRendererMap = options._customRenderers ?? {};\n\n const key: string \| number = options.key \|\| component.id;\n\n const customRenderer: ComponentRenderer \| undefined =\n customRenderers[component.id] ?? customRenderers[component.type];\n if (customRenderer) {\n const renderCtx: ComponentRenderContext = {\n additionalData: options.additionalData,\n authType,\n formErrors,\n formValues,\n isFormValid,\n isLoading,\n meta: options.meta,\n resetForm,\n onInputBlur: options.onInputBlur,\n onInputChange,\n onSubmit: options.onSubmit,\n touchedFields,\n };\n return customRenderer(component, renderCtx);\n }\n\n /* Resolve any remaining {{t()}} or {{meta()}} template expressions in a string at render time. /\n const resolve = (text: string \| undefined): string => {\n if (!text \|\| (!options.t && !options.meta)) {\n return text \|\| '';\n }\n return resolveFlowTemplateLiterals(text, {meta: options.meta, t: options.t \|\| ((k: string): string => k)});\n };\n\n switch (component.type) {\n case EmbeddedFlowComponentType.TextInput:\n case EmbeddedFlowComponentType.PasswordInput:\n case EmbeddedFlowComponentType.EmailInput:\n case EmbeddedFlowComponentType.PhoneInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n const fieldType: string = getFieldType(component.type);\n\n // Prefix/postfix are accepted on any text-family input. When either is present,\n // route to AffixedField so the leading affix renders and submit-time composition\n // is picked up by composeAffixedInputs via the sentinel keys.\n // Both string.length and Array.length are defined, so a single truthy+length\n // check covers `prefixes?: string \| PrefixOption[]`.\n const hasPrefixes: boolean = !!component.prefixes && component.prefixes.length > 0;\n const hasPostfix: boolean = typeof component.postfix === 'string' && component.postfix.length > 0;\n\n if (hasPrefixes \|\| hasPostfix) {\n const prefixStateKey: string = affixPrefixKey(identifier, options.vendor);\n const postfixStateKey: string = affixPostfixKey(identifier, options.vendor);\n const defaultPrefixValue: string = hasPrefixes\n ? typeof component.prefixes === 'string'\n ? component.prefixes\n : (component.prefixes as PrefixOption[])[0].value\n : '';\n const selectedPrefix: string = formValues[prefixStateKey] ?? defaultPrefixValue;\n\n return (\n <AffixedField\n key={key}\n className={cx(options.inputClassName, component.classes)}\n id={component.id}\n label={resolve(component.label) \|\| ''}\n name={identifier}\n placeholder={resolve(component.placeholder) \|\| ''}\n required={component.required \|\| false}\n error={error}\n value={value}\n type={fieldType}\n prefixes={component.prefixes}\n prefixValue={selectedPrefix}\n onChange={(e: ChangeEvent<HTMLInputElement>): void => onInputChange(identifier, e.target.value)}\n onBlur={(): void => options.onInputBlur?.(identifier)}\n onPrefixChange={(newPrefix: string): void => onInputChange(prefixStateKey, newPrefix)}\n onFocus={(): void => {\n if (hasPrefixes && formValues[prefixStateKey] === undefined) {\n onInputChange(prefixStateKey, defaultPrefixValue);\n }\n if (hasPostfix && formValues[postfixStateKey] === undefined) {\n onInputChange(postfixStateKey, component.postfix!);\n }\n }}\n />\n );\n }\n\n const field: any = createField({\n className: cx(options.inputClassName, component.classes),\n error,\n id: component.id,\n label: resolve(component.label) \|\| '',\n name: identifier,\n onBlur: () => options.onInputBlur?.(identifier),\n onChange: (newValue: string) => onInputChange(identifier, newValue),\n placeholder: resolve(component.placeholder) \|\| '',\n required: component.required \|\| false,\n type: fieldType as FieldType,\n value,\n });\n\n return cloneElement(field, {key});\n }\n\n case EmbeddedFlowComponentType.OtpInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n // The server reports the length and character set of the code it generated, so the field\n // matches the OTP the user received. An older server omits both and the defaults apply.\n const reportedLength: number = Number(options.additionalData?.['otpLength']);\n const otpLength: number \| undefined =\n Number.isInteger(reportedLength) && reportedLength > 0 ? reportedLength : undefined;\n const numericOnly: boolean = options.additionalData?.['otpNumericOnly'] !== 'false';\n\n const field: any = createField({\n className: cx(options.inputClassName, component.classes),\n error,\n id: component.id,\n label: resolve(component.label) \|\| '',\n length: otpLength,\n name: identifier,\n numericOnly,\n onBlur: () => options.onInputBlur?.(identifier),\n onChange: (newValue: string) => onInputChange(identifier, newValue),\n placeholder: resolve(component.placeholder) \|\| '',\n required: component.required \|\| false,\n type: FieldType.Otp,\n value,\n });\n\n return cloneElement(field, {key});\n }\n\n case EmbeddedFlowComponentType.Action: {\n const actionId: string = component.id;\n const eventType: string = component.eventType \|\| '';\n const buttonText: string = resolve(component.label);\n const componentVariant: string = component.variant \|\| '';\n\n // Only validate on submit type events.\n const shouldSkipValidation: boolean = eventType.toUpperCase() !== EmbeddedFlowEventType.Submit;\n\n // Determine the button type based on the event type. Default to 'submit' if not recognized.\n const buttonTypeEnum = {\n [EmbeddedFlowEventType.Submit]: 'submit',\n [EmbeddedFlowEventType.Reset]: 'reset',\n [EmbeddedFlowEventType.Cancel]: 'button',\n [EmbeddedFlowEventType.Trigger]: 'button',\n [EmbeddedFlowEventType.Back]: 'button',\n };\n const buttonType: HTMLButtonElement['type'] = buttonTypeEnum[eventType.toUpperCase()] ?? 'submit';\n\n const handleClick = (): any => {\n if (options.onSubmit) {\n const formData: Record<string, any> = {};\n Object.keys(formValues).forEach((field: any) => {\n // Include all values, even empty strings, to ensure proper submission\n formData[field] = formValues[field];\n });\n\n // For consent actions, build the consent_decisions JSON from the form values.\n // The allow action captures per-attribute choices; the deny action sends\n // all purposes as rejected so the backend ConsentExecutor can fail the flow.\n const consentPrompt: ConsentPromptData \| undefined = options.additionalData?.['consentPrompt'] as\n \| ConsentPromptData\n \| undefined;\n if (consentPrompt && eventType.toUpperCase() === EmbeddedFlowEventType.Submit) {\n const isDeny: boolean = componentVariant.toLowerCase() !== 'primary';\n const decisions: ConsentDecisions = {\n approved: !isDeny,\n ...(isDeny ? {reason: ConsentConstants.REASON_USER_DENIED} : {}),\n purposes: consentPrompt.purposes.map(\n (p: ConsentPurposeData): ConsentPurposeDecision => ({\n approved: !isDeny,\n elements: [\n // Permission purposes carry no essential elements, so the server sends null here\n ...(p.essential ?? []).map((e): ConsentAttributeElement => ({approved: !isDeny, name: e.name})),\n ...(p.optional ?? []).map(\n (e): ConsentAttributeElement => ({\n approved: !isDeny && formValues[getConsentOptionalKey(p.purposeId, e.name)] === 'true',\n name: e.name,\n }),\n ),\n ],\n purposeName: p.purposeName!,\n }),\n ),\n };\n formData['consent_decisions'] = JSON.stringify(decisions);\n }\n\n // For submit events, pass the form data to the onSubmit callback. For other event types, reset the form and call onSubmit with an empty data object.\n if (eventType.toUpperCase() === EmbeddedFlowEventType.Submit) {\n options.onSubmit(component, formData, shouldSkipValidation);\n } else {\n resetForm();\n options.onSubmit(component, {}, shouldSkipValidation);\n }\n }\n };\n\n // Render branded social login buttons for known action IDs\n\n const socialButtonClassName: string = cx(options.buttonClassName, component.classes);\n\n if (matchesSocialProvider(actionId, eventType, buttonText, 'google', authType, componentVariant)) {\n return <GoogleButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'github', authType, componentVariant)) {\n return <GitHubButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'facebook', authType, componentVariant)) {\n return <FacebookButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'microsoft', authType, componentVariant)) {\n return <MicrosoftButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'linkedin', authType, componentVariant)) {\n return <LinkedInButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'ethereum', authType, componentVariant)) {\n return (\n <SignInWithEthereumButton\n key={key}\n id={component.id}\n onClick={handleClick}\n className={socialButtonClassName}\n />\n );\n }\n if (actionId === 'prompt_mobile' \|\| eventType === 'prompt_mobile') {\n return <SmsOtpButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n\n const startIconEl: ReactElement \| null = component.startIcon ? (\n <img src={component.startIcon} alt=\"\" aria-hidden=\"true\" className={getAuthOptionIconClass()} />\n ) : null;\n\n const endIconEl: ReactElement \| null = component.endIcon ? (\n <img src={component.endIcon} alt=\"\" aria-hidden=\"true\" className={getAuthOptionIconClass()} />\n ) : null;\n\n return (\n <Button\n fullWidth\n key={key}\n id={component.id}\n onClick={handleClick}\n disabled={\n isLoading \|\|\n (!isFormValid && !shouldSkipValidation) \|\|\n options.isTimeoutDisabled \|\|\n (component as any).config?.disabled\n }\n className={cx(options.buttonClassName, component.classes)}\n data-testid=\"thunderid-signin-submit\"\n variant={component.variant?.toLowerCase() === 'primary' ? 'solid' : 'outline'}\n color={component.variant?.toLowerCase() === 'primary' ? 'primary' : 'secondary'}\n startIcon={startIconEl}\n endIcon={endIconEl}\n type={buttonType}\n >\n {buttonText \|\| 'Submit'}\n </Button>\n );\n }\n\n case EmbeddedFlowComponentType.Text: {\n const variant: any = getTypographyVariant(component.variant!);\n const textAlignClass: string = css({\n marginBottom: 2,\n textAlign:\n typeof component?.align === 'string' ? (component.align as React.CSSProperties['textAlign']) : 'left',\n });\n return (\n <Typography key={key} id={component.id} className={cx(component.classes, textAlignClass)} variant={variant}>\n {resolve(component.label)}\n </Typography>\n );\n }\n\n case EmbeddedFlowComponentType.Divider: {\n return <Divider key={key}>{resolve(component.label) \|\| ''}</Divider>;\n }\n\n case EmbeddedFlowComponentType.Select: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n // Options are pre-sanitized by flowTransformer to {value: string, label: string} format\n const selectOptions: any = (component.options \|\| []).map((opt: any) => ({\n label: typeof opt === 'string' ? opt : String(opt.label ?? opt.value ?? ''),\n value: typeof opt === 'string' ? opt : String(opt.value ?? ''),\n }));\n\n return (\n <Select\n key={key}\n id={component.id}\n name={identifier}\n label={resolve(component.label) \|\| ''}\n placeholder={resolve(component.placeholder)}\n required={component.required}\n options={selectOptions}\n value={value}\n error={error}\n onChange={(e: any): void => onInputChange(identifier, e.target.value)}\n onBlur={(): any => options.onInputBlur?.(identifier)}\n className={cx(options.inputClassName, component.classes)}\n />\n );\n }\n\n case EmbeddedFlowComponentType.DateInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n return (\n <DatePicker\n key={key}\n id={component.id}\n name={identifier}\n label={resolve(component.label) \|\| ''}\n placeholder={resolve(component.placeholder)}\n required={component.required}\n dateFormat={component.dateFormat}\n value={value}\n error={error}\n onChange={(e: any): void => onInputChange(identifier, e.target.value)}\n onBlur={(): any => options.onInputBlur?.(identifier)}\n className={cx(options.inputClassName, component.classes)}\n />\n );\n }\n\n case EmbeddedFlowComponentType.OuSelect: {\n logger.warn('OU_SELECT component type is not supported. Skipping render.');\n return null;\n }\n\n case EmbeddedFlowComponentType.Block: {\n if (component.components && component.components.length > 0) {\n const formClass: string = css({\n display: 'flex',\n flexDirection: 'column',\n gap: `calc(${theme?.vars?.spacing?.unit ?? '4px'} 2)`,\n });\n\n const blockComponents: any = component.components\n .map((childComponent: any, index: any) =>\n createAuthComponentFromFlow(\n childComponent,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n authType,\n {\n ...options,\n key: childComponent.id \|\| `${component.id}_${index}`,\n },\n ),\n )\n .filter(Boolean);\n\n // The submit button's `type=\"submit\"` (and pressing Enter in a field) would\n // otherwise trigger the browser's native form submission — a GET request to\n // the current URL with all field values (including passwords) as query params.\n // Actual submission is handled entirely via `onClick`/`onSubmit` above.\n return (\n <form\n id={component.id}\n key={key}\n className={cx(component.classes, formClass)}\n onSubmit={(event: FormEvent<HTMLFormElement>): void => event.preventDefault()}\n >\n {blockComponents}\n </form>\n );\n }\n return null;\n }\n\n case EmbeddedFlowComponentType.RichText: {\n const richTextAction: EmbeddedFlowComponentAction \| undefined = component.action;\n\n const dispatchRichTextAction = (): void => {\n if (!richTextAction \|\| !options.onSubmit) {\n return;\n }\n const eventTypeValue = String(richTextAction.eventType ?? EmbeddedFlowEventType.Submit);\n const shouldSkipValidation: boolean = eventTypeValue.toUpperCase() === String(EmbeddedFlowEventType.Trigger);\n const syntheticAction: EmbeddedFlowComponent = {\n eventType: eventTypeValue,\n id: `${component.id}_action`,\n ref: richTextAction.ref,\n type: EmbeddedFlowComponentType.Action,\n };\n const formData: Record<string, string> = {};\n Object.keys(formValues).forEach((field: string) => {\n formData[field] = formValues[field];\n });\n options.onSubmit(syntheticAction, formData, shouldSkipValidation);\n };\n\n // Sentinel-anchor contract: only anchors carrying `data-action-ref` equal to\n // richTextAction.ref dispatch the action. Anchors without the sentinel (or with\n // a non-matching one) are treated as ordinary links and are ignored here.\n const isMatchingSentinelAnchor = (anchor: HTMLAnchorElement): boolean =>\n anchor.getAttribute('data-action-ref') === richTextAction?.ref;\n\n const handleRichTextClick: React.MouseEventHandler<HTMLDivElement> \| undefined = richTextAction\n ? (event: React.MouseEvent<HTMLDivElement>): void => {\n const anchor: HTMLAnchorElement \| null = (event.target as HTMLElement).closest('a');\n if (!anchor \|\| !isMatchingSentinelAnchor(anchor)) {\n return;\n }\n event.preventDefault();\n dispatchRichTextAction();\n }\n : undefined;\n\n const handleRichTextKeyDown: React.KeyboardEventHandler<HTMLDivElement> \| undefined = richTextAction\n ? (event: React.KeyboardEvent<HTMLDivElement>): void => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n const anchor: HTMLAnchorElement \| null = (event.target as HTMLElement).closest('a');\n if (!anchor \|\| !isMatchingSentinelAnchor(anchor)) {\n return;\n }\n event.preventDefault();\n dispatchRichTextAction();\n }\n : undefined;\n\n return (\n // Sentinel anchors are made keyboard-operable via the container's onKeyDown\n // (Enter/Space activate the matching anchor). Authors should ensure the anchor\n // is focusable (`href` or `tabIndex`); the click+keydown delegation covers both\n // pointer and keyboard activation once focus lands on the anchor.\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <div\n key={key}\n className={getRichTextClass()}\n onClick={handleRichTextClick}\n onKeyDown={handleRichTextKeyDown}\n // Manually sanitizes with `DOMPurify`.\n // IMPORTANT: DO NOT REMOVE OR MODIFY THIS SANITIZATION STEP.\n dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(resolveEmojiUrisInHtml(resolve(component.label)))}}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Image: {\n const explicitHeight: string = resolve(component.height?.toString());\n const explicitWidth: string = resolve(component.width?.toString());\n return (\n <ImageComponent\n key={key}\n component={\n {\n config: {\n alt: resolve(component.alt) \|\| resolve(component.label) \|\| 'Image',\n height: explicitHeight \|\| (options.inStack ? '50' : 'auto'),\n src: resolve(component.src),\n width: explicitWidth \|\| (options.inStack ? '50' : '100%'),\n },\n } as any\n }\n formErrors={undefined!}\n formValues={undefined!}\n isFormValid={false}\n isLoading={false}\n onInputChange={(): void => {\n throw new Error('Function not implemented.');\n }}\n touchedFields={undefined!}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Icon: {\n const iconName: string = component.name \|\| '';\n const IconComponent: any = flowIconRegistry[iconName];\n if (!IconComponent) {\n logger.warn(`Unknown icon name: \"${iconName}\". Skipping render.`);\n return null;\n }\n return <IconComponent key={key} size={component.size \|\| 24} color={component.color \|\| 'currentColor'} />;\n }\n\n case EmbeddedFlowComponentType.Stack: {\n const direction: string = (component as any).direction \|\| 'row';\n const gap: number = (component as any).gap ?? 2;\n const align: string = (component as any).align \|\| 'center';\n const justify: string = (component as any).justify \|\| 'flex-start';\n\n // `items` is the number of slots across the main axis and `direction` picks\n // that axis: with `row` it is the column count (items: 2 with four buttons\n // renders a 2 x 2 grid), and with `column` it is the row count and children\n // flow into further columns. Fewer than two slots keeps the flex layout, so\n // stacks authored before grid support are unaffected.\n const rawItems: string \| number \| undefined = component.items;\n const parsedItems: number =\n typeof rawItems === 'string' ? Number(rawItems) : typeof rawItems === 'number' ? rawItems : NaN;\n const items: number \| null =\n Number.isFinite(parsedItems) && Math.floor(parsedItems) >= 2\n ? Math.min(Math.floor(parsedItems), MAX_STACK_ITEMS)\n : null;\n // CSS Grid has no reverse auto-flow, so the reverse variants fall back to\n // their base axis rather than silently becoming a row.\n const isColumn: boolean = direction.startsWith('column');\n const gridJustify: string = component.justify ?? 'stretch';\n // Equal `1fr` tracks fill the container, leaving `justify-content` no free\n // space to distribute. Content-sized tracks restore it, so every justify\n // value has a visible effect while the default stays an even split.\n const track: string = gridJustify === 'stretch' ? '1fr' : 'auto';\n\n const stackStyle: CSSProperties =\n items !== null\n ? {\n alignItems: component.align ?? 'stretch',\n display: 'grid',\n gap: `${gap * 0.5}rem`,\n gridAutoFlow: isColumn ? 'column' : 'row',\n justifyContent: gridJustify,\n width: '100%',\n ...(isColumn\n ? {gridTemplateRows: `repeat(${items}, ${track})`}\n : {gridTemplateColumns: `repeat(${items}, ${track})`}),\n }\n : {\n alignItems: align,\n display: 'flex',\n flexDirection: direction as CSSProperties['flexDirection'],\n flexWrap: 'wrap',\n gap: `${gap * 0.5}rem`,\n justifyContent: justify,\n };\n\n const stackClass: string = css(stackStyle as CSSInterpolation);\n\n const stackChildren: (ReactElement \| null)[] = component.components\n ? component.components.map((childComponent: any, index: number) =>\n createAuthComponentFromFlow(\n childComponent,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n authType,\n {\n ...options,\n inStack: true,\n key: childComponent.id \|\| `${component.id}_${index}`,\n },\n ),\n )\n : [];\n\n return (\n <div key={key} id={component.id} className={cx(component.classes, stackClass)}>\n {stackChildren}\n </div>\n );\n }\n\n case EmbeddedFlowComponentType.Consent: {\n const consentPromptRawData: ConsentPromptData \| string \| undefined = options.additionalData?.['consentPrompt'];\n\n return (\n <Consent\n key={key}\n consentData={consentPromptRawData as any}\n formValues={formValues}\n onInputChange={onInputChange}\n t={options.t}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Timer: {\n const textTemplate: string = resolve((component as any).label) \|\| 'Time remaining: {time}';\n const timeoutMs: number = Number(options.additionalData?.['stepTimeout']) \|\| 0;\n const expiresIn: number = timeoutMs > 0 ? Math.max(0, Math.floor((timeoutMs - Date.now()) / 1000)) : 0;\n\n return <FlowTimer key={key} expiresIn={expiresIn} textTemplate={textTemplate} />;\n }\n\n case EmbeddedFlowComponentType.CopyableText: {\n const sourceKey: string \| undefined = (component as any).source;\n const value: string = sourceKey && options.additionalData ? String(options.additionalData[sourceKey] ?? '') : '';\n const labelText: string \| undefined = resolve((component as any).label) \|\| undefined;\n\n return <CopyableText key={key} label={labelText} value={value} />;\n }\n\n default:\n // Gracefully handle unsupported component types by returning null\n logger.warn(`Unsupported component type: ${component.type}. Skipping render.`);\n return null;\n }\n};\n\n/*\n Processes an array of components and renders them as React elements for sign-in.\n /\nexport const renderSignInComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /* Flag to determine if the step timeline has expired /\n isTimeoutDisabled?: boolean;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signin',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/\n Processes an array of components and renders them as React elements for sign-up.\n /\nexport const renderSignUpComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signup',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/\n Processes an array of components and renders them as React elements for recovery flow.\n /\nexport const renderRecoveryComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /* Flag to determine if the step timeline has expired /\n isTimeoutDisabled?: boolean;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'recovery',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/\n Processes an array of components and renders them as React elements for invite user.\n * This is used by both InviteUser and AcceptInvite components.\n /\nexport const renderInviteUserComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n /* Function to fetch child organization units for OU_SELECT components. /\n fetchOrganizationUnitChildren?: (\n parentId: string,\n limit: number,\n offset: number,\n ) => Promise<OrganizationUnitListResponse>;\n inputClassName?: string;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. */\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signup',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n"],"mappings":"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UACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK;;;;AAKjD,MAAa,0BACX,YACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YAqBA,WACG,KAAK,WAAgB,UACpB,4BACE,WACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,UACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK;;;;AAKjD,MAAa,4BACX,YACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YAuBA,WACG,KAAK,WAAgB,UACpB,4BACE,WACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK;;;;;AAMjD,MAAa,8BACX,YACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YA2BA,WACG,KAAK,WAAgB,UACpB,4BACE,WACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,UACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK"}
1	+ {"version":3,"file":"AuthOptionFactory.cjs","names":["logger: ReturnType<typeof createPackageComponentLogger>","richTextClassCache: string \| undefined","authOptionIconClassCache: string \| undefined","css","EmbeddedFlowComponentType","FieldType","providerId: any","providerMatches: any","theme: any","customRenderers: ComponentRendererMap","key: string \| number","customRenderer: ComponentRenderer \| undefined","identifier: string","value: string","error: string","fieldType: string","hasPrefixes: boolean","hasPostfix: boolean","prefixStateKey: string","affixPrefixKey","postfixStateKey: string","affixPostfixKey","defaultPrefixValue: string","selectedPrefix: string","AffixedField","cx","createField","reportedLength: number","otpLength: number \| undefined","numericOnly: boolean","actionId: string","eventType: string","buttonText: string","componentVariant: string","shouldSkipValidation: boolean","EmbeddedFlowEventType","buttonType: HTMLButtonElement['type']","formData: Record<string, any>","consentPrompt: ConsentPromptData \| undefined","isDeny: boolean","decisions: ConsentDecisions","ConsentConstants","getConsentOptionalKey","socialButtonClassName: string","GoogleButton","GitHubButton","FacebookButton","MicrosoftButton","LinkedInButton","SignInWithEthereumButton","SmsOtpButton","startIconEl: ReactElement \| null","endIconEl: ReactElement \| null","Button","variant: any","textAlignClass: string","Typography","Divider","selectOptions: any","Select","DatePicker","formClass: string","blockComponents: any","richTextAction: EmbeddedFlowComponentAction \| undefined","syntheticAction: EmbeddedFlowComponent","formData: Record<string, string>","handleRichTextClick: React.MouseEventHandler<HTMLDivElement> \| undefined","anchor: HTMLAnchorElement \| null","handleRichTextKeyDown: React.KeyboardEventHandler<HTMLDivElement> \| undefined","DOMPurify","explicitHeight: string","explicitWidth: string","ImageComponent","iconName: string","IconComponent: any","flowIconRegistry","direction: string","gap: number","align: string","justify: string","rawItems: string \| number \| undefined","parsedItems: number","items: number \| null","isColumn: boolean","gridJustify: string","track: string","stackClass: string","stackChildren: (ReactElement \| null)[]","consentPromptRawData: ConsentPromptData \| string \| undefined","Consent","textTemplate: string","timeoutMs: number","FlowTimer","sourceKey: string \| undefined","CopyableText","pairs: KeyValuePair[]","KeyValueList"],"sources":["../../../../../src/components/presentation/auth/AuthOptionFactory.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport type {CSSInterpolation} from '@emotion/css/create-instance';\nimport {\n ConsentConstants,\n FieldType,\n FlowMetadataResponse,\n EmbeddedFlowComponent,\n EmbeddedFlowComponentAction,\n EmbeddedFlowComponentType,\n EmbeddedFlowTextVariant,\n EmbeddedFlowEventType,\n createPackageComponentLogger,\n resolveFlowTemplateLiterals,\n resolveEmojiUrisInHtml,\n ConsentPurposeData,\n ConsentPromptData,\n ConsentDecisions,\n ConsentPurposeDecision,\n ConsentAttributeElement,\n OrganizationUnitListResponse,\n PrefixOption,\n KeyValuePair,\n parseKeyValuePairs,\n} from '@thunderid/browser';\nimport DOMPurify from 'dompurify';\nimport {ChangeEvent, cloneElement, CSSProperties, FormEvent, ReactElement} from 'react';\nimport {\n ComponentRenderer,\n ComponentRenderContext,\n ComponentRendererMap,\n} from '../../../contexts/ComponentRenderer/ComponentRendererContext';\nimport {UseTranslation} from '../../../hooks/useTranslation';\nimport {css, cx} from '../../../styles/emotion';\nimport Consent from '../../adapters/Consent';\nimport {getConsentOptionalKey} from '../../adapters/ConsentCheckboxList';\nimport FacebookButton from '../../adapters/FacebookButton';\nimport FlowTimer from '../../adapters/FlowTimer';\nimport GitHubButton from '../../adapters/GitHubButton';\nimport GoogleButton from '../../adapters/GoogleButton';\nimport ImageComponent from '../../adapters/ImageComponent';\nimport LinkedInButton from '../../adapters/LinkedInButton';\nimport MicrosoftButton from '../../adapters/MicrosoftButton';\nimport SignInWithEthereumButton from '../../adapters/SignInWithEthereumButton';\nimport SmsOtpButton from '../../adapters/SmsOtpButton';\nimport {createField} from '../../factories/FieldFactory';\nimport Button from '../../primitives/Button/Button';\nimport CopyableText from '../../primitives/CopyableText/CopyableText';\nimport DatePicker from '../../primitives/DatePicker/DatePicker';\nimport Divider from '../../primitives/Divider/Divider';\nimport flowIconRegistry from '../../primitives/Icons/flowIconRegistry';\nimport KeyValueList from '../../primitives/KeyValueList/KeyValueList';\nimport AffixedField from '../../primitives/AffixedField/AffixedField';\nimport Select from '../../primitives/Select/Select';\nimport {affixPostfixKey, affixPrefixKey} from '../../../utils/composeAffixedInputs';\nimport Typography from '../../primitives/Typography/Typography';\nimport {TypographyVariant} from '../../primitives/Typography/Typography.styles';\n\nconst logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(\n '@thunderid/react',\n 'AuthOptionFactory',\n);\n\n/*\n Replaces `emoji:` URIs embedded in HTML before DOMPurify sanitization.\n \n DOMPurify strips unknown URI schemes from attributes (e.g. `src=\"emoji:🦊\"` → `src=\"\"`).\n * This function converts:\n * - `<img src=\"emoji:X\" alt=\"Y\">` → `<span role=\"img\" aria-label=\"Y\">X</span>`\n * - Any remaining `emoji:X` text occurrences → `X`\n /\n\n// This module's functions (renderSignInComponents, etc.) are called imperatively from a\n// component's render, not React components/hooks themselves — so these classes can't be computed\n// at module scope: that runs at import time, before <ThunderIDProvider> has had a chance to\n// configure Emotion's CSP nonce, which would insert them into an un-nonced <style> tag. Instead\n// they're computed lazily, on first actual use (still just once — Emotion's own cache dedupes any\n// further calls to a no-op after that).\nlet richTextClassCache: string \| undefined;\n\n/* Ensures rich-text content (including all inner elements from the server) always word-wraps. /\nfunction getRichTextClass(): string {\n richTextClassCache ??= css`\n overflow-wrap: anywhere;\n & {\n overflow-wrap: anywhere;\n word-break: break-word;\n }\n & .rich-text-align-left {\n text-align: left;\n }\n & .rich-text-align-center {\n text-align: center;\n }\n & .rich-text-align-right {\n text-align: right;\n }\n & .rich-text-align-justify {\n text-align: justify;\n }\n & a,\n & .rich-text-link {\n text-decoration: underline;\n }\n & span[role='img'] {\n display: inline-block;\n }\n `;\n return richTextClassCache;\n}\n\nlet authOptionIconClassCache: string \| undefined;\n\nfunction getAuthOptionIconClass(): string {\n authOptionIconClassCache ??= css({height: '1.25em', objectFit: 'contain', width: '1.25em'});\n return authOptionIconClassCache;\n}\n\nexport type AuthType = 'signin' \| 'signup' \| 'recovery';\n\n/*\n Get the appropriate FieldType for an input component.\n /\n/* Upper bound on STACK grid slots, so a mistyped `items` cannot render thousands of cells. /\nconst MAX_STACK_ITEMS = 12;\n\nconst getFieldType = (variant: EmbeddedFlowComponentType): FieldType => {\n switch (variant) {\n case EmbeddedFlowComponentType.EmailInput:\n return FieldType.Email;\n case EmbeddedFlowComponentType.PhoneInput:\n return FieldType.Tel;\n case EmbeddedFlowComponentType.PasswordInput:\n return FieldType.Password;\n case EmbeddedFlowComponentType.TextInput:\n default:\n return FieldType.Text;\n }\n};\n\n/\n Get typography variant from component variant.\n /\nconst getTypographyVariant = (variant: string): any => {\n const variantMap: Record<EmbeddedFlowTextVariant, TypographyVariant> = {\n BODY_1: 'body1',\n BODY_2: 'body2',\n BUTTON_TEXT: 'button',\n CAPTION: 'caption',\n HEADING_1: 'h1',\n HEADING_2: 'h2',\n HEADING_3: 'h3',\n HEADING_4: 'h4',\n HEADING_5: 'h5',\n HEADING_6: 'h6',\n OVERLINE: 'overline',\n SUBTITLE_1: 'subtitle1',\n SUBTITLE_2: 'subtitle2',\n };\n\n return variantMap[variant] \|\| 'h3';\n};\n\n/\n Check if a button text or action matches a social provider.\n /\nconst matchesSocialProvider = (\n actionId: string,\n eventType: string,\n buttonText: string,\n provider: string,\n authType: AuthType,\n / eslint-disable-next-line @typescript-eslint/no-unused-vars /\n _componentVariant?: string,\n): boolean => {\n const providerId: any = `${provider}_auth`;\n const providerMatches: any = actionId === providerId \|\| eventType === providerId;\n\n // Social buttons usually have \"Sign in with X\" or \"Continue with X\" text,\n // so also check button text for the provider name to increase chances of correct detection (especially for signup flows where action IDs are less standardized)\n if (buttonText.toLowerCase().includes(provider)) {\n return true;\n }\n\n // For signup, also check button text\n if (authType === 'signup') {\n return providerMatches \|\| buttonText.toLowerCase().includes(provider);\n }\n\n return providerMatches;\n};\n\n/\n Create an auth component from flow component configuration.\n /\nconst createAuthComponentFromFlow = (\n component: EmbeddedFlowComponent,\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n authType: AuthType,\n options: {\n /* @internal Passed from the host React component so hooks aren't called inside a loop. /\n _customRenderers?: ComponentRendererMap;\n /* @internal Passed from the host React component so hooks aren't called inside a loop. /\n _theme?: any;\n /* Additional data from the flow response, used for different dynamic data /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n /* Current consent purpose being rendered. Set by CONSENT_PURPOSE block iteration. /\n currentConsentPurpose?: ConsentPurposeData;\n inStack?: boolean;\n inputClassName?: string;\n /* Flag to determine if the step timeline has expired /\n isTimeoutDisabled?: boolean;\n key?: string \| number;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n } = {},\n): ReactElement \| null => {\n const theme: any = options._theme;\n const customRenderers: ComponentRendererMap = options._customRenderers ?? {};\n\n const key: string \| number = options.key \|\| component.id;\n\n const customRenderer: ComponentRenderer \| undefined =\n customRenderers[component.id] ?? customRenderers[component.type];\n if (customRenderer) {\n const renderCtx: ComponentRenderContext = {\n additionalData: options.additionalData,\n authType,\n formErrors,\n formValues,\n isFormValid,\n isLoading,\n meta: options.meta,\n resetForm,\n onInputBlur: options.onInputBlur,\n onInputChange,\n onSubmit: options.onSubmit,\n touchedFields,\n };\n return customRenderer(component, renderCtx);\n }\n\n /* Resolve any remaining {{t()}} or {{meta()}} template expressions in a string at render time. /\n const resolve = (text: string \| undefined): string => {\n if (!text \|\| (!options.t && !options.meta)) {\n return text \|\| '';\n }\n return resolveFlowTemplateLiterals(text, {meta: options.meta, t: options.t \|\| ((k: string): string => k)});\n };\n\n switch (component.type) {\n case EmbeddedFlowComponentType.TextInput:\n case EmbeddedFlowComponentType.PasswordInput:\n case EmbeddedFlowComponentType.EmailInput:\n case EmbeddedFlowComponentType.PhoneInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n const fieldType: string = getFieldType(component.type);\n\n // Prefix/postfix are accepted on any text-family input. When either is present,\n // route to AffixedField so the leading affix renders and submit-time composition\n // is picked up by composeAffixedInputs via the sentinel keys.\n // Both string.length and Array.length are defined, so a single truthy+length\n // check covers `prefixes?: string \| PrefixOption[]`.\n const hasPrefixes: boolean = !!component.prefixes && component.prefixes.length > 0;\n const hasPostfix: boolean = typeof component.postfix === 'string' && component.postfix.length > 0;\n\n if (hasPrefixes \|\| hasPostfix) {\n const prefixStateKey: string = affixPrefixKey(identifier, options.vendor);\n const postfixStateKey: string = affixPostfixKey(identifier, options.vendor);\n const defaultPrefixValue: string = hasPrefixes\n ? typeof component.prefixes === 'string'\n ? component.prefixes\n : (component.prefixes as PrefixOption[])[0].value\n : '';\n const selectedPrefix: string = formValues[prefixStateKey] ?? defaultPrefixValue;\n\n return (\n <AffixedField\n key={key}\n className={cx(options.inputClassName, component.classes)}\n id={component.id}\n label={resolve(component.label) \|\| ''}\n name={identifier}\n placeholder={resolve(component.placeholder) \|\| ''}\n required={component.required \|\| false}\n error={error}\n value={value}\n type={fieldType}\n prefixes={component.prefixes}\n prefixValue={selectedPrefix}\n onChange={(e: ChangeEvent<HTMLInputElement>): void => onInputChange(identifier, e.target.value)}\n onBlur={(): void => options.onInputBlur?.(identifier)}\n onPrefixChange={(newPrefix: string): void => onInputChange(prefixStateKey, newPrefix)}\n onFocus={(): void => {\n if (hasPrefixes && formValues[prefixStateKey] === undefined) {\n onInputChange(prefixStateKey, defaultPrefixValue);\n }\n if (hasPostfix && formValues[postfixStateKey] === undefined) {\n onInputChange(postfixStateKey, component.postfix!);\n }\n }}\n />\n );\n }\n\n const field: any = createField({\n className: cx(options.inputClassName, component.classes),\n error,\n id: component.id,\n label: resolve(component.label) \|\| '',\n name: identifier,\n onBlur: () => options.onInputBlur?.(identifier),\n onChange: (newValue: string) => onInputChange(identifier, newValue),\n placeholder: resolve(component.placeholder) \|\| '',\n required: component.required \|\| false,\n type: fieldType as FieldType,\n value,\n });\n\n return cloneElement(field, {key});\n }\n\n case EmbeddedFlowComponentType.OtpInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n // The server reports the length and character set of the code it generated, so the field\n // matches the OTP the user received. An older server omits both and the defaults apply.\n const reportedLength: number = Number(options.additionalData?.['otpLength']);\n const otpLength: number \| undefined =\n Number.isInteger(reportedLength) && reportedLength > 0 ? reportedLength : undefined;\n const numericOnly: boolean = options.additionalData?.['otpNumericOnly'] !== 'false';\n\n const field: any = createField({\n className: cx(options.inputClassName, component.classes),\n error,\n id: component.id,\n label: resolve(component.label) \|\| '',\n length: otpLength,\n name: identifier,\n numericOnly,\n onBlur: () => options.onInputBlur?.(identifier),\n onChange: (newValue: string) => onInputChange(identifier, newValue),\n placeholder: resolve(component.placeholder) \|\| '',\n required: component.required \|\| false,\n type: FieldType.Otp,\n value,\n });\n\n return cloneElement(field, {key});\n }\n\n case EmbeddedFlowComponentType.Action: {\n const actionId: string = component.id;\n const eventType: string = component.eventType \|\| '';\n const buttonText: string = resolve(component.label);\n const componentVariant: string = component.variant \|\| '';\n\n // Only validate on submit type events.\n const shouldSkipValidation: boolean = eventType.toUpperCase() !== EmbeddedFlowEventType.Submit;\n\n // Determine the button type based on the event type. Default to 'submit' if not recognized.\n const buttonTypeEnum = {\n [EmbeddedFlowEventType.Submit]: 'submit',\n [EmbeddedFlowEventType.Reset]: 'reset',\n [EmbeddedFlowEventType.Cancel]: 'button',\n [EmbeddedFlowEventType.Trigger]: 'button',\n [EmbeddedFlowEventType.Back]: 'button',\n };\n const buttonType: HTMLButtonElement['type'] = buttonTypeEnum[eventType.toUpperCase()] ?? 'submit';\n\n const handleClick = (): any => {\n if (options.onSubmit) {\n const formData: Record<string, any> = {};\n Object.keys(formValues).forEach((field: any) => {\n // Include all values, even empty strings, to ensure proper submission\n formData[field] = formValues[field];\n });\n\n // For consent actions, build the consent_decisions JSON from the form values.\n // The allow action captures per-attribute choices; the deny action sends\n // all purposes as rejected so the backend ConsentExecutor can fail the flow.\n const consentPrompt: ConsentPromptData \| undefined = options.additionalData?.['consentPrompt'] as\n \| ConsentPromptData\n \| undefined;\n if (consentPrompt && eventType.toUpperCase() === EmbeddedFlowEventType.Submit) {\n const isDeny: boolean = componentVariant.toLowerCase() !== 'primary';\n const decisions: ConsentDecisions = {\n approved: !isDeny,\n ...(isDeny ? {reason: ConsentConstants.REASON_USER_DENIED} : {}),\n purposes: consentPrompt.purposes.map(\n (p: ConsentPurposeData): ConsentPurposeDecision => ({\n approved: !isDeny,\n elements: [\n // Permission purposes carry no essential elements, so the server sends null here\n ...(p.essential ?? []).map((e): ConsentAttributeElement => ({approved: !isDeny, name: e.name})),\n ...(p.optional ?? []).map(\n (e): ConsentAttributeElement => ({\n approved: !isDeny && formValues[getConsentOptionalKey(p.purposeId, e.name)] === 'true',\n name: e.name,\n }),\n ),\n ],\n purposeName: p.purposeName!,\n }),\n ),\n };\n formData['consent_decisions'] = JSON.stringify(decisions);\n }\n\n // For submit events, pass the form data to the onSubmit callback. For other event types, reset the form and call onSubmit with an empty data object.\n if (eventType.toUpperCase() === EmbeddedFlowEventType.Submit) {\n options.onSubmit(component, formData, shouldSkipValidation);\n } else {\n resetForm();\n options.onSubmit(component, {}, shouldSkipValidation);\n }\n }\n };\n\n // Render branded social login buttons for known action IDs\n\n const socialButtonClassName: string = cx(options.buttonClassName, component.classes);\n\n if (matchesSocialProvider(actionId, eventType, buttonText, 'google', authType, componentVariant)) {\n return <GoogleButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'github', authType, componentVariant)) {\n return <GitHubButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'facebook', authType, componentVariant)) {\n return <FacebookButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'microsoft', authType, componentVariant)) {\n return <MicrosoftButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'linkedin', authType, componentVariant)) {\n return <LinkedInButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'ethereum', authType, componentVariant)) {\n return (\n <SignInWithEthereumButton\n key={key}\n id={component.id}\n onClick={handleClick}\n className={socialButtonClassName}\n />\n );\n }\n if (actionId === 'prompt_mobile' \|\| eventType === 'prompt_mobile') {\n return <SmsOtpButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n\n const startIconEl: ReactElement \| null = component.startIcon ? (\n <img src={component.startIcon} alt=\"\" aria-hidden=\"true\" className={getAuthOptionIconClass()} />\n ) : null;\n\n const endIconEl: ReactElement \| null = component.endIcon ? (\n <img src={component.endIcon} alt=\"\" aria-hidden=\"true\" className={getAuthOptionIconClass()} />\n ) : null;\n\n return (\n <Button\n fullWidth\n key={key}\n id={component.id}\n onClick={handleClick}\n disabled={\n isLoading \|\|\n (!isFormValid && !shouldSkipValidation) \|\|\n options.isTimeoutDisabled \|\|\n (component as any).config?.disabled\n }\n className={cx(options.buttonClassName, component.classes)}\n data-testid=\"thunderid-signin-submit\"\n variant={component.variant?.toLowerCase() === 'primary' ? 'solid' : 'outline'}\n color={component.variant?.toLowerCase() === 'primary' ? 'primary' : 'secondary'}\n startIcon={startIconEl}\n endIcon={endIconEl}\n type={buttonType}\n >\n {buttonText \|\| 'Submit'}\n </Button>\n );\n }\n\n case EmbeddedFlowComponentType.Text: {\n const variant: any = getTypographyVariant(component.variant!);\n const textAlignClass: string = css({\n marginBottom: 2,\n textAlign:\n typeof component?.align === 'string' ? (component.align as React.CSSProperties['textAlign']) : 'left',\n });\n return (\n <Typography key={key} id={component.id} className={cx(component.classes, textAlignClass)} variant={variant}>\n {resolve(component.label)}\n </Typography>\n );\n }\n\n case EmbeddedFlowComponentType.Divider: {\n return <Divider key={key}>{resolve(component.label) \|\| ''}</Divider>;\n }\n\n case EmbeddedFlowComponentType.Select: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n // Options are pre-sanitized by flowTransformer to {value: string, label: string} format\n const selectOptions: any = (component.options \|\| []).map((opt: any) => ({\n label: typeof opt === 'string' ? opt : String(opt.label ?? opt.value ?? ''),\n value: typeof opt === 'string' ? opt : String(opt.value ?? ''),\n }));\n\n return (\n <Select\n key={key}\n id={component.id}\n name={identifier}\n label={resolve(component.label) \|\| ''}\n placeholder={resolve(component.placeholder)}\n required={component.required}\n options={selectOptions}\n value={value}\n error={error}\n onChange={(e: any): void => onInputChange(identifier, e.target.value)}\n onBlur={(): any => options.onInputBlur?.(identifier)}\n className={cx(options.inputClassName, component.classes)}\n />\n );\n }\n\n case EmbeddedFlowComponentType.DateInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] \|\| '';\n const isTouched: boolean = touchedFields[identifier] \|\| false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n return (\n <DatePicker\n key={key}\n id={component.id}\n name={identifier}\n label={resolve(component.label) \|\| ''}\n placeholder={resolve(component.placeholder)}\n required={component.required}\n dateFormat={component.dateFormat}\n value={value}\n error={error}\n onChange={(e: any): void => onInputChange(identifier, e.target.value)}\n onBlur={(): any => options.onInputBlur?.(identifier)}\n className={cx(options.inputClassName, component.classes)}\n />\n );\n }\n\n case EmbeddedFlowComponentType.OuSelect: {\n logger.warn('OU_SELECT component type is not supported. Skipping render.');\n return null;\n }\n\n case EmbeddedFlowComponentType.Block: {\n if (component.components && component.components.length > 0) {\n const formClass: string = css({\n display: 'flex',\n flexDirection: 'column',\n gap: `calc(${theme?.vars?.spacing?.unit ?? '4px'} 2)`,\n });\n\n const blockComponents: any = component.components\n .map((childComponent: any, index: any) =>\n createAuthComponentFromFlow(\n childComponent,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n authType,\n {\n ...options,\n key: childComponent.id \|\| `${component.id}_${index}`,\n },\n ),\n )\n .filter(Boolean);\n\n // The submit button's `type=\"submit\"` (and pressing Enter in a field) would\n // otherwise trigger the browser's native form submission — a GET request to\n // the current URL with all field values (including passwords) as query params.\n // Actual submission is handled entirely via `onClick`/`onSubmit` above.\n return (\n <form\n id={component.id}\n key={key}\n className={cx(component.classes, formClass)}\n onSubmit={(event: FormEvent<HTMLFormElement>): void => event.preventDefault()}\n >\n {blockComponents}\n </form>\n );\n }\n return null;\n }\n\n case EmbeddedFlowComponentType.RichText: {\n const richTextAction: EmbeddedFlowComponentAction \| undefined = component.action;\n\n const dispatchRichTextAction = (): void => {\n if (!richTextAction \|\| !options.onSubmit) {\n return;\n }\n const eventTypeValue = String(richTextAction.eventType ?? EmbeddedFlowEventType.Submit);\n const shouldSkipValidation: boolean = eventTypeValue.toUpperCase() === String(EmbeddedFlowEventType.Trigger);\n const syntheticAction: EmbeddedFlowComponent = {\n eventType: eventTypeValue,\n id: `${component.id}_action`,\n ref: richTextAction.ref,\n type: EmbeddedFlowComponentType.Action,\n };\n const formData: Record<string, string> = {};\n Object.keys(formValues).forEach((field: string) => {\n formData[field] = formValues[field];\n });\n options.onSubmit(syntheticAction, formData, shouldSkipValidation);\n };\n\n // Sentinel-anchor contract: only anchors carrying `data-action-ref` equal to\n // richTextAction.ref dispatch the action. Anchors without the sentinel (or with\n // a non-matching one) are treated as ordinary links and are ignored here.\n const isMatchingSentinelAnchor = (anchor: HTMLAnchorElement): boolean =>\n anchor.getAttribute('data-action-ref') === richTextAction?.ref;\n\n const handleRichTextClick: React.MouseEventHandler<HTMLDivElement> \| undefined = richTextAction\n ? (event: React.MouseEvent<HTMLDivElement>): void => {\n const anchor: HTMLAnchorElement \| null = (event.target as HTMLElement).closest('a');\n if (!anchor \|\| !isMatchingSentinelAnchor(anchor)) {\n return;\n }\n event.preventDefault();\n dispatchRichTextAction();\n }\n : undefined;\n\n const handleRichTextKeyDown: React.KeyboardEventHandler<HTMLDivElement> \| undefined = richTextAction\n ? (event: React.KeyboardEvent<HTMLDivElement>): void => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n const anchor: HTMLAnchorElement \| null = (event.target as HTMLElement).closest('a');\n if (!anchor \|\| !isMatchingSentinelAnchor(anchor)) {\n return;\n }\n event.preventDefault();\n dispatchRichTextAction();\n }\n : undefined;\n\n return (\n // Sentinel anchors are made keyboard-operable via the container's onKeyDown\n // (Enter/Space activate the matching anchor). Authors should ensure the anchor\n // is focusable (`href` or `tabIndex`); the click+keydown delegation covers both\n // pointer and keyboard activation once focus lands on the anchor.\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <div\n key={key}\n className={getRichTextClass()}\n onClick={handleRichTextClick}\n onKeyDown={handleRichTextKeyDown}\n // Manually sanitizes with `DOMPurify`.\n // IMPORTANT: DO NOT REMOVE OR MODIFY THIS SANITIZATION STEP.\n dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(resolveEmojiUrisInHtml(resolve(component.label)))}}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Image: {\n const explicitHeight: string = resolve(component.height?.toString());\n const explicitWidth: string = resolve(component.width?.toString());\n return (\n <ImageComponent\n key={key}\n component={\n {\n config: {\n alt: resolve(component.alt) \|\| resolve(component.label) \|\| 'Image',\n height: explicitHeight \|\| (options.inStack ? '50' : 'auto'),\n src: resolve(component.src),\n width: explicitWidth \|\| (options.inStack ? '50' : '100%'),\n },\n } as any\n }\n formErrors={undefined!}\n formValues={undefined!}\n isFormValid={false}\n isLoading={false}\n onInputChange={(): void => {\n throw new Error('Function not implemented.');\n }}\n touchedFields={undefined!}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Icon: {\n const iconName: string = component.name \|\| '';\n const IconComponent: any = flowIconRegistry[iconName];\n if (!IconComponent) {\n logger.warn(`Unknown icon name: \"${iconName}\". Skipping render.`);\n return null;\n }\n return <IconComponent key={key} size={component.size \|\| 24} color={component.color \|\| 'currentColor'} />;\n }\n\n case EmbeddedFlowComponentType.Stack: {\n const direction: string = (component as any).direction \|\| 'row';\n const gap: number = (component as any).gap ?? 2;\n const align: string = (component as any).align \|\| 'center';\n const justify: string = (component as any).justify \|\| 'flex-start';\n\n // `items` is the number of slots across the main axis and `direction` picks\n // that axis: with `row` it is the column count (items: 2 with four buttons\n // renders a 2 x 2 grid), and with `column` it is the row count and children\n // flow into further columns. Fewer than two slots keeps the flex layout, so\n // stacks authored before grid support are unaffected.\n const rawItems: string \| number \| undefined = component.items;\n const parsedItems: number =\n typeof rawItems === 'string' ? Number(rawItems) : typeof rawItems === 'number' ? rawItems : NaN;\n const items: number \| null =\n Number.isFinite(parsedItems) && Math.floor(parsedItems) >= 2\n ? Math.min(Math.floor(parsedItems), MAX_STACK_ITEMS)\n : null;\n // CSS Grid has no reverse auto-flow, so the reverse variants fall back to\n // their base axis rather than silently becoming a row.\n const isColumn: boolean = direction.startsWith('column');\n const gridJustify: string = component.justify ?? 'stretch';\n // Equal `1fr` tracks fill the container, leaving `justify-content` no free\n // space to distribute. Content-sized tracks restore it, so every justify\n // value has a visible effect while the default stays an even split.\n const track: string = gridJustify === 'stretch' ? '1fr' : 'auto';\n\n const stackStyle: CSSProperties =\n items !== null\n ? {\n alignItems: component.align ?? 'stretch',\n display: 'grid',\n gap: `${gap * 0.5}rem`,\n gridAutoFlow: isColumn ? 'column' : 'row',\n justifyContent: gridJustify,\n width: '100%',\n ...(isColumn\n ? {gridTemplateRows: `repeat(${items}, ${track})`}\n : {gridTemplateColumns: `repeat(${items}, ${track})`}),\n }\n : {\n alignItems: align,\n display: 'flex',\n flexDirection: direction as CSSProperties['flexDirection'],\n flexWrap: 'wrap',\n gap: `${gap * 0.5}rem`,\n justifyContent: justify,\n };\n\n const stackClass: string = css(stackStyle as CSSInterpolation);\n\n const stackChildren: (ReactElement \| null)[] = component.components\n ? component.components.map((childComponent: any, index: number) =>\n createAuthComponentFromFlow(\n childComponent,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n authType,\n {\n ...options,\n inStack: true,\n key: childComponent.id \|\| `${component.id}_${index}`,\n },\n ),\n )\n : [];\n\n return (\n <div key={key} id={component.id} className={cx(component.classes, stackClass)}>\n {stackChildren}\n </div>\n );\n }\n\n case EmbeddedFlowComponentType.Consent: {\n const consentPromptRawData: ConsentPromptData \| string \| undefined = options.additionalData?.['consentPrompt'];\n\n return (\n <Consent\n key={key}\n consentData={consentPromptRawData as any}\n formValues={formValues}\n onInputChange={onInputChange}\n t={options.t}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Timer: {\n const textTemplate: string = resolve((component as any).label) \|\| 'Time remaining: {time}';\n const timeoutMs: number = Number(options.additionalData?.['stepTimeout']) \|\| 0;\n const expiresIn: number = timeoutMs > 0 ? Math.max(0, Math.floor((timeoutMs - Date.now()) / 1000)) : 0;\n\n return <FlowTimer key={key} expiresIn={expiresIn} textTemplate={textTemplate} />;\n }\n\n case EmbeddedFlowComponentType.CopyableText: {\n const sourceKey: string \| undefined = (component as any).source;\n const value: string = sourceKey && options.additionalData ? String(options.additionalData[sourceKey] ?? '') : '';\n const labelText: string \| undefined = resolve((component as any).label) \|\| undefined;\n\n return <CopyableText key={key} label={labelText} value={value} />;\n }\n\n case EmbeddedFlowComponentType.KeyValueList: {\n const sourceKey: string \| undefined = component.source;\n const pairs: KeyValuePair[] = parseKeyValuePairs(\n sourceKey && options.additionalData ? options.additionalData[sourceKey] : undefined,\n ).map((pair: KeyValuePair) => ({...pair, label: resolve(pair.label)}));\n\n // An empty panel tells the user nothing, so a list with no pairs renders nothing at all.\n if (pairs.length === 0) {\n return null;\n }\n\n return <KeyValueList key={key} label={resolve(component.label) \|\| undefined} pairs={pairs} />;\n }\n\n default:\n // Gracefully handle unsupported component types by returning null\n logger.warn(`Unsupported component type: ${component.type}. Skipping render.`);\n return null;\n }\n};\n\n/*\n Processes an array of components and renders them as React elements for sign-in.\n /\nexport const renderSignInComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /* Flag to determine if the step timeline has expired /\n isTimeoutDisabled?: boolean;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signin',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/\n Processes an array of components and renders them as React elements for sign-up.\n /\nexport const renderSignUpComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signup',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/\n Processes an array of components and renders them as React elements for recovery flow.\n /\nexport const renderRecoveryComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /* Flag to determine if the step timeline has expired /\n isTimeoutDisabled?: boolean;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. /\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'recovery',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/\n Processes an array of components and renders them as React elements for invite user.\n * This is used by both InviteUser and AcceptInvite components.\n /\nexport const renderInviteUserComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /* @internal /\n _customRenderers?: ComponentRendererMap;\n /* @internal /\n _theme?: any;\n /* Additional data from the flow response /\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n /* Function to fetch child organization units for OU_SELECT components. /\n fetchOrganizationUnitChildren?: (\n parentId: string,\n limit: number,\n offset: number,\n ) => Promise<OrganizationUnitListResponse>;\n inputClassName?: string;\n /* Flow metadata for resolving {{meta(...)}} expressions at render time /\n meta?: FlowMetadataResponse \| null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' \| 'medium' \| 'large';\n /* Translation function for resolving {{t(...)}} expressions at render time /\n t?: UseTranslation['t'];\n variant?: any;\n /* Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. */\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signup',\n {\n ...options,\n key: component.id \|\| index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n"],"mappings":"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nB,QAAO;AAGT,UAAO,2CAACC;IAAuB,OAAO,QAAQ,UAAU,MAAM,IAAI;IAAkB;MAA1D,IAAmE;;EAG/F;AAEE,UAAO,KAAK,+BAA+B,UAAU,KAAK,oBAAoB;AAC9E,UAAO;;;;;;AAOb,MAAa,0BACX,YACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YAuBA,WACG,KAAK,WAAgB,UACpB,4BACE,WACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,UACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK;;;;AAKjD,MAAa,0BACX,YACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YAqBA,WACG,KAAK,WAAgB,UACpB,4BACE,WACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,UACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK;;;;AAKjD,MAAa,4BACX,YACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YAuBA,WACG,KAAK,WAAgB,UACpB,4BACE,WACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK;;;;;AAMjD,MAAa,8BACX,YACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,YA2BA,WACG,KAAK,WAAgB,UACpB,4BACE,WACA,YACA,eACA,YACA,WACA,aACA,WACA,eACA,UACA;CACE,GAAG;CACH,KAAK,UAAU,MAAM;CACtB,CACF,CACF,CACA,QAAQ,MAAyB,MAAM,KAAK"}