npm - @thunderid/react - Versions diffs - 1.12.0 → 1.14.0 - Mend

@thunderid/react 1.12.0 → 1.14.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 (79) hide show

package/dist/cjs/components/account/UserProfile/BaseUserProfile.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseUserProfile.cjs","names":["fieldsToSkip: string[]","readonlyFields: string[]","BaseUserProfile: FC<BaseUserProfileProps>","useTheme","useTranslation","toggleFieldEdit: any","getFieldPlaceholder: any","fieldLabel: any","formatLabel: any","styles: any","useStyles","ObjectDisplay: FC<{data: unknown}>","keys: any","current: any","i: any","key: any","handleFieldSave: any","fieldName: string","currentUser: any","fieldValue: any","currentUser","payload: Record<string, any>","handleFieldCancel: any","mergedMappings: Record<string, string \| string[]>","label: any","displayValue: string","displayValue","hasValues: any","isEditable: any","isEditable","currentValue: any","fieldValues: string[]","MultiInput","cx","Button","commonProps: any","field: ReactElement","TextField","DatePicker","Checkbox","hasValue: any","isFieldEditing: any","isReadonlyField: any","tempEditedUser: any","containerClasses: any","displayName: any","getDisplayName","schemaItems: Schema[]","Avatar","getMappedUserProfileValue","Typography","Divider","profileContent: any","CardPrimitive","AlertPrimitive","DialogPrimitive"],"sources":["../../../../../src/components/account/UserProfile/BaseUserProfile.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {User, withVendorCSSClassPrefix, bem, Preferences, startCase, AttributeSchema} from '@thunderid/browser';\nimport {FC, ReactElement, useState, useCallback, useEffect} from 'react';\nimport useStyles from './BaseUserProfile.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport useTranslation from '../../../hooks/useTranslation';\nimport {cx} from '../../../styles/emotion';\nimport getDisplayName from '../../../utils/getDisplayName';\nimport getMappedUserProfileValue from '../../../utils/getMappedUserProfileValue';\nimport AlertPrimitive from '../../primitives/Alert/Alert';\nimport {Avatar} from '../../primitives/Avatar/Avatar';\nimport Button from '../../primitives/Button/Button';\nimport CardPrimitive from '../../primitives/Card/Card';\nimport Checkbox from '../../primitives/Checkbox/Checkbox';\nimport DatePicker from '../../primitives/DatePicker/DatePicker';\nimport DialogPrimitive from '../../primitives/Dialog/Dialog';\nimport Divider from '../../primitives/Divider/Divider';\nimport MultiInput from '../../primitives/MultiInput/MultiInput';\nimport TextField from '../../primitives/TextField/TextField';\nimport Typography from '../../primitives/Typography/Typography';\n\ninterface ExtendedFlatSchema {\n path?: string;\n schemaId?: string;\n}\n\ninterface Schema extends ExtendedFlatSchema {\n caseExact?: boolean;\n description?: string;\n displayName?: string;\n displayOrder?: string;\n multiValued?: boolean;\n mutability?: string;\n name?: string;\n regex?: string;\n required?: boolean;\n returned?: string;\n subAttributes?: Schema[];\n type?: string;\n uniqueness?: string;\n value?: any;\n}\n\nexport interface BaseUserProfileProps {\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 cardLayout?: boolean;\n className?: string;\n displayNameAttributes?: string[];\n editable?: boolean;\n error?: string \| null;\n fallback?: ReactElement \| null;\n flattenedProfile?: User;\n hideFields?: string[];\n isLoading?: boolean;\n mode?: 'inline' \| 'popup';\n onOpenChange?: (open: boolean) => void;\n onUpdate?: (payload: any) => Promise<void>;\n open?: boolean;\n /*\n Component-level preferences to override global i18n and theme settings.\n * Preferences are deep-merged with global ones, with component preferences\n * taking precedence. Affects this component and all its descendants.\n /\n preferences?: Preferences;\n profile?: User;\n showFields?: string[];\n\n title?: string;\n userSchema?: Record<string, AttributeSchema> \| null;\n}\n\n// Fields to skip based on schema.name\nconst fieldsToSkip: string[] = [\n 'roles.default',\n 'active',\n 'groups',\n 'accountLocked',\n 'accountDisabled',\n 'oneTimePassword',\n 'userSourceId',\n 'idpType',\n 'localCredentialExists',\n 'active',\n 'ResourceType',\n 'ExternalID',\n 'MetaData',\n 'verifiedMobileNumbers',\n 'verifiedEmailAddresses',\n 'phoneNumbers.mobile',\n 'emailAddresses',\n 'preferredMFAOption',\n 'attributes',\n 'picture',\n 'isReadOnly',\n 'isReadonly',\n];\n\n// Fields that should be readonly\nconst readonlyFields: string[] = ['attributes', 'id', 'isReadOnly', 'ouId', 'username', 'sub'];\n\nconst BaseUserProfile: FC<BaseUserProfileProps> = ({\n fallback = null,\n className = '',\n cardLayout = true,\n profile,\n flattenedProfile,\n userSchema,\n mode = 'inline',\n title,\n attributeMapping = {},\n editable = true,\n onOpenChange,\n onUpdate,\n open = false,\n error = null,\n isLoading = false,\n preferences,\n showFields = [],\n hideFields = [],\n displayNameAttributes = [],\n}: BaseUserProfileProps): ReactElement \| null => {\n const {theme, colorScheme} = useTheme();\n const [editedUser, setEditedUser] = useState(flattenedProfile \|\| profile);\n const [editingFields, setEditingFields] = useState<Record<string, boolean>>({});\n const [fieldErrors, setFieldErrors] = useState<Record<string, string>>({});\n const {t} = useTranslation(preferences?.i18n);\n\n useEffect(() => {\n const nextUser = flattenedProfile ?? profile;\n if (!nextUser) return;\n\n setEditedUser((prev: any) => {\n if (!prev) return nextUser;\n\n const updated = {...nextUser};\n Object.keys(prev).forEach((key) => {\n if (editingFields[key]) {\n updated[key] = prev[key];\n }\n });\n return updated;\n });\n }, [flattenedProfile, profile, editingFields]);\n\n /\n Determines if a field should be visible based on showFields, hideFields, and fallback fieldsToSkip arrays.\n * When isSchemaBased is true, fieldsToSkip is bypassed so schema-defined fields render dynamically.\n */\n const shouldShowField = useCallback(\n (fieldName: string, isSchemaBased: boolean = false): boolean => {\n // For fallback without schema metadata, skip internal system fields\n if (!isSchemaBased && fieldsToSkip.includes(fieldName)) {\n return false;\n }\n\n // If hideFields is provided and contains this field, hide it\n if (hideFields.length > 0 && hideFields.includes(fieldName)) {\n return false;\n }\n\n // If showFields is provided and not empty, only show fields in that array\n if (showFields.length > 0) {\n return showFields.includes(fieldName);\n }\n\n return true;\n },\n [showFields, hideFields],\n );\n\n const PencilIcon = (): any => (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z\" />\n </svg>\n );\n\n const toggleFieldEdit: any = useCallback((fieldName: string) => {\n setEditingFields((prev: any) => ({\n ...prev,\n [fieldName]: !prev[fieldName],\n }));\n }, []);\n\n const getFieldPlaceholder: any = useCallback(\n (schema: Schema): string => {\n const {type, displayName, description, name} = schema;\n\n const fieldLabel: any = displayName \|\| description \|\| name \|\| 'value';\n\n switch (type) {\n case 'DATE_TIME':\n case 'STRING':\n default:\n return t('elements.fields.generic.placeholder', {field: fieldLabel.toLowerCase()});\n }\n },\n [t],\n );\n\n const formatLabel: any = useCallback(\n (key: string): string =>\n key\n .split(/(?=[A-Z])\|_/)\n .map((word: any) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())\n .join(' '),\n [],\n );\n\n const styles: any = useStyles(theme, colorScheme);\n\n const ObjectDisplay: FC<{data: unknown}> = ({data}: {data: unknown}): ReactElement \| null => {\n if (!data \|\| typeof data !== 'object') return null;\n\n return (\n <table className={styles.value}>\n <tbody>\n {Object.entries(data).map(([key, value]: any) => (\n <tr key={key}>\n <td className={styles.objectKey}>\n <strong>{formatLabel(key)}:</strong>\n </td>\n <td className={styles.objectValue}>\n {typeof value === 'object' ? <ObjectDisplay data={value} /> : String(value)}\n </td>\n </tr>\n ))}\n </tbody>\n </table>\n );\n };\n\n function set(obj: Record<string, any>, path: string, value: any): void {\n const keys: any = path.split('.');\n let current: any = obj;\n\n for (let i: any = 0; i < keys.length; i += 1) {\n const key: any = keys[i];\n\n if (i === keys.length - 1) {\n current[key] = value;\n } else {\n if (!current[key] \|\| typeof current[key] !== 'object') {\n current[key] = {};\n }\n current = current[key];\n }\n }\n }\n\n const handleFieldSave: any = useCallback(\n (schema: Schema): void => {\n if (!onUpdate \|\| !schema.name) return;\n\n const fieldName: string = schema.name;\n const currentUser: any = flattenedProfile \|\| profile;\n let fieldValue: any;\n if (editedUser && fieldName && editedUser[fieldName] !== undefined) {\n fieldValue = editedUser[fieldName];\n } else if (currentUser?.attributes?.[fieldName] !== undefined) {\n fieldValue = currentUser.attributes[fieldName];\n } else if (flattenedProfile?.[fieldName] !== undefined) {\n fieldValue = flattenedProfile[fieldName];\n } else {\n fieldValue = '';\n }\n\n if (Array.isArray(fieldValue)) {\n fieldValue = fieldValue.filter((v: any) => v !== undefined && v !== null && v !== '');\n }\n\n const strVal = String(fieldValue ?? '').trim();\n const fieldLabel = schema.displayName \|\| (schema.name ? startCase(schema.name) : 'Field');\n\n // 1. Required validation\n if (schema.required && !strVal) {\n setFieldErrors((prev: Record<string, string>) => ({\n ...prev,\n [fieldName]: t('validations.required.field.error'),\n }));\n return;\n }\n\n // 2. Regex validation\n if (schema.regex && strVal) {\n try {\n const reg = new RegExp(schema.regex);\n if (!reg.test(strVal)) {\n setFieldErrors((prev: Record<string, string>) => ({\n ...prev,\n [fieldName]: t('validation.pattern.invalid'),\n }));\n return;\n }\n } catch (e) {\n // ignore invalid regex syntax safely\n }\n }\n\n // Clear field error if valid\n setFieldErrors((prev: Record<string, string>) => {\n const next = {...prev};\n delete next[fieldName];\n return next;\n });\n\n let payload: Record<string, any> = {};\n set(payload, fieldName, fieldValue);\n\n onUpdate(payload);\n\n toggleFieldEdit(fieldName);\n },\n [editedUser, flattenedProfile, profile, onUpdate, toggleFieldEdit, t],\n );\n\n const handleFieldCancel: any = useCallback(\n (fieldName: string) => {\n const currentUser: any = flattenedProfile \|\| profile;\n const initialVal = currentUser?.attributes?.[fieldName] ?? currentUser?.[fieldName];\n setEditedUser((prev: any) => ({\n ...prev,\n [fieldName]: initialVal,\n }));\n setFieldErrors((prev: Record<string, string>) => {\n const next = {...prev};\n delete next[fieldName];\n return next;\n });\n toggleFieldEdit(fieldName);\n },\n [flattenedProfile, profile, toggleFieldEdit],\n );\n\n const defaultAttributeMappings: Record<string, string \| string[]> = {\n email: ['emails', 'email'],\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 const renderSchemaField = (\n schema: Schema,\n isEditing: boolean,\n onEditValue?: (value: any) => void,\n onStartEdit?: () => void,\n ): ReactElement \| null => {\n if (!schema) return null;\n const {value, displayName, description, name, type, required, mutability, subAttributes, multiValued} = schema;\n const label: any = displayName \|\| description \|\| (name ? startCase(name) : '');\n\n if (subAttributes && Array.isArray(subAttributes)) {\n return (\n <>\n {subAttributes.map((subAttr: any, index: any) => {\n let displayValue: string;\n if (Array.isArray(subAttr.value)) {\n displayValue = subAttr.value\n .map((item: any) => (typeof item === 'object' ? JSON.stringify(item) : String(item)))\n .join(', ');\n } else if (typeof subAttr.value === 'object') {\n displayValue = JSON.stringify(subAttr.value);\n } else {\n displayValue = String(subAttr.value);\n }\n\n return (\n <div key={index} className={styles.field}>\n <span className={styles.label}>{subAttr.displayName \|\| subAttr.description \|\| ''}</span>\n <div className={styles.value}>{displayValue}</div>\n </div>\n );\n })}\n </>\n );\n }\n\n if (Array.isArray(value) \|\| multiValued) {\n const hasValues: any = Array.isArray(value)\n ? value.length > 0\n : value !== undefined && value !== null && value !== '';\n const isEditable: any = editable && mutability !== 'READ_ONLY' && !readonlyFields.includes(name \|\| '');\n\n if (isEditing && onEditValue && isEditable) {\n let currentValue: any;\n if (editedUser && name && editedUser[name] !== undefined) {\n currentValue = editedUser[name];\n } else if (flattenedProfile && name && flattenedProfile[name] !== undefined) {\n currentValue = flattenedProfile[name];\n } else {\n currentValue = value;\n }\n\n let fieldValues: string[];\n if (Array.isArray(currentValue)) {\n fieldValues = currentValue.map(String);\n } else if (currentValue !== undefined && currentValue !== null && currentValue !== '') {\n fieldValues = [String(currentValue)];\n } else {\n fieldValues = [];\n }\n\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={styles.value}>\n <MultiInput\n values={fieldValues}\n onChange={(newValues: any): void => {\n if (multiValued \|\| Array.isArray(currentValue)) {\n onEditValue(newValues);\n } else {\n onEditValue(newValues[0] \|\| '');\n }\n }}\n placeholder={getFieldPlaceholder(schema)}\n fieldType={type as 'STRING' \| 'DATE_TIME' \| 'BOOLEAN'}\n type={type === 'DATE_TIME' ? 'date' : 'text'}\n required={required}\n />\n </div>\n </>\n );\n }\n\n let displayValue: string;\n if (hasValues) {\n if (Array.isArray(value)) {\n displayValue = value\n .map((item: any) => (typeof item === 'object' ? JSON.stringify(item) : String(item)))\n .join(', ');\n } else {\n displayValue = String(value);\n }\n } else if (isEditable) {\n displayValue = getFieldPlaceholder(schema);\n } else {\n displayValue = '-';\n }\n\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={cx(styles.value, !hasValues ? styles.valuePlaceholder : '')}>\n {!hasValues && isEditable && onStartEdit ? (\n <Button\n onClick={onStartEdit}\n variant=\"text\"\n color=\"secondary\"\n size=\"small\"\n title=\"Click to edit\"\n className={styles.editButton}\n >\n {displayValue}\n </Button>\n ) : (\n displayValue\n )}\n </div>\n </>\n );\n }\n if (type === 'COMPLEX' && typeof value === 'object') {\n return <ObjectDisplay data={value} />;\n }\n\n if (isEditing && onEditValue && mutability !== 'READ_ONLY' && !readonlyFields.includes(name \|\| '')) {\n let fieldValue: any;\n if (editedUser && name && editedUser[name] !== undefined) {\n fieldValue = editedUser[name];\n } else if (flattenedProfile && name && flattenedProfile[name] !== undefined) {\n fieldValue = flattenedProfile[name];\n } else {\n fieldValue = value \|\| '';\n }\n\n const commonProps: any = {\n label: undefined,\n onChange: (e: any) => onEditValue(e.target ? e.target.value : e),\n placeholder: getFieldPlaceholder(schema),\n required,\n value: fieldValue,\n // Removed inline style, use .styles.ts for marginBottom if needed\n };\n let field: ReactElement;\n switch (type) {\n case 'STRING':\n field = <TextField {...commonProps} />;\n break;\n case 'DATE_TIME':\n field = <DatePicker {...commonProps} />;\n break;\n case 'BOOLEAN':\n field = (\n <Checkbox\n {...commonProps}\n checked={!!fieldValue}\n onChange={(e: any): void => {\n onEditValue(e.target.checked);\n }}\n />\n );\n break;\n case 'COMPLEX':\n field = (\n <textarea\n value={fieldValue}\n onChange={(e: any): void => onEditValue(e.target.value)}\n placeholder={getFieldPlaceholder(schema)}\n required={required}\n className={styles.complexTextarea}\n />\n );\n break;\n default:\n field = <TextField {...commonProps} />;\n }\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={styles.value}>{field}</div>\n </>\n );\n }\n\n const hasValue: any = value !== undefined && value !== null && value !== '';\n const isEditable: any = editable && mutability !== 'READ_ONLY' && !readonlyFields.includes(name \|\| '');\n\n let displayValue: string;\n if (hasValue) {\n displayValue = String(value);\n } else if (isEditable) {\n displayValue = getFieldPlaceholder(schema);\n } else {\n displayValue = '-';\n }\n\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={cx(styles.value, !hasValue ? styles.valuePlaceholder : '')}>\n {!hasValue && isEditable && onStartEdit ? (\n <Button\n onClick={onStartEdit}\n variant=\"text\"\n color=\"secondary\"\n size=\"small\"\n title=\"Click to edit\"\n className={styles.editButton}\n >\n {displayValue}\n </Button>\n ) : (\n displayValue\n )}\n </div>\n </>\n );\n };\n\n const renderUserInfo = (schema: Schema): any => {\n if (!schema?.name) return null;\n\n const hasValue: any = schema.value !== undefined && schema.value !== '' && schema.value !== null;\n const isFieldEditing: any = editingFields[schema.name];\n const isReadonlyField: any = readonlyFields.includes(schema.name);\n\n const shouldShow: any = hasValue \|\| isFieldEditing \|\| (editable && schema.mutability === 'READ_WRITE');\n\n if (!shouldShow) {\n return null;\n }\n\n return (\n <div className={styles.field}>\n <div className={styles.fieldInner}>\n {renderSchemaField(\n schema,\n isFieldEditing,\n (value: any) => {\n const tempEditedUser: any = {...editedUser};\n tempEditedUser[schema.name!] = value;\n setEditedUser(tempEditedUser);\n },\n () => toggleFieldEdit(schema.name),\n )}\n {fieldErrors[schema.name] && (\n <div style={{color: '#d32f2f', fontSize: '0.8rem', marginTop: '4px', fontWeight: 500}}>\n {fieldErrors[schema.name]}\n </div>\n )}\n </div>\n {editable && schema.mutability !== 'READ_ONLY' && !isReadonlyField && (\n <div className={styles.fieldActions}>\n {isFieldEditing && (\n <>\n <Button size=\"small\" color=\"primary\" variant=\"solid\" onClick={(): any => handleFieldSave(schema)}>\n Save\n </Button>\n <Button\n size=\"small\"\n color=\"secondary\"\n variant=\"solid\"\n onClick={(): any => handleFieldCancel(schema.name)}\n >\n Cancel\n </Button>\n </>\n )}\n {!isFieldEditing && hasValue && (\n <Button\n size=\"small\"\n color=\"tertiary\"\n variant=\"icon\"\n onClick={(): any => toggleFieldEdit(schema.name)}\n title=\"Edit\"\n className={styles.editButton}\n >\n <PencilIcon />\n </Button>\n )}\n </div>\n )}\n </div>\n );\n };\n\n if (!profile && !flattenedProfile) {\n return fallback;\n }\n\n const containerClasses: any = cx(\n styles.root,\n cardLayout ? styles.card : '',\n withVendorCSSClassPrefix('user-profile'),\n className,\n );\n\n const currentUser: any = flattenedProfile \|\| profile;\n\n const renderProfileContent = (): any => {\n if (!currentUser) return null;\n\n const displayName: any = getDisplayName(mergedMappings, profile!, displayNameAttributes);\n\n let schemaItems: Schema[] = [];\n\n if (userSchema && typeof userSchema === 'object' && Object.keys(userSchema).length > 0) {\n schemaItems = Object.entries(userSchema)\n .filter(([key, metaAttr]: [string, AttributeSchema]) => {\n if (metaAttr?.credential) return false;\n return shouldShowField(key, true);\n })\n .map(([key, metaAttr]: [string, AttributeSchema]) => {\n const val = editedUser?.[key] ?? currentUser?.attributes?.[key] ?? currentUser?.[key] ?? '';\n\n const isReadonly =\n metaAttr.readOnly === true \|\| metaAttr.mutability === 'READ_ONLY' \|\| readonlyFields.includes(key);\n\n return {\n name: key,\n displayName: metaAttr.displayName ?? (key ? startCase(key) : ''),\n type: (metaAttr.type ?? 'STRING').toUpperCase(),\n regex: metaAttr.regex,\n required: !!metaAttr.required,\n mutability: isReadonly ? 'READ_ONLY' : 'READ_WRITE',\n value: val,\n };\n });\n } else {\n const profileEntries: any = Object.entries(currentUser)\n .filter(([key, value]: [string, any]) => {\n if (!shouldShowField(key)) return false;\n\n return value !== undefined && value !== '' && value !== null;\n })\n .sort(([a]: [string, ...any[]], [b]: [string, ...any[]]) => a.localeCompare(b));\n\n schemaItems = profileEntries.map(([key, value]: any) => {\n const isReadonly = readonlyFields.includes(key);\n return {\n name: key,\n displayName: startCase(key),\n mutability: isReadonly ? 'READ_ONLY' : 'READ_WRITE',\n value,\n };\n });\n }\n\n return (\n <>\n <div className={styles.profileSummary}>\n <Avatar\n imageUrl={getMappedUserProfileValue('picture', mergedMappings, currentUser)}\n name={displayName}\n size={70}\n alt={`${displayName}'s avatar`}\n isLoading={isLoading}\n />\n <Typography variant=\"h3\" fontWeight=\"medium\">\n {displayName}\n </Typography>\n {getMappedUserProfileValue('email', mergedMappings, currentUser) && (\n <Typography variant=\"body2\" color=\"textSecondary\">\n {getMappedUserProfileValue('email', mergedMappings, currentUser)}\n </Typography>\n )}\n </div>\n <Divider />\n {schemaItems.map((schemaWithValue: Schema) => (\n <div key={schemaWithValue.name} className={styles.info}>\n {renderUserInfo(schemaWithValue)}\n </div>\n ))}\n </>\n );\n };\n\n const profileContent: any = (\n <CardPrimitive className={containerClasses}>\n {error && (\n <AlertPrimitive\n variant=\"error\"\n className={cx(withVendorCSSClassPrefix(bem('user-profile', 'alert')), styles.alert)}\n >\n <AlertPrimitive.Title>{t('errors.heading') \|\| 'Error'}</AlertPrimitive.Title>\n <AlertPrimitive.Description>{error}</AlertPrimitive.Description>\n </AlertPrimitive>\n )}\n <div className={styles.infoContainer}>{renderProfileContent()}</div>\n </CardPrimitive>\n );\n\n if (mode === 'popup') {\n return (\n <DialogPrimitive open={open} onOpenChange={onOpenChange}>\n <DialogPrimitive.Content>\n <DialogPrimitive.Heading>{title ?? t('user.profile.heading')}</DialogPrimitive.Heading>\n <div className={styles.popup}>{profileContent}</div>\n </DialogPrimitive.Content>\n </DialogPrimitive>\n );\n }\n\n return profileContent;\n};\n\nexport default BaseUserProfile;\n"],"mappings":"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"}
1	+ {"version":3,"file":"BaseUserProfile.cjs","names":["fieldsToSkip: string[]","AttributeVerificationConstants","readonlyFields: string[]","BaseUserProfile: FC<BaseUserProfileProps>","useTheme","useTranslation","reportedVerifiedAttributes: Record<string, VerifiedAttribute> \| undefined","supportsVerification: boolean","verifiedAttributes: Record<string, VerifiedAttribute>","storedUser: User \| undefined","storedValue: unknown","toggleFieldEdit: any","getFieldPlaceholder: any","fieldLabel: any","formatLabel: any","styles: any","useStyles","verificationStyles: Record<string, string>","ObjectDisplay: FC<{data: unknown}>","keys: any","current: any","i: any","key: any","handleFieldSave: any","fieldName: string","currentUser: any","fieldValue: any","currentUser","payload: Record<string, any>","next: Record<string, boolean>","savedUser: User \| undefined","handleFieldCancel: any","mergedMappings: Record<string, string \| string[]>","label: any","displayValue: string","displayValue","hasValues: any","isEditable: any","isEditable","currentValue: any","fieldValues: string[]","MultiInput","cx","Button","commonProps: any","field: ReactElement","TextField","DatePicker","Checkbox","hasValue: any","verification: VerifiedAttribute \| undefined","verifiedAtTitle: string \| undefined","verifiedAt: Date","CircleCheck","CircleAlert","attributeDisplayName: string","panel: ReactElement","DialogPrimitive","isFieldEditing: any","isReadonlyField: any","showsVerificationStatus: boolean","canVerify: boolean","tempEditedUser: any","containerClasses: any","displayName: any","getDisplayName","schemaItems: Schema[]","AlertPrimitive","Avatar","getMappedUserProfileValue","Typography","Divider","profileContent: any","CardPrimitive"],"sources":["../../../../../src/components/account/UserProfile/BaseUserProfile.tsx"],"sourcesContent":["// Copyright 2025-2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n User,\n withVendorCSSClassPrefix,\n bem,\n Preferences,\n startCase,\n AttributeSchema,\n AttributeVerificationConstants,\n VerifiedAttribute,\n getVerifiedAttributes,\n isVerifiableAttribute,\n} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useState, useCallback, useEffect, useMemo} from 'react';\nimport useStyles from './BaseUserProfile.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport useTranslation from '../../../hooks/useTranslation';\nimport {cx} from '../../../styles/emotion';\nimport getDisplayName from '../../../utils/getDisplayName';\nimport getMappedUserProfileValue from '../../../utils/getMappedUserProfileValue';\nimport AlertPrimitive from '../../primitives/Alert/Alert';\nimport {Avatar} from '../../primitives/Avatar/Avatar';\nimport Button from '../../primitives/Button/Button';\nimport CardPrimitive from '../../primitives/Card/Card';\nimport Checkbox from '../../primitives/Checkbox/Checkbox';\nimport DatePicker from '../../primitives/DatePicker/DatePicker';\nimport DialogPrimitive from '../../primitives/Dialog/Dialog';\nimport Divider from '../../primitives/Divider/Divider';\nimport {CircleAlert, CircleCheck} from '../../primitives/Icons';\nimport MultiInput from '../../primitives/MultiInput/MultiInput';\nimport TextField from '../../primitives/TextField/TextField';\nimport Typography from '../../primitives/Typography/Typography';\n\ninterface ExtendedFlatSchema {\n path?: string;\n schemaId?: string;\n}\n\ninterface Schema extends ExtendedFlatSchema {\n caseExact?: boolean;\n description?: string;\n displayName?: string;\n displayOrder?: string;\n multiValued?: boolean;\n mutability?: string;\n name?: string;\n regex?: string;\n required?: boolean;\n returned?: string;\n subAttributes?: Schema[];\n type?: string;\n uniqueness?: string;\n value?: any;\n}\n\nexport interface BaseUserProfileProps {\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 cardLayout?: boolean;\n className?: string;\n displayNameAttributes?: string[];\n editable?: boolean;\n error?: string \| null;\n fallback?: ReactElement \| null;\n flattenedProfile?: User;\n hideFields?: string[];\n isLoading?: boolean;\n mode?: 'inline' \| 'popup';\n onOpenChange?: (open: boolean) => void;\n onUpdate?: (payload: any) => Promise<void>;\n open?: boolean;\n /*\n Component-level preferences to override global i18n and theme settings.\n * Preferences are deep-merged with global ones, with component preferences\n * taking precedence. Affects this component and all its descendants.\n /\n preferences?: Preferences;\n profile?: User;\n /\n Renders the verification panel for an attribute. When omitted, or when the profile is not\n * editable, verification statuses are shown without a Verify action.\n /\n renderVerification?: (props: BaseUserProfileVerificationRenderProps) => ReactNode;\n showFields?: string[];\n\n title?: string;\n userSchema?: Record<string, AttributeSchema> \| null;\n}\n\n/\n Props passed to `renderVerification`.\n /\nexport interface BaseUserProfileVerificationRenderProps {\n /\n Name of the attribute to verify.\n /\n attribute: string;\n /\n Label of the attribute.\n /\n attributeDisplayName: string;\n /\n Closes the panel.\n /\n onCancel: () => void;\n /\n Closes the panel and confirms the recorded verification.\n /\n onComplete: () => void;\n}\n\n// Fields to skip based on schema.name\nconst fieldsToSkip: string[] = [\n 'roles.default',\n 'active',\n 'groups',\n 'accountLocked',\n 'accountDisabled',\n 'oneTimePassword',\n 'userSourceId',\n 'idpType',\n 'localCredentialExists',\n 'active',\n 'ResourceType',\n 'ExternalID',\n 'MetaData',\n 'verifiedMobileNumbers',\n 'verifiedEmailAddresses',\n 'phoneNumbers.mobile',\n 'emailAddresses',\n 'preferredMFAOption',\n 'attributes',\n 'picture',\n 'isReadOnly',\n 'isReadonly',\n AttributeVerificationConstants.VERIFIED_ATTRIBUTES_KEY,\n];\n\n// Fields that should be readonly\nconst readonlyFields: string[] = ['attributes', 'id', 'isReadOnly', 'ouId', 'username', 'sub'];\n\nconst isStatusType = (type?: string): boolean =>\n !!type && AttributeVerificationConstants.VERIFIABLE_ATTRIBUTE_TYPES.includes(type.toLowerCase());\n\nconst isVerifiedAfterSave = (type?: string): boolean =>\n !!type && AttributeVerificationConstants.VERIFY_AFTER_SAVE_ATTRIBUTE_TYPES.includes(type.toLowerCase());\n\nconst BaseUserProfile: FC<BaseUserProfileProps> = ({\n fallback = null,\n className = '',\n cardLayout = true,\n profile,\n flattenedProfile,\n userSchema,\n mode = 'inline',\n title,\n attributeMapping = {},\n editable = true,\n onOpenChange,\n onUpdate,\n open = false,\n error = null,\n isLoading = false,\n preferences,\n showFields = [],\n hideFields = [],\n displayNameAttributes = [],\n renderVerification = undefined,\n}: BaseUserProfileProps): ReactElement \| null => {\n const {theme, colorScheme} = useTheme();\n const [editedUser, setEditedUser] = useState(flattenedProfile \|\| profile);\n const [editingFields, setEditingFields] = useState<Record<string, boolean>>({});\n const [fieldErrors, setFieldErrors] = useState<Record<string, string>>({});\n // Attribute whose verification panel is open.\n const [verifyingField, setVerifyingField] = useState<string \| null>(null);\n // Label of the attribute whose verification was just recorded.\n const [verifiedNotice, setVerifiedNotice] = useState<string \| null>(null);\n // A saved attribute to verify once the profile reflects the change.\n const [pendingVerification, setPendingVerification] = useState<{name: string; previousValue: unknown} \| null>(null);\n // Fields whose save is in flight; their stored value is about to change.\n const [savingFields, setSavingFields] = useState<Record<string, boolean>>({});\n const {t, currentLanguage} = useTranslation(preferences?.i18n);\n\n const reportedVerifiedAttributes: Record<string, VerifiedAttribute> \| undefined = useMemo(\n () => getVerifiedAttributes(profile ?? flattenedProfile),\n [profile, flattenedProfile],\n );\n // A server without verification support omits the field, so no status is known.\n const supportsVerification: boolean = reportedVerifiedAttributes !== undefined;\n const verifiedAttributes: Record<string, VerifiedAttribute> = useMemo(\n () => reportedVerifiedAttributes ?? {},\n [reportedVerifiedAttributes],\n );\n\n useEffect(() => {\n if (!pendingVerification) return;\n\n if (error) {\n setPendingVerification(null);\n return;\n }\n\n const {name, previousValue} = pendingVerification;\n const storedUser: User \| undefined = flattenedProfile ?? profile;\n const storedAttributes: Record<string, unknown> \| undefined = storedUser?.['attributes'] as\n \| Record<string, unknown>\n \| undefined;\n const storedValue: unknown = storedAttributes?.[name] ?? storedUser?.[name];\n\n if (storedValue === previousValue) return;\n\n // An absent verification record leaves the status unknown, so nothing opens on that basis.\n if (\n supportsVerification &&\n typeof storedValue === 'string' &&\n storedValue.trim() !== '' &&\n !verifiedAttributes[name]\n ) {\n setVerifiedNotice(null);\n setVerifyingField(name);\n }\n setPendingVerification(null);\n }, [pendingVerification, flattenedProfile, profile, error, verifiedAttributes, supportsVerification]);\n\n useEffect(() => {\n const nextUser = flattenedProfile ?? profile;\n if (!nextUser) return;\n\n setEditedUser((prev: any) => {\n if (!prev) return nextUser;\n\n const updated = {...nextUser};\n Object.keys(prev).forEach((key) => {\n if (editingFields[key]) {\n updated[key] = prev[key];\n }\n });\n return updated;\n });\n }, [flattenedProfile, profile, editingFields]);\n\n /\n Determines if a field should be visible based on showFields, hideFields, and fallback fieldsToSkip arrays.\n * When isSchemaBased is true, fieldsToSkip is bypassed so schema-defined fields render dynamically.\n /\n const shouldShowField = useCallback(\n (fieldName: string, isSchemaBased: boolean = false): boolean => {\n // For fallback without schema metadata, skip internal system fields\n if (!isSchemaBased && fieldsToSkip.includes(fieldName)) {\n return false;\n }\n\n // If hideFields is provided and contains this field, hide it\n if (hideFields.length > 0 && hideFields.includes(fieldName)) {\n return false;\n }\n\n // If showFields is provided and not empty, only show fields in that array\n if (showFields.length > 0) {\n return showFields.includes(fieldName);\n }\n\n return true;\n },\n [showFields, hideFields],\n );\n\n const PencilIcon = (): any => (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z\" />\n </svg>\n );\n\n const toggleFieldEdit: any = useCallback((fieldName: string) => {\n setEditingFields((prev: any) => ({\n ...prev,\n [fieldName]: !prev[fieldName],\n }));\n }, []);\n\n const getFieldPlaceholder: any = useCallback(\n (schema: Schema): string => {\n const {type, displayName, description, name} = schema;\n\n const fieldLabel: any = displayName \|\| description \|\| name \|\| 'value';\n\n switch (type) {\n case 'DATE_TIME':\n case 'STRING':\n default:\n return t('elements.fields.generic.placeholder', {field: fieldLabel.toLowerCase()});\n }\n },\n [t],\n );\n\n const formatLabel: any = useCallback(\n (key: string): string =>\n key\n .split(/(?=[A-Z])\|_/)\n .map((word: any) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())\n .join(' '),\n [],\n );\n\n const styles: any = useStyles(theme, colorScheme);\n // Typed view of the same classes for the verification markup.\n const verificationStyles: Record<string, string> = styles as Record<string, string>;\n\n const ObjectDisplay: FC<{data: unknown}> = ({data}: {data: unknown}): ReactElement \| null => {\n if (!data \|\| typeof data !== 'object') return null;\n\n return (\n <table className={styles.value}>\n <tbody>\n {Object.entries(data).map(([key, value]: any) => (\n <tr key={key}>\n <td className={styles.objectKey}>\n <strong>{formatLabel(key)}:</strong>\n </td>\n <td className={styles.objectValue}>\n {typeof value === 'object' ? <ObjectDisplay data={value} /> : String(value)}\n </td>\n </tr>\n ))}\n </tbody>\n </table>\n );\n };\n\n function set(obj: Record<string, any>, path: string, value: any): void {\n const keys: any = path.split('.');\n let current: any = obj;\n\n for (let i: any = 0; i < keys.length; i += 1) {\n const key: any = keys[i];\n\n if (i === keys.length - 1) {\n current[key] = value;\n } else {\n if (!current[key] \|\| typeof current[key] !== 'object') {\n current[key] = {};\n }\n current = current[key];\n }\n }\n }\n\n const handleFieldSave: any = useCallback(\n (schema: Schema): void => {\n if (!onUpdate \|\| !schema.name) return;\n\n const fieldName: string = schema.name;\n const currentUser: any = flattenedProfile \|\| profile;\n let fieldValue: any;\n if (editedUser && fieldName && editedUser[fieldName] !== undefined) {\n fieldValue = editedUser[fieldName];\n } else if (currentUser?.attributes?.[fieldName] !== undefined) {\n fieldValue = currentUser.attributes[fieldName];\n } else if (flattenedProfile?.[fieldName] !== undefined) {\n fieldValue = flattenedProfile[fieldName];\n } else {\n fieldValue = '';\n }\n\n if (Array.isArray(fieldValue)) {\n fieldValue = fieldValue.filter((v: any) => v !== undefined && v !== null && v !== '');\n }\n\n const strVal = String(fieldValue ?? '').trim();\n const fieldLabel = schema.displayName \|\| (schema.name ? startCase(schema.name) : 'Field');\n\n // 1. Required validation\n if (schema.required && !strVal) {\n setFieldErrors((prev: Record<string, string>) => ({\n ...prev,\n [fieldName]: t('validations.required.field.error'),\n }));\n return;\n }\n\n // 2. Regex validation\n if (schema.regex && strVal) {\n try {\n const reg = new RegExp(schema.regex);\n if (!reg.test(strVal)) {\n setFieldErrors((prev: Record<string, string>) => ({\n ...prev,\n [fieldName]: t('validation.pattern.invalid'),\n }));\n return;\n }\n } catch (e) {\n // ignore invalid regex syntax safely\n }\n }\n\n // Clear field error if valid\n setFieldErrors((prev: Record<string, string>) => {\n const next = {...prev};\n delete next[fieldName];\n return next;\n });\n\n let payload: Record<string, any> = {};\n set(payload, fieldName, fieldValue);\n\n setSavingFields((prev: Record<string, boolean>) => ({...prev, [fieldName]: true}));\n // A failed save is reported through `error`; it only drops the verification it would have opened.\n Promise.resolve(onUpdate(payload))\n .catch((): void => setPendingVerification(null))\n .finally((): void =>\n setSavingFields((prev: Record<string, boolean>) => {\n const next: Record<string, boolean> = {...prev};\n delete next[fieldName];\n return next;\n }),\n );\n\n toggleFieldEdit(fieldName);\n\n // Offer verification once a changed, verifiable value is saved.\n const savedUser: User \| undefined = flattenedProfile ?? profile;\n const savedAttributes: Record<string, unknown> \| undefined = savedUser?.['attributes'] as\n \| Record<string, unknown>\n \| undefined;\n const storedValue: unknown = savedAttributes?.[fieldName] ?? savedUser?.[fieldName];\n if (\n renderVerification &&\n isVerifiedAfterSave(schema.type) &&\n isVerifiableAttribute(userSchema, fieldName) &&\n typeof fieldValue === 'string' &&\n fieldValue.trim() !== '' &&\n fieldValue !== storedValue\n ) {\n setPendingVerification({name: fieldName, previousValue: storedValue});\n } else {\n setPendingVerification(null);\n }\n },\n [editedUser, flattenedProfile, profile, onUpdate, toggleFieldEdit, t, renderVerification, userSchema],\n );\n\n const handleFieldCancel: any = useCallback(\n (fieldName: string) => {\n const currentUser: any = flattenedProfile \|\| profile;\n const initialVal = currentUser?.attributes?.[fieldName] ?? currentUser?.[fieldName];\n setEditedUser((prev: any) => ({\n ...prev,\n [fieldName]: initialVal,\n }));\n setFieldErrors((prev: Record<string, string>) => {\n const next = {...prev};\n delete next[fieldName];\n return next;\n });\n toggleFieldEdit(fieldName);\n },\n [flattenedProfile, profile, toggleFieldEdit],\n );\n\n const defaultAttributeMappings: Record<string, string \| string[]> = {\n email: ['emails', 'email'],\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 const renderSchemaField = (\n schema: Schema,\n isEditing: boolean,\n onEditValue?: (value: any) => void,\n onStartEdit?: () => void,\n ): ReactElement \| null => {\n if (!schema) return null;\n const {value, displayName, description, name, type, required, mutability, subAttributes, multiValued} = schema;\n const label: any = displayName \|\| description \|\| (name ? startCase(name) : '');\n\n if (subAttributes && Array.isArray(subAttributes)) {\n return (\n <>\n {subAttributes.map((subAttr: any, index: any) => {\n let displayValue: string;\n if (Array.isArray(subAttr.value)) {\n displayValue = subAttr.value\n .map((item: any) => (typeof item === 'object' ? JSON.stringify(item) : String(item)))\n .join(', ');\n } else if (typeof subAttr.value === 'object') {\n displayValue = JSON.stringify(subAttr.value);\n } else {\n displayValue = String(subAttr.value);\n }\n\n return (\n <div key={index} className={styles.field}>\n <span className={styles.label}>{subAttr.displayName \|\| subAttr.description \|\| ''}</span>\n <div className={styles.value}>{displayValue}</div>\n </div>\n );\n })}\n </>\n );\n }\n\n if (Array.isArray(value) \|\| multiValued) {\n const hasValues: any = Array.isArray(value)\n ? value.length > 0\n : value !== undefined && value !== null && value !== '';\n const isEditable: any = editable && mutability !== 'READ_ONLY' && !readonlyFields.includes(name \|\| '');\n\n if (isEditing && onEditValue && isEditable) {\n let currentValue: any;\n if (editedUser && name && editedUser[name] !== undefined) {\n currentValue = editedUser[name];\n } else if (flattenedProfile && name && flattenedProfile[name] !== undefined) {\n currentValue = flattenedProfile[name];\n } else {\n currentValue = value;\n }\n\n let fieldValues: string[];\n if (Array.isArray(currentValue)) {\n fieldValues = currentValue.map(String);\n } else if (currentValue !== undefined && currentValue !== null && currentValue !== '') {\n fieldValues = [String(currentValue)];\n } else {\n fieldValues = [];\n }\n\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={styles.value}>\n <MultiInput\n values={fieldValues}\n onChange={(newValues: any): void => {\n if (multiValued \|\| Array.isArray(currentValue)) {\n onEditValue(newValues);\n } else {\n onEditValue(newValues[0] \|\| '');\n }\n }}\n placeholder={getFieldPlaceholder(schema)}\n fieldType={type as 'STRING' \| 'DATE_TIME' \| 'BOOLEAN'}\n type={type === 'DATE_TIME' ? 'date' : 'text'}\n required={required}\n />\n </div>\n </>\n );\n }\n\n let displayValue: string;\n if (hasValues) {\n if (Array.isArray(value)) {\n displayValue = value\n .map((item: any) => (typeof item === 'object' ? JSON.stringify(item) : String(item)))\n .join(', ');\n } else {\n displayValue = String(value);\n }\n } else if (isEditable) {\n displayValue = getFieldPlaceholder(schema);\n } else {\n displayValue = '-';\n }\n\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={cx(styles.value, !hasValues ? styles.valuePlaceholder : '')}>\n {!hasValues && isEditable && onStartEdit ? (\n <Button\n onClick={onStartEdit}\n variant=\"text\"\n color=\"secondary\"\n size=\"small\"\n title=\"Click to edit\"\n className={styles.editButton}\n >\n {displayValue}\n </Button>\n ) : (\n displayValue\n )}\n </div>\n </>\n );\n }\n if (type === 'COMPLEX' && typeof value === 'object') {\n return <ObjectDisplay data={value} />;\n }\n\n if (isEditing && onEditValue && mutability !== 'READ_ONLY' && !readonlyFields.includes(name \|\| '')) {\n let fieldValue: any;\n if (editedUser && name && editedUser[name] !== undefined) {\n fieldValue = editedUser[name];\n } else if (flattenedProfile && name && flattenedProfile[name] !== undefined) {\n fieldValue = flattenedProfile[name];\n } else {\n fieldValue = value \|\| '';\n }\n\n const commonProps: any = {\n label: undefined,\n onChange: (e: any) => onEditValue(e.target ? e.target.value : e),\n placeholder: getFieldPlaceholder(schema),\n required,\n value: fieldValue,\n // Removed inline style, use .styles.ts for marginBottom if needed\n };\n let field: ReactElement;\n switch (type) {\n case 'STRING':\n field = <TextField {...commonProps} />;\n break;\n case 'DATE_TIME':\n field = <DatePicker {...commonProps} />;\n break;\n case 'BOOLEAN':\n field = (\n <Checkbox\n {...commonProps}\n checked={!!fieldValue}\n onChange={(e: any): void => {\n onEditValue(e.target.checked);\n }}\n />\n );\n break;\n case 'COMPLEX':\n field = (\n <textarea\n value={fieldValue}\n onChange={(e: any): void => onEditValue(e.target.value)}\n placeholder={getFieldPlaceholder(schema)}\n required={required}\n className={styles.complexTextarea}\n />\n );\n break;\n default:\n field = <TextField {...commonProps} />;\n }\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={styles.value}>{field}</div>\n </>\n );\n }\n\n const hasValue: any = value !== undefined && value !== null && value !== '';\n const isEditable: any = editable && mutability !== 'READ_ONLY' && !readonlyFields.includes(name \|\| '');\n\n let displayValue: string;\n if (hasValue) {\n displayValue = String(value);\n } else if (isEditable) {\n displayValue = getFieldPlaceholder(schema);\n } else {\n displayValue = '-';\n }\n\n return (\n <>\n <span className={styles.label}>{label}</span>\n <div className={cx(styles.value, !hasValue ? styles.valuePlaceholder : '')}>\n {!hasValue && isEditable && onStartEdit ? (\n <Button\n onClick={onStartEdit}\n variant=\"text\"\n color=\"secondary\"\n size=\"small\"\n title=\"Click to edit\"\n className={styles.editButton}\n >\n {displayValue}\n </Button>\n ) : (\n displayValue\n )}\n </div>\n </>\n );\n };\n\n const renderVerificationStatus = (schema: Schema): ReactElement \| null => {\n const verification: VerifiedAttribute \| undefined = verifiedAttributes[schema.name!];\n let verifiedAtTitle: string \| undefined;\n\n if (verification?.verifiedAt) {\n const verifiedAt: Date = new Date(verification.verifiedAt);\n const date: string = Number.isNaN(verifiedAt.getTime())\n ? verification.verifiedAt\n : verifiedAt.toLocaleString(currentLanguage);\n verifiedAtTitle = t('user.verification.status.verified_at', {date});\n }\n\n return (\n <span\n className={cx(\n withVendorCSSClassPrefix(bem('user-profile', 'verification-status')),\n withVendorCSSClassPrefix(\n bem('user-profile', 'verification-status', verification ? 'verified' : 'unverified'),\n ),\n verificationStyles['verificationStatus'],\n verification ? verificationStyles['verified'] : verificationStyles['unverified'],\n )}\n title={verifiedAtTitle}\n data-testid={`thunderid-verification-status-${schema.name}`}\n >\n {verification ? (\n <CircleCheck width={12} height={12} aria-hidden=\"true\" />\n ) : (\n <CircleAlert width={12} height={12} aria-hidden=\"true\" />\n )}\n {verification ? t('user.verification.status.verified') : t('user.verification.status.unverified')}\n {/ A title is not reachable by keyboard or touch, so the time is also given as text. /}\n {verifiedAtTitle && <span className={verificationStyles['visuallyHidden']}>{` (${verifiedAtTitle})`}</span>}\n </span>\n );\n };\n\n const renderVerificationPanel = (schema: Schema): ReactNode => {\n if (!renderVerification \|\| !schema.name \|\| verifyingField !== schema.name) {\n return null;\n }\n\n const attributeDisplayName: string = schema.displayName ?? startCase(schema.name);\n const panel: ReactElement = (\n <div\n className={cx(\n withVendorCSSClassPrefix(bem('user-profile', 'verification')),\n verificationStyles['verification'],\n mode === 'popup' ? verificationStyles['verificationInline'] : '',\n )}\n >\n {renderVerification({\n attribute: schema.name,\n attributeDisplayName,\n onCancel: (): void => setVerifyingField(null),\n onComplete: (): void => {\n setVerifyingField(null);\n setVerifiedNotice(attributeDisplayName);\n },\n })}\n </div>\n );\n\n // Popup mode keeps the panel under the row, inside the profile's own dialog.\n if (mode === 'popup') return panel;\n\n return (\n <DialogPrimitive\n open\n onOpenChange={(isOpen: boolean): void => {\n if (!isOpen) setVerifyingField(null);\n }}\n >\n {/ Content's own props replace its class, so the size goes on a wrapper. */}\n <DialogPrimitive.Content aria-label={t('user.verification.heading', {attribute: attributeDisplayName})}>\n <div className={verificationStyles['verificationDialog']}>{panel}</div>\n </DialogPrimitive.Content>\n </DialogPrimitive>\n );\n };\n\n const renderUserInfo = (schema: Schema): any => {\n if (!schema?.name) return null;\n\n const hasValue: any = schema.value !== undefined && schema.value !== '' && schema.value !== null;\n const isFieldEditing: any = editingFields[schema.name];\n const isReadonlyField: any = readonlyFields.includes(schema.name);\n\n const shouldShow: any = hasValue \|\| isFieldEditing \|\| (editable && schema.mutability === 'READ_WRITE');\n\n if (!shouldShow) {\n return null;\n }\n\n // Status describes the stored value, so it is shown only while the row shows that value and no\n // save is about to replace it.\n const storedUser: User \| undefined = flattenedProfile ?? profile;\n const storedAttributes: Record<string, unknown> \| undefined = storedUser?.['attributes'] as\n \| Record<string, unknown>\n \| undefined;\n const storedValue: unknown = storedAttributes?.[schema.name] ?? storedUser?.[schema.name];\n const showsVerificationStatus: boolean =\n supportsVerification &&\n !!hasValue &&\n !isFieldEditing &&\n !savingFields[schema.name] &&\n schema.value === storedValue &&\n isStatusType(schema.type);\n // A read-only profile shows the status only.\n const canVerify: boolean =\n editable &&\n !!renderVerification &&\n showsVerificationStatus &&\n !verifiedAttributes[schema.name] &&\n verifyingField !== schema.name &&\n isVerifiableAttribute(userSchema, schema.name) &&\n typeof schema.value === 'string';\n\n return (\n <div className={styles.field}>\n <div className={styles.fieldInner}>\n {renderSchemaField(\n schema,\n isFieldEditing,\n (value: any) => {\n const tempEditedUser: any = {...editedUser};\n tempEditedUser[schema.name!] = value;\n setEditedUser(tempEditedUser);\n },\n () => toggleFieldEdit(schema.name),\n )}\n {showsVerificationStatus && renderVerificationStatus(schema)}\n {fieldErrors[schema.name] && (\n <div style={{color: '#d32f2f', fontSize: '0.8rem', marginTop: '4px', fontWeight: 500}}>\n {fieldErrors[schema.name]}\n </div>\n )}\n </div>\n {canVerify && (\n <div className={verificationStyles['fieldActions']}>\n <Button\n size=\"small\"\n color=\"primary\"\n variant=\"outline\"\n onClick={(): void => {\n setVerifiedNotice(null);\n setVerifyingField(schema.name!);\n }}\n className={withVendorCSSClassPrefix(bem('user-profile', 'verify-button'))}\n data-testid={`thunderid-verify-${schema.name}`}\n >\n {t('user.verification.buttons.verify.text')}\n </Button>\n </div>\n )}\n {editable && schema.mutability !== 'READ_ONLY' && !isReadonlyField && (\n <div className={styles.fieldActions}>\n {isFieldEditing && (\n <>\n <Button size=\"small\" color=\"primary\" variant=\"solid\" onClick={(): any => handleFieldSave(schema)}>\n Save\n </Button>\n <Button\n size=\"small\"\n color=\"secondary\"\n variant=\"solid\"\n onClick={(): any => handleFieldCancel(schema.name)}\n >\n Cancel\n </Button>\n </>\n )}\n {!isFieldEditing && hasValue && (\n <Button\n size=\"small\"\n color=\"tertiary\"\n variant=\"icon\"\n onClick={(): any => {\n if (verifyingField === schema.name) setVerifyingField(null);\n setVerifiedNotice(null);\n toggleFieldEdit(schema.name);\n }}\n title=\"Edit\"\n className={styles.editButton}\n >\n <PencilIcon />\n </Button>\n )}\n </div>\n )}\n </div>\n );\n };\n\n if (!profile && !flattenedProfile) {\n return fallback;\n }\n\n const containerClasses: any = cx(\n styles.root,\n cardLayout ? styles.card : '',\n withVendorCSSClassPrefix('user-profile'),\n className,\n );\n\n const currentUser: any = flattenedProfile \|\| profile;\n\n const renderProfileContent = (): any => {\n if (!currentUser) return null;\n\n const displayName: any = getDisplayName(mergedMappings, profile!, displayNameAttributes);\n\n let schemaItems: Schema[] = [];\n\n if (userSchema && typeof userSchema === 'object' && Object.keys(userSchema).length > 0) {\n schemaItems = Object.entries(userSchema)\n .filter(([key, metaAttr]: [string, AttributeSchema]) => {\n if (metaAttr?.credential) return false;\n return shouldShowField(key, true);\n })\n .map(([key, metaAttr]: [string, AttributeSchema]) => {\n const val = editedUser?.[key] ?? currentUser?.attributes?.[key] ?? currentUser?.[key] ?? '';\n\n const isReadonly =\n metaAttr.readOnly === true \|\| metaAttr.mutability === 'READ_ONLY' \|\| readonlyFields.includes(key);\n\n return {\n name: key,\n displayName: metaAttr.displayName ?? (key ? startCase(key) : ''),\n type: (metaAttr.type ?? 'STRING').toUpperCase(),\n regex: metaAttr.regex,\n required: !!metaAttr.required,\n mutability: isReadonly ? 'READ_ONLY' : 'READ_WRITE',\n value: val,\n };\n });\n } else {\n const profileEntries: any = Object.entries(currentUser)\n .filter(([key, value]: [string, any]) => {\n if (!shouldShowField(key)) return false;\n\n return value !== undefined && value !== '' && value !== null;\n })\n .sort(([a]: [string, ...any[]], [b]: [string, ...any[]]) => a.localeCompare(b));\n\n schemaItems = profileEntries.map(([key, value]: any) => {\n const isReadonly = readonlyFields.includes(key);\n return {\n name: key,\n displayName: startCase(key),\n mutability: isReadonly ? 'READ_ONLY' : 'READ_WRITE',\n value,\n };\n });\n }\n\n return (\n <>\n {verifiedNotice && (\n <AlertPrimitive\n variant=\"success\"\n role=\"status\"\n className={cx(\n withVendorCSSClassPrefix(bem('user-profile', 'verification-notice')),\n verificationStyles['alert'],\n )}\n data-testid=\"thunderid-verification-notice\"\n >\n <AlertPrimitive.Description>\n {t('user.verification.success', {attribute: verifiedNotice})}\n </AlertPrimitive.Description>\n </AlertPrimitive>\n )}\n <div className={styles.profileSummary}>\n <Avatar\n imageUrl={getMappedUserProfileValue('picture', mergedMappings, currentUser)}\n name={displayName}\n size={70}\n alt={`${displayName}'s avatar`}\n isLoading={isLoading}\n />\n <Typography variant=\"h3\" fontWeight=\"medium\">\n {displayName}\n </Typography>\n {getMappedUserProfileValue('email', mergedMappings, currentUser) && (\n <Typography variant=\"body2\" color=\"textSecondary\">\n {getMappedUserProfileValue('email', mergedMappings, currentUser)}\n </Typography>\n )}\n </div>\n <Divider />\n {schemaItems.map((schemaWithValue: Schema) => (\n <div key={schemaWithValue.name} className={styles.info}>\n {renderUserInfo(schemaWithValue)}\n {renderVerificationPanel(schemaWithValue)}\n </div>\n ))}\n </>\n );\n };\n\n const profileContent: any = (\n <CardPrimitive className={containerClasses}>\n {error && (\n <AlertPrimitive\n variant=\"error\"\n className={cx(withVendorCSSClassPrefix(bem('user-profile', 'alert')), styles.alert)}\n >\n <AlertPrimitive.Title>{t('errors.heading') \|\| 'Error'}</AlertPrimitive.Title>\n <AlertPrimitive.Description>{error}</AlertPrimitive.Description>\n </AlertPrimitive>\n )}\n <div className={styles.infoContainer}>{renderProfileContent()}</div>\n </CardPrimitive>\n );\n\n if (mode === 'popup') {\n return (\n <DialogPrimitive open={open} onOpenChange={onOpenChange}>\n <DialogPrimitive.Content>\n <DialogPrimitive.Heading>{title ?? t('user.profile.heading')}</DialogPrimitive.Heading>\n <div className={styles.popup}>{profileContent}</div>\n </DialogPrimitive.Content>\n </DialogPrimitive>\n );\n }\n\n return profileContent;\n};\n\nexport default BaseUserProfile;\n"],"mappings":"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"}

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

