@thunderid/react 1.5.0 → 1.7.0

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

@@ -0,0 +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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"}

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

@@ -0,0 +1,218 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_emotion = require('../../../styles/emotion.cjs');
+let __thunderid_browser = require("@thunderid/browser");
+__thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+
+//#region src/components/account/UserProfile/BaseUserProfile.styles.ts
+/**
+* Creates styles for the BaseUserProfile component
+* @param theme - The theme object containing design tokens
+* @param colorScheme - The current color scheme (used for memoization)
+* @returns Object containing CSS class names for component styling
+*/
+const useStyles = (theme, colorScheme) => {
+	const valuePlaceholder = require_emotion.css`
+    font-style: italic;
+    opacity: 0.7;
+  `;
+	const editButton = require_emotion.css`
+    font-style: italic;
+    text-decoration: underline;
+    opacity: 0.7;
+    padding: 0;
+    min-height: auto;
+
+    &:hover:not(:disabled) {
+      background-color: transparent;
+    }
+  `;
+	const fieldInner = require_emotion.css`
+    flex: 1;
+    display: flex;
+    align-items: center;
+    gap: ${theme.vars.spacing.unit};
+    min-width: 0;
+  `;
+	const fieldActions = require_emotion.css`
+    display: flex;
+    gap: calc(${theme.vars.spacing.unit} / 2);
+    align-items: center;
+    margin-inline-start: calc(${theme.vars.spacing.unit} * 4);
+  `;
+	const complexTextarea = require_emotion.css`
+    min-height: 60px;
+    width: 100%;
+    padding: 8px;
+    border: 1px solid ${theme.vars.colors.border};
+    border-radius: ${theme.vars.borderRadius.small};
+    resize: vertical;
+  `;
+	const objectKey = require_emotion.css`
+    padding: ${theme.vars.spacing.unit};
+    vertical-align: top;
+  `;
+	const objectValue = require_emotion.css`
+    padding: ${theme.vars.spacing.unit};
+    vertical-align: top;
+  `;
+	return (0, react.useMemo)(() => {
+		const root = require_emotion.css`
+      padding: calc(${theme.vars.spacing.unit} * 4);
+      min-width: 600px;
+      margin: 0 auto;
+      font-family: ${theme.vars.typography.fontFamily};
+    `;
+		const card = require_emotion.css`
+      background: ${theme.vars.colors.background.surface};
+      border-radius: ${theme.vars.borderRadius.large};
+    `;
+		const header = require_emotion.css`
+      display: flex;
+      align-items: center;
+      gap: calc(${theme.vars.spacing.unit} * 1.5);
+      margin-bottom: calc(${theme.vars.spacing.unit} * 1.5);
+    `;
+		const profileInfo = require_emotion.css`
+      flex: 1;
+    `;
+		const name = require_emotion.css`
+      font-size: 1.5rem;
+      font-weight: 600;
+      margin: 0;
+      color: ${theme.vars.colors.text.primary};
+    `;
+		const profileSummary = require_emotion.css`
+      display: flex;
+      flex-direction: column;
+      align-items: flex-start;
+    `;
+		const sectionRow = require_emotion.css`
+      display: flex;
+      align-items: center;
+      padding: calc(${theme.vars.spacing.unit} * 1) 0;
+    `;
+		const sectionLabel = require_emotion.css`
+      font-size: 0.875rem;
+      font-weight: 600;
+      color: ${theme.vars.colors.text.primary};
+      width: 160px;
+      flex-shrink: 0;
+    `;
+		const sectionValue = require_emotion.css`
+      flex: 1;
+      display: flex;
+      align-items: center;
+      gap: calc(${theme.vars.spacing.unit} * 1.5);
+      font-size: 0.875rem;
+      color: ${theme.vars.colors.text.primary};
+    `;
+		const infoContainer = require_emotion.css`
+      display: flex;
+      flex-direction: column;
+    `;
+		const info = require_emotion.css`
+      padding: calc(${theme.vars.spacing.unit} * 1.5) 0;
+      border-bottom: 1px solid ${theme.vars.colors.border};
+    `;
+		const field = require_emotion.css`
+      display: flex;
+      align-items: center;
+      padding: calc(${theme.vars.spacing.unit} / 2) 0;
+      min-height: 28px;
+    `;
+		const lastField = require_emotion.css`
+      border-bottom: none;
+    `;
+		const label = require_emotion.css`
+      font-size: 0.875rem;
+      font-weight: 500;
+      color: ${theme.vars.colors.text.secondary};
+      width: 120px;
+      flex-shrink: 0;
+      line-height: 28px;
+      text-align: start;
+    `;
+		const value = require_emotion.css`
+      color: ${theme.vars.colors.text.primary};
+      flex: 1;
+      display: inline-block;
+      align-items: center;
+      gap: ${theme.vars.spacing.unit};
+      overflow: hidden;
+      min-width: 0;
+      min-height: 28px;
+      line-height: 28px;
+      word-break: break-word;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      max-width: 350px;
+      text-align: start;
+
+      .${(0, __thunderid_browser.withVendorCSSClassPrefix)("form-control")} {
+        margin-bottom: 0;
+      }
+
+      input {
+        margin: 0;
+      }
+
+      table {
+        background-color: ${theme.vars.colors.background.surface};
+        border-radius: ${theme.vars.borderRadius.medium};
+        white-space: normal;
+      }
+
+      td {
+        border-color: ${theme.vars.colors.border};
+      }
+    `;
+		const popup = require_emotion.css`
+      padding: calc(${theme.vars.spacing.unit} * 2);
+    `;
+		return {
+			alert: require_emotion.css`
+      margin-bottom: calc(${theme.vars.spacing.unit} * 3);
+    `,
+			card,
+			complexTextarea,
+			editButton,
+			field,
+			fieldActions,
+			fieldInner,
+			header,
+			info,
+			infoContainer,
+			label,
+			lastField,
+			name,
+			objectKey,
+			objectValue,
+			popup,
+			profileInfo,
+			profileSummary,
+			root,
+			sectionLabel,
+			sectionRow,
+			sectionValue,
+			value,
+			valuePlaceholder
+		};
+	}, [
+		theme.vars.colors.background.surface,
+		theme.vars.colors.text.primary,
+		theme.vars.colors.text.secondary,
+		theme.vars.colors.border,
+		theme.vars.borderRadius.large,
+		theme.vars.borderRadius.medium,
+		theme.vars.spacing.unit,
+		theme.vars.typography.fontFamily,
+		colorScheme
+	]);
+};
+var BaseUserProfile_styles_default = useStyles;
+
+//#endregion
+exports.default = BaseUserProfile_styles_default;
+//# sourceMappingURL=BaseUserProfile.styles.cjs.map

package/dist/cjs/components/account/UserProfile/BaseUserProfile.styles.cjs.map

@@ -0,0 +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"}

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

@@ -0,0 +1,96 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_useThunderID = require('../../../contexts/ThunderID/useThunderID.cjs');
+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');
+let __thunderid_browser = require("@thunderid/browser");
+__thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/account/UserProfile/UserProfile.tsx
+/**
+* UserProfile component displays the authenticated user's profile information in a
+* structured and styled format. It shows user details such as display name, email,
+* username, and other available profile information from ThunderID.
+*
+* This component is the React-specific implementation that uses the BaseUserProfile
+* and automatically retrieves the user data from ThunderID context if not provided.
+*
+* @example
+* ```tsx
+* // Basic usage - will use user from ThunderID context
+* <UserProfile />
+*
+* // With explicit user data
+* <UserProfile user={specificUser} />
+*
+* // With card layout and custom fallback
+* <UserProfile
+*   cardLayout={true}
+*   fallback={<div>Please sign in to view your profile</div>}
+* />
+*
+* // With field filtering - only show specific fields
+* <UserProfile
+*   showFields={['name.givenName', 'name.familyName', 'emails']}
+* />
+*
+* // With field hiding - hide specific fields
+* <UserProfile
+*   hideFields={['phoneNumbers', 'addresses']}
+* />
+* ```
+*/
+const UserProfile = ({ preferences, editable = true,...rest }) => {
+	const { baseUrl, endpoints, instanceId, preferences: contextPreferences } = require_useThunderID.default();
+	const { profile, flattenedProfile, onUpdateProfile, userSchema } = require_useUser.default();
+	const resolvedPreferences = {
+		...contextPreferences,
+		...preferences,
+		user: {
+			...contextPreferences?.user,
+			...preferences?.user
+		}
+	};
+	const { t } = require_useTranslation.default(resolvedPreferences?.i18n);
+	const isEditableProfile = resolvedPreferences?.user?.fetchUserProfile === false ? false : editable;
+	const [error, setError] = (0, react.useState)(null);
+	const handleProfileUpdate = async (payload) => {
+		setError(null);
+		try {
+			const updatedAttributes = (0, __thunderid_browser.deepMerge)(profile?.["attributes"] ?? {}, payload);
+			Object.keys(updatedAttributes).forEach((key) => {
+				if (updatedAttributes[key] === void 0 || updatedAttributes[key] === null) delete updatedAttributes[key];
+			});
+			onUpdateProfile(await require_updateMeProfile.default({
+				baseUrl,
+				url: (0, __thunderid_browser.resolveResourceEndpoint)("usersMe", { endpoints }),
+				instanceId,
+				payload: updatedAttributes
+			}));
+		} catch (caughtError) {
+			let message = t("user.profile.update.generic.error");
+			if (caughtError instanceof __thunderid_browser.ThunderIDError) message = caughtError?.message;
+			setError(message);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BaseUserProfile.default, {
+		profile: profile ?? void 0,
+		flattenedProfile: flattenedProfile ?? void 0,
+		userSchema: userSchema ?? void 0,
+		editable: isEditableProfile,
+		onUpdate: isEditableProfile ? handleProfileUpdate : void 0,
+		error,
+		preferences: resolvedPreferences,
+		...rest
+	});
+};
+var UserProfile_default = UserProfile;
+
+//#endregion
+exports.default = UserProfile_default;
+//# sourceMappingURL=UserProfile.cjs.map

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

@@ -0,0 +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"}

package/dist/cjs/components/admin/AgentCreate/AgentCreate.cjs

@@ -0,0 +1,54 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_useTranslation = require('../../../hooks/useTranslation.cjs');
+const require_useCreateAgent = require('../../../hooks/management/agents/useCreateAgent.cjs');
+const require_useGetAgentTypes = require('../../../hooks/management/agents/useGetAgentTypes.cjs');
+const require_useDefaultOuId = require('../shared/useDefaultOuId.cjs');
+const require_BaseAgentCreate = require('./BaseAgentCreate.cjs');
+let __thunderid_browser = require("@thunderid/browser");
+__thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/admin/AgentCreate/AgentCreate.tsx
+/**
+* Registers an agent through the management API.
+*
+* @example
+* ```tsx
+* <AgentCreate onCreated={(agent) => navigate(`/agents/${agent.id}`)} />
+* ```
+*/
+const AgentCreate = ({ onCreated, ouId, owner, preferences,...rest }) => {
+	const { t } = require_useTranslation.default(preferences?.i18n);
+	const resolvedOuId = require_useDefaultOuId.default(ouId);
+	const { data: agentTypes } = require_useGetAgentTypes.default({ limit: 100 });
+	const { error, isLoading, mutate } = require_useCreateAgent.default({ onSuccess: onCreated });
+	const options = (0, react.useMemo)(() => (agentTypes?.types ?? []).map((agentType) => ({
+		label: agentType.displayName,
+		value: agentType.handle
+	})), [agentTypes]);
+	const handleSubmit = ({ description, name, type }) => {
+		if (resolvedOuId) mutate({
+			description,
+			name,
+			ouId: resolvedOuId,
+			owner,
+			type
+		});
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BaseAgentCreate.default, {
+		agentTypes: options,
+		onSubmit: handleSubmit,
+		isSubmitting: isLoading,
+		error: resolvedOuId ? (0, __thunderid_browser.toManagementErrorMessage)(t, error, "admin.agents.create.error") : t("admin.common.errors.no_ou"),
+		preferences,
+		...rest
+	});
+};
+var AgentCreate_default = AgentCreate;
+
+//#endregion
+exports.default = AgentCreate_default;
+//# sourceMappingURL=AgentCreate.cjs.map

package/dist/cjs/components/admin/AgentCreate/AgentCreate.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgentCreate.cjs","names":["AgentCreate: FC<AgentCreateProps>","useTranslation","resolvedOuId: string | undefined","useDefaultOuId","useGetAgentTypes","useCreateAgent","options: SelectOption[]","BaseAgentCreate"],"sources":["../../../../../src/components/admin/AgentCreate/AgentCreate.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {toManagementErrorMessage, Agent, AgentType, SelectOption} from '@thunderid/browser';\nimport {FC, ReactElement, useMemo} from 'react';\nimport BaseAgentCreate, {AgentCreateSubmission, BaseAgentCreateProps} from './BaseAgentCreate';\nimport useCreateAgent from '../../../hooks/management/agents/useCreateAgent';\nimport useGetAgentTypes from '../../../hooks/management/agents/useGetAgentTypes';\nimport useTranslation from '../../../hooks/useTranslation';\nimport useDefaultOuId from '../shared/useDefaultOuId';\n\nexport type AgentCreateProps = Omit<BaseAgentCreateProps, 'agentTypes' | 'error' | 'isSubmitting' | 'onSubmit'> & {\n  /**\n   * Called with the created agent.\n   */\n  onCreated?: (agent: Agent) => void;\n  /**\n   * Organization unit the agent is created in. Defaults to the signed-in user's organization unit.\n   */\n  ouId?: string;\n  /**\n   * The person responsible for the agent. Defaults to the server's choice, usually the creator.\n   */\n  owner?: string;\n};\n\n/**\n * Registers an agent through the management API.\n *\n * @example\n * ```tsx\n * <AgentCreate onCreated={(agent) => navigate(`/agents/${agent.id}`)} />\n * ```\n */\nconst AgentCreate: FC<AgentCreateProps> = ({\n  onCreated,\n  ouId,\n  owner,\n  preferences,\n  ...rest\n}: AgentCreateProps): ReactElement => {\n  const {t} = useTranslation(preferences?.i18n);\n  const resolvedOuId: string | undefined = useDefaultOuId(ouId);\n  const {data: agentTypes} = useGetAgentTypes({limit: 100});\n  const {error, isLoading, mutate} = useCreateAgent({onSuccess: onCreated});\n\n  const options: SelectOption[] = useMemo(\n    () =>\n      (agentTypes?.types ?? []).map((agentType: AgentType) => ({\n        label: agentType.displayName,\n        value: agentType.handle,\n      })),\n    [agentTypes],\n  );\n\n  const handleSubmit = ({description, name, type}: AgentCreateSubmission): void => {\n    if (resolvedOuId) {\n      void mutate({description, name, ouId: resolvedOuId, owner, type});\n    }\n  };\n\n  return (\n    <BaseAgentCreate\n      agentTypes={options}\n      onSubmit={handleSubmit}\n      isSubmitting={isLoading}\n      error={\n        resolvedOuId ? toManagementErrorMessage(t, error, 'admin.agents.create.error') : t('admin.common.errors.no_ou')\n      }\n      preferences={preferences}\n      {...rest}\n    />\n  );\n};\n\nexport default AgentCreate;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAkCA,MAAMA,eAAqC,EACzC,WACA,MACA,OACA,YACA,GAAG,WACiC;CACpC,MAAM,EAAC,MAAKC,+BAAe,aAAa,KAAK;CAC7C,MAAMC,eAAmCC,+BAAe,KAAK;CAC7D,MAAM,EAAC,MAAM,eAAcC,iCAAiB,EAAC,OAAO,KAAI,CAAC;CACzD,MAAM,EAAC,OAAO,WAAW,WAAUC,+BAAe,EAAC,WAAW,WAAU,CAAC;CAEzE,MAAMC,oCAED,YAAY,SAAS,EAAE,EAAE,KAAK,eAA0B;EACvD,OAAO,UAAU;EACjB,OAAO,UAAU;EAClB,EAAE,EACL,CAAC,WAAW,CACb;CAED,MAAM,gBAAgB,EAAC,aAAa,MAAM,WAAuC;AAC/E,MAAI,aACF,CAAK,OAAO;GAAC;GAAa;GAAM,MAAM;GAAc;GAAO;GAAK,CAAC;;AAIrE,QACE,2CAACC;EACC,YAAY;EACZ,UAAU;EACV,cAAc;EACd,OACE,iEAAwC,GAAG,OAAO,4BAA4B,GAAG,EAAE,4BAA4B;EAEpG;EACb,GAAI;GACJ;;AAIN,0BAAe"}

package/dist/cjs/components/admin/AgentCreate/BaseAgentCreate.cjs

@@ -0,0 +1,124 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_useTheme = require('../../../contexts/Theme/useTheme.cjs');
+const require_useTranslation = require('../../../hooks/useTranslation.cjs');
+const require_Button = require('../../primitives/Button/Button.cjs');
+const require_Alert = require('../../primitives/Alert/Alert.cjs');
+const require_TextField = require('../../primitives/TextField/TextField.cjs');
+const require_Select = require('../../primitives/Select/Select.cjs');
+const require_AdminSection_styles = require('../shared/AdminSection.styles.cjs');
+const require_AdminSection = require('../shared/AdminSection.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/admin/AgentCreate/BaseAgentCreate.tsx
+/**
+* A form that collects a new agent's name, type and description. Holds no data of its own: pass
+* the agent types and handle the submission.
+*/
+const BaseAgentCreate = ({ agentTypes, children, className, description, error = null, isSubmitting = false, onCancel, onSubmit, preferences, title }) => {
+	const { theme, colorScheme } = require_useTheme.default();
+	const styles = require_AdminSection_styles.default(theme, colorScheme);
+	const { t } = require_useTranslation.default(preferences?.i18n);
+	const [name, setName] = (0, react.useState)("");
+	const [chosenType, setType] = (0, react.useState)("");
+	const type = chosenType || (agentTypes[0]?.value ?? "");
+	const [agentDescription, setAgentDescription] = (0, react.useState)("");
+	const isValid = Boolean(name.trim()) && Boolean(type);
+	const submit = () => {
+		if (isValid) onSubmit({
+			description: agentDescription.trim() || void 0,
+			name: name.trim(),
+			type
+		});
+	};
+	const handleSubmit = (event) => {
+		event.preventDefault();
+		submit();
+	};
+	if (children) {
+		const setters = {
+			description: setAgentDescription,
+			name: setName,
+			type: setType
+		};
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className,
+			children: children({
+				agentTypes,
+				error,
+				handleInputChange: (field, value) => setters[field](value),
+				handleSubmit: submit,
+				isSubmitting,
+				isValid,
+				onCancel,
+				values: {
+					description: agentDescription,
+					name,
+					type
+				}
+			})
+		});
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AdminSection.default, {
+		block: "agent-create",
+		className,
+		title: title ?? t("admin.agents.create.title"),
+		description,
+		preferences,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+			className: styles["form"],
+			onSubmit: handleSubmit,
+			noValidate: true,
+			children: [
+				error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Alert.default, {
+					variant: "error",
+					role: "alert",
+					children: error
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_TextField.default, {
+					name: "name",
+					label: t("admin.agents.create.fields.name"),
+					required: true,
+					value: name,
+					onChange: (event) => setName(event.target.value)
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Select.default, {
+					label: t("admin.agents.create.fields.type"),
+					name: "type",
+					required: true,
+					value: type,
+					options: agentTypes,
+					onChange: (event) => setType(event.target.value)
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_TextField.default, {
+					name: "description",
+					label: t("admin.agents.create.fields.description"),
+					value: agentDescription,
+					onChange: (event) => setAgentDescription(event.target.value)
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: styles["formActions"],
+					children: [onCancel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
+						type: "button",
+						variant: "text",
+						onClick: onCancel,
+						disabled: isSubmitting,
+						children: t("admin.common.actions.cancel")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
+						type: "submit",
+						loading: isSubmitting,
+						disabled: !isValid || isSubmitting,
+						children: t("admin.agents.create.submit")
+					})]
+				})
+			]
+		})
+	});
+};
+var BaseAgentCreate_default = BaseAgentCreate;
+
+//#endregion
+exports.default = BaseAgentCreate_default;
+//# sourceMappingURL=BaseAgentCreate.cjs.map