@@ -171,10 +171,37 @@ const useStyles = (theme, colorScheme) => {
 		const popup = require_emotion.css`
       padding: calc(${theme.vars.spacing.unit} * 2);
     `;
-		return {
-			alert: require_emotion.css`
+		const alert = require_emotion.css`
       margin-bottom: calc(${theme.vars.spacing.unit} * 3);
-    `,
+    `;
+		const verificationStatus = require_emotion.css`
+      display: inline-flex;
+      flex-shrink: 0;
+      gap: calc(${theme.vars.spacing.unit} / 2);
+      align-items: center;
+      padding: 0 ${theme.vars.spacing.unit};
+      border-radius: 999px;
+      font-size: 0.75rem;
+      font-weight: 500;
+      line-height: 22px;
+      white-space: nowrap;
+    `;
+		const verified = require_emotion.css`
+      color: ${theme.vars.colors.success.dark ?? theme.vars.colors.success.main};
+      background: color-mix(in srgb, ${theme.vars.colors.success.main} 12%, transparent);
+    `;
+		const unverified = require_emotion.css`
+      color: ${theme.vars.colors.warning.contrastText};
+      background: color-mix(in srgb, ${theme.vars.colors.warning.main} 14%, transparent);
+    `;
+		const verification = require_emotion.css`
+      padding: ${theme.vars.spacing.unit} 0;
+    `;
+		const verificationInline = require_emotion.css`
+      margin-inline-start: calc(120px + ${theme.vars.spacing.unit});
+    `;
+		return {
+			alert,
 			card,
 			complexTextarea,
 			editButton,
@@ -196,15 +223,41 @@ const useStyles = (theme, colorScheme) => {
 			sectionLabel,
 			sectionRow,
 			sectionValue,
+			unverified,
 			value,
-			valuePlaceholder
+			valuePlaceholder,
+			verification,
+			verificationDialog: require_emotion.css`
+      box-sizing: border-box;
+      width: min(448px, calc(100vw - calc(${theme.vars.spacing.unit} * 4)));
+      padding: calc(${theme.vars.spacing.unit} * 2);
+    `,
+			verificationInline,
+			verificationStatus,
+			verified,
+			visuallyHidden: require_emotion.css`
+      position: absolute;
+      width: 1px;
+      height: 1px;
+      padding: 0;
+      margin: -1px;
+      overflow: hidden;
+      clip: rect(0, 0, 0, 0);
+      white-space: nowrap;
+      border: 0;
+    `
 		};
 	}, [
 		theme.vars.colors.background.surface,
 		theme.vars.colors.text.primary,
 		theme.vars.colors.text.secondary,
 		theme.vars.colors.border,
+		theme.vars.colors.success.main,
+		theme.vars.colors.success.dark,
+		theme.vars.colors.warning.contrastText,
+		theme.vars.colors.warning.main,
 		theme.vars.borderRadius.large,
+		theme.vars.borderRadius.small,
 		theme.vars.borderRadius.medium,
 		theme.vars.spacing.unit,
 		theme.vars.typography.fontFamily,

package/dist/cjs/components/account/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/account/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"}
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","alert: string","verificationStatus: string","verified: string","unverified: string","verification: string","verificationInline: string"],"sources":["../../../../../src/components/account/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 const verificationStatus: string = css`\n display: inline-flex;\n flex-shrink: 0;\n gap: calc(${theme.vars.spacing.unit} / 2);\n align-items: center;\n padding: 0 ${theme.vars.spacing.unit};\n border-radius: 999px;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 22px;\n white-space: nowrap;\n `;\n\n const verified: string = css`\n color: ${theme.vars.colors.success.dark ?? theme.vars.colors.success.main};\n background: color-mix(in srgb, ${theme.vars.colors.success.main} 12%, transparent);\n `;\n\n // Amber marks an action the user can take.\n const unverified: string = css`\n color: ${theme.vars.colors.warning.contrastText};\n background: color-mix(in srgb, ${theme.vars.colors.warning.main} 14%, transparent);\n `;\n\n const verification: string = css`\n padding: ${theme.vars.spacing.unit} 0;\n `;\n\n // Starts where the value column starts: the label's width plus the row gap.\n const verificationInline: string = css`\n margin-inline-start: calc(120px + ${theme.vars.spacing.unit});\n `;\n\n const verificationDialog: string = css`\n box-sizing: border-box;\n width: min(448px, calc(100vw - calc(${theme.vars.spacing.unit} * 4)));\n padding: calc(${theme.vars.spacing.unit} * 2);\n `;\n\n // Hidden from sight, read by assistive technology.\n const visuallyHidden: string = css`\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\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 unverified,\n value,\n valuePlaceholder,\n verification,\n verificationDialog,\n verificationInline,\n verificationStatus,\n verified,\n visuallyHidden,\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.colors.success.main,\n theme.vars.colors.success.dark,\n theme.vars.colors.warning.contrastText,\n theme.vars.colors.warning.main,\n theme.vars.borderRadius.large,\n theme.vars.borderRadius.small,\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":"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"}

package/dist/cjs/components/account/UserProfile/UserProfile.cjs CHANGED Viewed

@@ -4,6 +4,7 @@ const require_useUser = require('../../../contexts/User/useUser.cjs');
 const require_useTranslation = require('../../../hooks/useTranslation.cjs');
 const require_BaseUserProfile = require('./BaseUserProfile.cjs');
 const require_updateMeProfile = require('../../../api/account/updateMeProfile.cjs');
+const require_VerifyAttribute = require('../VerifyAttribute/VerifyAttribute.cjs');
 let __thunderid_browser = require("@thunderid/browser");
 __thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
 let react = require("react");
@@ -45,7 +46,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 * />
 * ```
 */
-const UserProfile = ({ preferences, editable = true,...rest }) => {
+const UserProfile = ({ preferences, editable = true, verificationFlowHandle = __thunderid_browser.AttributeVerificationConstants.DEFAULT_FLOW_HANDLE,...rest }) => {
 	const { baseUrl, endpoints, instanceId, preferences: contextPreferences } = require_useThunderID.default();
 	const { profile, flattenedProfile, onUpdateProfile, userSchema } = require_useUser.default();
 	const resolvedPreferences = {
@@ -78,7 +79,18 @@ const UserProfile = ({ preferences, editable = true,...rest }) => {
 			setError(message);
 		}
 	};
+	const renderVerification = ({ attribute, attributeDisplayName, onCancel, onComplete }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_VerifyAttribute.default, {
+		attribute,
+		attributeDisplayName,
+		flowHandle: verificationFlowHandle,
+		preferences: resolvedPreferences,
+		variant: rest.mode === "popup" ? "outlined" : "flat",
+		onCancel,
+		onComplete,
+		onDone: onCancel
+	}, attribute);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BaseUserProfile.default, {
+		renderVerification: isEditableProfile ? renderVerification : void 0,
 		profile: profile ?? void 0,
 		flattenedProfile: flattenedProfile ?? void 0,
 		userSchema: userSchema ?? void 0,

package/dist/cjs/components/account/UserProfile/UserProfile.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserProfile.cjs","names":["UserProfile: FC<UserProfileProps>","useThunderID","useUser","useTranslation","isEditableProfile: boolean","updatedAttributes: Record<string, unknown>","updateMeProfile","caughtError: unknown","message: string","ThunderIDError","BaseUserProfile"],"sources":["../../../../../src/components/account/UserProfile/UserProfile.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {ThunderIDError, User, deepMerge, resolveResourceEndpoint} from '@thunderid/browser';\nimport {FC, ReactElement, useState} from 'react';\n// eslint-disable-next-line import/no-named-as-default\nimport BaseUserProfile, {BaseUserProfileProps} from './BaseUserProfile';\nimport updateMeProfile from '../../../api/account/updateMeProfile';\nimport useThunderID from '../../../contexts/ThunderID/useThunderID';\nimport useUser from '../../../contexts/User/useUser';\nimport useTranslation from '../../../hooks/useTranslation';\n\n/*\n Props for the UserProfile component.\n * Extends BaseUserProfileProps but makes the user prop optional since it will be obtained from useThunderID\n /\nexport type UserProfileProps = Omit<BaseUserProfileProps, 'user' \| 'profile' \| 'flattenedProfile'~~>;\~~n\n/\n UserProfile component displays the authenticated user's profile information in a\n * structured and styled format. It shows user details such as display name, email,\n * username, and other available profile information from ThunderID.\n \n This component is the React-specific implementation that uses the BaseUserProfile\n * and automatically retrieves the user data from ThunderID context if not provided.\n \n @example\n * ```tsx\n * // Basic usage - will use user from ThunderID context\n * <UserProfile />\n \n // With explicit user data\n * <UserProfile user={specificUser} />\n \n // With card layout and custom fallback\n * <UserProfile\n * cardLayout={true}\n * fallback={<div>Please sign in to view your profile</div>}\n * />\n \n // With field filtering - only show specific fields\n * <UserProfile\n * showFields={['name.givenName', 'name.familyName', 'emails']}\n * />\n \n // With field hiding - hide specific fields\n * <UserProfile\n * hideFields={['phoneNumbers', 'addresses']}\n * />\n * ```\n */\nconst UserProfile: FC<UserProfileProps> = ({preferences, editable = true, ...rest}: UserProfileProps): ReactElement => {\n const {baseUrl, endpoints, instanceId, preferences: contextPreferences} = useThunderID();\n const {profile, flattenedProfile, onUpdateProfile, userSchema} = useUser();\n const resolvedPreferences = {\n ...contextPreferences,\n ...preferences,\n user: {\n ...contextPreferences?.user,\n ...preferences?.user,\n },\n };\n const {t} = useTranslation(resolvedPreferences?.i18n);\n const isEditableProfile: boolean = resolvedPreferences?.user?.fetchUserProfile === false ? false : editable;\n\n const [error, setError] = useState<string \| null>(null);\n\n const handleProfileUpdate = async (payload: Record<string, unknown>): Promise<void> => {\n setError(null);\n\n try {\n const updatedAttributes: Record<string, unknown> = deepMerge(\n (profile?.['attributes'] as Record<string, unknown>) ?? {},\n payload,\n );\n\n Object.keys(updatedAttributes).forEach((key) => {\n if (updatedAttributes[key] === undefined \|\| updatedAttributes[key] === null) {\n delete updatedAttributes[key];\n }\n });\n\n const response: User = await updateMeProfile({\n baseUrl,\n url: resolveResourceEndpoint('usersMe', {endpoints}),\n instanceId,\n payload: updatedAttributes,\n });\n onUpdateProfile(response);\n } catch (caughtError: unknown) {\n let message: string = t('user.profile.update.generic.error');\n\n if (caughtError instanceof ThunderIDError) {\n message = caughtError?.message;\n }\n\n setError(message);\n }\n };\n\n return (\n <BaseUserProfile\n profile={profile ?? undefined}\n flattenedProfile={flattenedProfile ?? undefined}\n userSchema={userSchema ?? undefined}\n editable={isEditableProfile}\n onUpdate={isEditableProfile ? handleProfileUpdate : undefined}\n error={error}\n preferences={resolvedPreferences}\n {...rest}\n />\n );\n};\n\nexport default UserProfile;\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA~~,MAAMA,eAAqC,~~EAAC~~,~~aAAa~~,WAAW,~~KAAM~~,GAAG,~~WAA0C~~;~~CACrH~~,MAAM,EAAC,SAAS,WAAW,YAAY,aAAa,uBAAsBC,8BAAc;CACxF,MAAM,EAAC,SAAS,kBAAkB,iBAAiB,eAAcC,yBAAS;CAC1E,MAAM,sBAAsB;EAC1B,GAAG;EACH,GAAG;EACH,MAAM;GACJ,GAAG,oBAAoB;GACvB,GAAG,aAAa;GACjB;EACF;CACD,MAAM,EAAC,MAAKC,+BAAe,qBAAqB,KAAK;CACrD,MAAMC,oBAA6B,qBAAqB,MAAM,qBAAqB,QAAQ,QAAQ;CAEnG,MAAM,CAAC,OAAO,gCAAoC,KAAK;CAEvD,MAAM,sBAAsB,OAAO,YAAoD;AACrF,WAAS,KAAK;AAEd,MAAI;GACF,MAAMC,uDACH,UAAU,iBAA6C,EAAE,EAC1D,QACD;AAED,UAAO,KAAK,kBAAkB,CAAC,SAAS,QAAQ;AAC9C,QAAI,kBAAkB,SAAS,UAAa,kBAAkB,SAAS,KACrE,QAAO,kBAAkB;KAE3B;AAQF,mBANuB,MAAMC,gCAAgB;IAC3C;IACA,sDAA6B,WAAW,EAAC,WAAU,CAAC;IACpD;IACA,SAAS;IACV,CAAC,CACuB;WAClBC,aAAsB;GAC7B,IAAIC,UAAkB,EAAE,oCAAoC;AAE5D,OAAI,uBAAuBC,mCACzB,WAAU,aAAa;AAGzB,YAAS,QAAQ;;;~~AAIrB~~,QACE,2CAACC;EACC,SAAS,WAAW;EACpB,kBAAkB,oBAAoB;EACtC,YAAY,cAAc;EAC1B,UAAU;EACV,UAAU,oBAAoB,sBAAsB;EAC7C;EACP,aAAa;EACb,GAAI;GACJ;;AAIN,0BAAe"}
1	+ {"version":3,"file":"UserProfile.cjs","names":["UserProfile: FC<UserProfileProps>","AttributeVerificationConstants","useThunderID","useUser","useTranslation","isEditableProfile: boolean","updatedAttributes: Record<string, unknown>","updateMeProfile","caughtError: unknown","message: string","ThunderIDError","VerifyAttribute","BaseUserProfile"],"sources":["../../../../../src/components/account/UserProfile/UserProfile.tsx"],"sourcesContent":["// Copyright 2025-2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n AttributeVerificationConstants,\n ThunderIDError,\n User,\n deepMerge,\n resolveResourceEndpoint,\n} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useState} from 'react';\n// eslint-disable-next-line import/no-named-as-default\nimport BaseUserProfile, {BaseUserProfileProps, BaseUserProfileVerificationRenderProps} from './BaseUserProfile';\nimport updateMeProfile from '../../../api/account/updateMeProfile';\nimport useThunderID from '../../../contexts/ThunderID/useThunderID';\nimport useUser from '../../../contexts/User/useUser';\nimport useTranslation from '../../../hooks/useTranslation';\nimport VerifyAttribute from '../VerifyAttribute/VerifyAttribute';\n\n/*\n Props for the UserProfile component.\n * Extends BaseUserProfileProps but makes the user prop optional since it will be obtained from useThunderID\n /\nexport type UserProfileProps = Omit<BaseUserProfileProps, 'user' \| 'profile' \| 'flattenedProfile'> & {\n /\n Handle of the `SELF` flow that verifies an attribute. Defaults to the server's shipped\n * `default-self-attribute-verification-flow`.\n /\n verificationFlowHandle?: string;\n};\n\n/\n UserProfile component displays the authenticated user's profile information in a\n * structured and styled format. It shows user details such as display name, email,\n * username, and other available profile information from ThunderID.\n \n This component is the React-specific implementation that uses the BaseUserProfile\n * and automatically retrieves the user data from ThunderID context if not provided.\n \n @example\n * ```tsx\n * // Basic usage - will use user from ThunderID context\n * <UserProfile />\n \n // With explicit user data\n * <UserProfile user={specificUser} />\n \n // With card layout and custom fallback\n * <UserProfile\n * cardLayout={true}\n * fallback={<div>Please sign in to view your profile</div>}\n * />\n \n // With field filtering - only show specific fields\n * <UserProfile\n * showFields={['name.givenName', 'name.familyName', 'emails']}\n * />\n \n // With field hiding - hide specific fields\n * <UserProfile\n * hideFields={['phoneNumbers', 'addresses']}\n * />\n * ```\n */\nconst UserProfile: FC<UserProfileProps> = ({\n preferences,\n editable = true,\n verificationFlowHandle = AttributeVerificationConstants.DEFAULT_FLOW_HANDLE,\n ...rest\n}: UserProfileProps): ReactElement => {\n const {baseUrl, endpoints, instanceId, preferences: contextPreferences} = useThunderID();\n const {profile, flattenedProfile, onUpdateProfile, userSchema} = useUser();\n const resolvedPreferences = {\n ...contextPreferences,\n ...preferences,\n user: {\n ...contextPreferences?.user,\n ...preferences?.user,\n },\n };\n const {t} = useTranslation(resolvedPreferences?.i18n);\n const isEditableProfile: boolean = resolvedPreferences?.user?.fetchUserProfile === false ? false : editable;\n\n const [error, setError] = useState<string \| null>(null);\n\n const handleProfileUpdate = async (payload: Record<string, unknown>): Promise<void> => {\n setError(null);\n\n try {\n const updatedAttributes: Record<string, unknown> = deepMerge(\n (profile?.['attributes'] as Record<string, unknown>) ?? {},\n payload,\n );\n\n Object.keys(updatedAttributes).forEach((key) => {\n if (updatedAttributes[key] === undefined \|\| updatedAttributes[key] === null) {\n delete updatedAttributes[key];\n }\n });\n\n const response: User = await updateMeProfile({\n baseUrl,\n url: resolveResourceEndpoint('usersMe', {endpoints}),\n instanceId,\n payload: updatedAttributes,\n });\n onUpdateProfile(response);\n } catch (caughtError: unknown) {\n let message: string = t('user.profile.update.generic.error');\n\n if (caughtError instanceof ThunderIDError) {\n message = caughtError?.message;\n }\n\n setError(message);\n }\n };\n\n const renderVerification = ({\n attribute,\n attributeDisplayName,\n onCancel,\n onComplete,\n }: BaseUserProfileVerificationRenderProps): ReactNode => (\n <VerifyAttribute\n key={attribute}\n attribute={attribute}\n attributeDisplayName={attributeDisplayName}\n flowHandle={verificationFlowHandle}\n preferences={resolvedPreferences}\n // Popup mode shows the panel under the row as a card; inline mode shows it in a dialog.\n variant={rest.mode === 'popup' ? 'outlined' : 'flat'}\n onCancel={onCancel}\n onComplete={onComplete}\n onDone={onCancel}\n />\n );\n\n return (\n <BaseUserProfile\n renderVerification={isEditableProfile ? renderVerification : undefined}\n profile={profile ?? undefined}\n flattenedProfile={flattenedProfile ?? undefined}\n userSchema={userSchema ?? undefined}\n editable={isEditableProfile}\n onUpdate={isEditableProfile ? handleProfileUpdate : undefined}\n error={error}\n preferences={resolvedPreferences}\n {...rest}\n />\n );\n};\n\nexport default UserProfile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgEA,MAAMA,eAAqC,EACzC,aACA,WAAW,MACX,yBAAyBC,mDAA+B,oBACxD,GAAG,WACiC;CACpC,MAAM,EAAC,SAAS,WAAW,YAAY,aAAa,uBAAsBC,8BAAc;CACxF,MAAM,EAAC,SAAS,kBAAkB,iBAAiB,eAAcC,yBAAS;CAC1E,MAAM,sBAAsB;EAC1B,GAAG;EACH,GAAG;EACH,MAAM;GACJ,GAAG,oBAAoB;GACvB,GAAG,aAAa;GACjB;EACF;CACD,MAAM,EAAC,MAAKC,+BAAe,qBAAqB,KAAK;CACrD,MAAMC,oBAA6B,qBAAqB,MAAM,qBAAqB,QAAQ,QAAQ;CAEnG,MAAM,CAAC,OAAO,gCAAoC,KAAK;CAEvD,MAAM,sBAAsB,OAAO,YAAoD;AACrF,WAAS,KAAK;AAEd,MAAI;GACF,MAAMC,uDACH,UAAU,iBAA6C,EAAE,EAC1D,QACD;AAED,UAAO,KAAK,kBAAkB,CAAC,SAAS,QAAQ;AAC9C,QAAI,kBAAkB,SAAS,UAAa,kBAAkB,SAAS,KACrE,QAAO,kBAAkB;KAE3B;AAQF,mBANuB,MAAMC,gCAAgB;IAC3C;IACA,sDAA6B,WAAW,EAAC,WAAU,CAAC;IACpD;IACA,SAAS;IACV,CAAC,CACuB;WAClBC,aAAsB;GAC7B,IAAIC,UAAkB,EAAE,oCAAoC;AAE5D,OAAI,uBAAuBC,mCACzB,WAAU,aAAa;AAGzB,YAAS,QAAQ;;;CAIrB,MAAM,sBAAsB,EAC1B,WACA,sBACA,UACA,iBAEA,2CAACC;EAEY;EACW;EACtB,YAAY;EACZ,aAAa;EAEb,SAAS,KAAK,SAAS,UAAU,aAAa;EACpC;EACE;EACZ,QAAQ;IATH,UAUL;AAGJ,QACE,2CAACC;EACC,oBAAoB,oBAAoB,qBAAqB;EAC7D,SAAS,WAAW;EACpB,kBAAkB,oBAAoB;EACtC,YAAY,cAAc;EAC1B,UAAU;EACV,UAAU,oBAAoB,sBAAsB;EAC7C;EACP,aAAa;EACb,GAAI;GACJ;;AAIN,0BAAe"}