package/dist/cjs/components/admin/AgentCreate/BaseAgentCreate.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseAgentCreate.cjs","names":["BaseAgentCreate: FC<BaseAgentCreateProps>","useTheme","styles: Record<string, string>","useStyles","useTranslation","type: string","isValid: boolean","setters: Record<'description' | 'name' | 'type', (value: string) => void>","AdminSection","Alert","TextField","Select","Button"],"sources":["../../../../../src/components/admin/AgentCreate/BaseAgentCreate.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Preferences, SelectOption} from '@thunderid/browser';\nimport {ChangeEvent, FC, FormEvent, ReactElement, ReactNode, useState} from 'react';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport useTranslation from '../../../hooks/useTranslation';\nimport Alert from '../../primitives/Alert/Alert';\nimport Button from '../../primitives/Button/Button';\nimport Select from '../../primitives/Select/Select';\nimport TextField from '../../primitives/TextField/TextField';\nimport AdminSection from '../shared/AdminSection';\nimport useStyles from '../shared/AdminSection.styles';\n\n/**\n * The agent {@link BaseAgentCreate} submits. The organization unit is added by the caller.\n */\nexport interface AgentCreateSubmission {\n  description?: string;\n  name: string;\n  type: string;\n}\n\n/**\n * What {@link BaseAgentCreate} hands its `children` render function, so the form can be built with any UI.\n */\nexport interface BaseAgentCreateRenderProps {\n  agentTypes: SelectOption[];\n  error: string | null;\n  /**\n   * Sets one field of the form.\n   */\n  handleInputChange: (field: 'description' | 'name' | 'type', value: string) => void;\n  /**\n   * Submits the current values. Does nothing while they are not valid.\n   */\n  handleSubmit: () => void;\n  isSubmitting: boolean;\n  /**\n   * Whether the values can be submitted.\n   */\n  isValid: boolean;\n  onCancel?: () => void;\n  values: {description: string; name: string; type: string};\n}\n\nexport interface BaseAgentCreateProps {\n  /**\n   * The agent types to choose from. The first one is selected by default.\n   */\n  agentTypes: SelectOption[];\n  /**\n   * Renders custom UI in place of the default form. Receives the values, their setters, the agent\n   * types, the submit handler and the submission state.\n   */\n  children?: (props: BaseAgentCreateRenderProps) => ReactNode;\n  className?: string;\n  description?: string;\n  error?: string | null;\n  isSubmitting?: boolean;\n  onCancel?: () => void;\n  onSubmit: (agent: AgentCreateSubmission) => void;\n  preferences?: Preferences;\n  title?: string;\n}\n\n/**\n * A form that collects a new agent's name, type and description. Holds no data of its own: pass\n * the agent types and handle the submission.\n */\nconst BaseAgentCreate: FC<BaseAgentCreateProps> = ({\n  agentTypes,\n  children,\n  className,\n  description,\n  error = null,\n  isSubmitting = false,\n  onCancel,\n  onSubmit,\n  preferences,\n  title,\n}: BaseAgentCreateProps): ReactElement => {\n  const {theme, colorScheme} = useTheme();\n  const styles: Record<string, string> = useStyles(theme, colorScheme);\n  const {t} = useTranslation(preferences?.i18n);\n  const [name, setName] = useState<string>('');\n  const [chosenType, setType] = useState<string>('');\n  const type: string = chosenType || (agentTypes[0]?.value ?? '');\n  const [agentDescription, setAgentDescription] = useState<string>('');\n\n  const isValid: boolean = Boolean(name.trim()) && Boolean(type);\n\n  const submit = (): void => {\n    if (isValid) {\n      onSubmit({description: agentDescription.trim() || undefined, name: name.trim(), type});\n    }\n  };\n\n  const handleSubmit = (event: FormEvent<HTMLFormElement>): void => {\n    event.preventDefault();\n    submit();\n  };\n\n  if (children) {\n    const setters: Record<'description' | 'name' | 'type', (value: string) => void> = {\n      description: setAgentDescription,\n      name: setName,\n      type: setType,\n    };\n\n    return (\n      <div className={className}>\n        {children({\n          agentTypes,\n          error,\n          handleInputChange: (field: 'description' | 'name' | 'type', value: string): void => setters[field](value),\n          handleSubmit: submit,\n          isSubmitting,\n          isValid,\n          onCancel,\n          values: {description: agentDescription, name, type},\n        })}\n      </div>\n    );\n  }\n\n  return (\n    <AdminSection\n      block=\"agent-create\"\n      className={className}\n      title={title ?? t('admin.agents.create.title')}\n      description={description}\n      preferences={preferences}\n    >\n      <form className={styles['form']} onSubmit={handleSubmit} noValidate>\n        {error && (\n          <Alert variant=\"error\" role=\"alert\">\n            {error}\n          </Alert>\n        )}\n        <TextField\n          name=\"name\"\n          label={t('admin.agents.create.fields.name')}\n          required\n          value={name}\n          onChange={(event: ChangeEvent<HTMLInputElement>): void => setName(event.target.value)}\n        />\n        <Select\n          label={t('admin.agents.create.fields.type')}\n          name=\"type\"\n          required\n          value={type}\n          options={agentTypes}\n          onChange={(event: ChangeEvent<HTMLSelectElement>): void => setType(event.target.value)}\n        />\n        <TextField\n          name=\"description\"\n          label={t('admin.agents.create.fields.description')}\n          value={agentDescription}\n          onChange={(event: ChangeEvent<HTMLInputElement>): void => setAgentDescription(event.target.value)}\n        />\n        <div className={styles['formActions']}>\n          {onCancel && (\n            <Button type=\"button\" variant=\"text\" onClick={onCancel} disabled={isSubmitting}>\n              {t('admin.common.actions.cancel')}\n            </Button>\n          )}\n          <Button type=\"submit\" loading={isSubmitting} disabled={!isValid || isSubmitting}>\n            {t('admin.agents.create.submit')}\n          </Button>\n        </div>\n      </form>\n    </AdminSection>\n  );\n};\n\nexport default BaseAgentCreate;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsEA,MAAMA,mBAA6C,EACjD,YACA,UACA,WACA,aACA,QAAQ,MACR,eAAe,OACf,UACA,UACA,aACA,YACwC;CACxC,MAAM,EAAC,OAAO,gBAAeC,0BAAU;CACvC,MAAMC,SAAiCC,oCAAU,OAAO,YAAY;CACpE,MAAM,EAAC,MAAKC,+BAAe,aAAa,KAAK;CAC7C,MAAM,CAAC,MAAM,+BAA4B,GAAG;CAC5C,MAAM,CAAC,YAAY,+BAA4B,GAAG;CAClD,MAAMC,OAAe,eAAe,WAAW,IAAI,SAAS;CAC5D,MAAM,CAAC,kBAAkB,2CAAwC,GAAG;CAEpE,MAAMC,UAAmB,QAAQ,KAAK,MAAM,CAAC,IAAI,QAAQ,KAAK;CAE9D,MAAM,eAAqB;AACzB,MAAI,QACF,UAAS;GAAC,aAAa,iBAAiB,MAAM,IAAI;GAAW,MAAM,KAAK,MAAM;GAAE;GAAK,CAAC;;CAI1F,MAAM,gBAAgB,UAA4C;AAChE,QAAM,gBAAgB;AACtB,UAAQ;;AAGV,KAAI,UAAU;EACZ,MAAMC,UAA4E;GAChF,aAAa;GACb,MAAM;GACN,MAAM;GACP;AAED,SACE,2CAAC;GAAe;aACb,SAAS;IACR;IACA;IACA,oBAAoB,OAAwC,UAAwB,QAAQ,OAAO,MAAM;IACzG,cAAc;IACd;IACA;IACA;IACA,QAAQ;KAAC,aAAa;KAAkB;KAAM;KAAK;IACpD,CAAC;IACE;;AAIV,QACE,2CAACC;EACC,OAAM;EACK;EACX,OAAO,SAAS,EAAE,4BAA4B;EACjC;EACA;YAEb,4CAAC;GAAK,WAAW,OAAO;GAAS,UAAU;GAAc;;IACtD,SACC,2CAACC;KAAM,SAAQ;KAAQ,MAAK;eACzB;MACK;IAEV,2CAACC;KACC,MAAK;KACL,OAAO,EAAE,kCAAkC;KAC3C;KACA,OAAO;KACP,WAAW,UAA+C,QAAQ,MAAM,OAAO,MAAM;MACrF;IACF,2CAACC;KACC,OAAO,EAAE,kCAAkC;KAC3C,MAAK;KACL;KACA,OAAO;KACP,SAAS;KACT,WAAW,UAAgD,QAAQ,MAAM,OAAO,MAAM;MACtF;IACF,2CAACD;KACC,MAAK;KACL,OAAO,EAAE,yCAAyC;KAClD,OAAO;KACP,WAAW,UAA+C,oBAAoB,MAAM,OAAO,MAAM;MACjG;IACF,4CAAC;KAAI,WAAW,OAAO;gBACpB,YACC,2CAACE;MAAO,MAAK;MAAS,SAAQ;MAAO,SAAS;MAAU,UAAU;gBAC/D,EAAE,8BAA8B;OAC1B,EAEX,2CAACA;MAAO,MAAK;MAAS,SAAS;MAAc,UAAU,CAAC,WAAW;gBAChE,EAAE,6BAA6B;OACzB;MACL;;IACD;GACM;;AAInB,8BAAe"}