@dynamic-labs/sdk-react-core 2.1.0-alpha.9 → 2.1.1

package/src/lib/views/CollectUserDataView/UserDataFields/UserField/UserField.cjs

@@ -5,12 +5,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var formik = require('formik');
+var sdkApiCore = require('@dynamic-labs/sdk-api-core');
 require('react');
 require('../../../../events/dynamicEvents.cjs');
 require('../../../../../../_virtual/_tslib.cjs');
 require('@dynamic-labs/utils');
 require('../../../../context/DynamicContext/DynamicContext.cjs');
-require('@dynamic-labs/sdk-api-core');
 require('../../../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
@@ -27,6 +27,7 @@ require('react-international-phone');
 require('viem');
 require('viem/chains');
 require('../../../../config/ApiEndpoint.cjs');
+require('@dynamic-labs/store');
 require('../../../../locale/locale.cjs');
 require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
@@ -35,14 +36,16 @@ require('../../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
 require('../../../../context/WalletContext/WalletContext.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
+require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
 require('@dynamic-labs/types');
+require('../../../../context/LoadingContext/LoadingContext.cjs');
 require('yup');
 require('../../../../context/MockContext/MockContext.cjs');
-require('react-i18next');
+require('../../useFields.cjs');
 require('../../../../context/FieldsStateContext/FieldsStateContext.cjs');
-require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
+require('react-i18next');
 var Typography = require('../../../../components/Typography/Typography.cjs');
 require('../../../../context/FooterAnimationContext/index.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
@@ -52,9 +55,9 @@ require('../../../../components/Transition/OpacityTransition/OpacityTransition.c
 require('../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
 require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../../../context/MfaSettingsContext/MfaSettingsContext.cjs');
 require('../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
-require('../../../../context/LoadingContext/LoadingContext.cjs');
 require('../../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
@@ -76,28 +79,74 @@ require('../../../WalletList/WalletList.cjs');
 require('../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSection.cjs');
+require('../../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 var Select = require('../../../../components/Select/Select.cjs');
 
-const UserField = ({ fieldData: { key, label, type, autoComplete }, fieldSettings: { enabled, name, required, verify }, errors, touched, disabled, policiesConsentInnerComponentArray, }) => {
-    if (name === 'tShirtSize') {
-        return (jsxRuntime.jsx(formik.Field, { copykey: key, as: Select.Select, type: type, id: name, name: name, label: label, error: errors[name] && touched[name], selectDataTestId: 'tShirtSizeSelect', message: touched[name] && getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: index.tShirtSizes.map((size) => (jsxRuntime.jsx("option", { value: size, children: size }, size))) }, name));
-    }
-    else if (name === 'team') {
-        return (jsxRuntime.jsx(formik.Field, { copykey: key, as: Select.Select, type: type, id: name, name: name, label: label, error: errors[name] && touched[name], selectDataTestId: 'teamSelect', message: touched[name] && getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: index.teamNames.map((teamName) => (jsxRuntime.jsx("option", { value: teamName, children: teamName }, teamName))) }, name));
-    }
-    else if (name === 'country') {
-        return (jsxRuntime.jsx(formik.Field, { copykey: key, as: Select.Select, type: type, id: name, name: name, label: label, error: errors[name] && touched[name], selectDataTestId: 'countrySelect', message: touched[name] && getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: index.countryCodes.map((countryCode) => (jsxRuntime.jsx("option", { value: countryCode.code, children: countryCode.name }, countryCode.code))) }, name));
-    }
-    else if (name === 'policiesConsent') {
-        return (jsxRuntime.jsx("div", { role: 'group', "aria-labelledby": 'checkbox-group', className: 'user-field__checkbox-container', children: policiesConsentInnerComponentArray === null || policiesConsentInnerComponentArray === void 0 ? void 0 : policiesConsentInnerComponentArray.map((component, index) => (jsxRuntime.jsxs("div", { className: 'user-field__consent-checkbox', children: [jsxRuntime.jsx(formik.Field, { copykey: key, as: Checkbox.Checkbox, id: `policiesConsent_${index}`, name: 'policiesConsentArray', type: 'checkbox', value: `${index}`, disabled: disabled }, `policiesConsent_${index}`), jsxRuntime.jsx("label", { htmlFor: `policiesConsent_${index}`, className: 'user-field__checkbox-label', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', children: component }) })] }, `policiesConsent_${index}`))) }, 'policiesConsentGroup'));
-    }
-    else if (name === 'phoneNumber') {
-        return (jsxRuntime.jsx(formik.Field, { name: name, as: UserPhoneField.UserPhoneField, disabled: disabled, label: label, required: required, error: touched[name] && errors[name]
-                ? getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name])
-                : undefined, verify: verify, autoComplete: autoComplete }, name));
+const renderSelectField = ({ key, name, label, type, options, disabled, dataTestId }, { errors, touched }) => (jsxRuntime.jsx(formik.Field, { copykey: key, as: Select.Select, type: type, id: name, name: name, label: label, error: Boolean(errors[name] && touched[name]), selectDataTestId: dataTestId, message: touched[name] && getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: options.map((option) => typeof option === 'string' ? (jsxRuntime.jsx("option", { value: option, children: option }, option)) : (jsxRuntime.jsx("option", { value: option.value, children: option.label }, option.value))) }, name));
+const renderCheckboxGroup = (key, name, label, validationRules, errors, touched, disabled) => (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { role: 'group', "aria-labelledby": 'checkbox-group', className: `user-field__checkbox-container ${errors[name] && touched[name]
+                ? 'user-field__checkbox-container--error'
+                : ''}`, children: (validationRules === null || validationRules === void 0 ? void 0 : validationRules.checkboxText) && (jsxRuntime.jsxs("div", { className: 'user-field__consent-checkbox', children: [jsxRuntime.jsx(formik.Field, { as: Checkbox.Checkbox, id: key, name: name, type: 'checkbox', value: '0', disabled: disabled, selectDataTestId: 'customFieldCheckbox' }, key), jsxRuntime.jsx("label", { htmlFor: key, className: 'user-field__checkbox-label', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', children: validationRules.checkboxText }) })] }, key)) }, 'customConsentGroup'), touched[name] && getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name]) && (jsxRuntime.jsx(Typography.Typography, { variant: 'body_mini', className: 'user-field__error-message', children: `${name.charAt(0).toUpperCase() + name.slice(1)} is required` }))] }));
+const renderPoliciesConsentGroup = (key, policiesConsentInnerComponentArray, disabled) => (jsxRuntime.jsx("div", { role: 'group', "aria-labelledby": 'checkbox-group', className: 'user-field__checkbox-container', children: policiesConsentInnerComponentArray === null || policiesConsentInnerComponentArray === void 0 ? void 0 : policiesConsentInnerComponentArray.map((component, index) => (jsxRuntime.jsxs("div", { className: 'user-field__consent-checkbox', children: [jsxRuntime.jsx(formik.Field, { copykey: key, as: Checkbox.Checkbox, id: `policiesConsent_${index}`, name: 'policiesConsentArray', type: 'checkbox', value: `${index}`, disabled: disabled }, `policiesConsent_${index}`), jsxRuntime.jsx("label", { htmlFor: `policiesConsent_${index}`, className: 'user-field__checkbox-label', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', children: component }) })] }, `policiesConsent_${index}`))) }, 'policiesConsentGroup'));
+const UserField = ({ fieldData: { validationRules, isCustom, key, label, type, autoComplete }, fieldSettings: { enabled, name, required, verify }, errors, touched, disabled, policiesConsentInnerComponentArray, }) => {
+    if (isCustom) {
+        if (type === sdkApiCore.CustomFieldType.Select && (validationRules === null || validationRules === void 0 ? void 0 : validationRules.validOptions)) {
+            const options = validationRules.validOptions.map((opt) => opt.label);
+            return renderSelectField({
+                dataTestId: 'customFieldSelect',
+                disabled,
+                key,
+                label,
+                name,
+                options,
+                type,
+            }, { errors, touched });
+        }
+        else if (type === sdkApiCore.CustomFieldType.Checkbox) {
+            return renderCheckboxGroup(key, name, label, validationRules, errors, touched, disabled);
+        }
     }
-    else {
-        return (jsxRuntime.jsx(formik.Field, { copykey: key, disabled: disabled, as: Input.Input, type: type, id: name, name: name, label: label, optional: enabled && !required, error: errors[name] && touched[name], message: touched[name] && getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name]), autoComplete: autoComplete }, name));
+    switch (name) {
+        case 'tShirtSize':
+            return renderSelectField({
+                dataTestId: 'tShirtSizeSelect',
+                disabled,
+                key,
+                label,
+                name,
+                options: index.tShirtSizes,
+                type,
+            }, { errors, touched });
+        case 'team':
+            return renderSelectField({
+                dataTestId: 'teamSelect',
+                disabled,
+                key,
+                label,
+                name,
+                options: index.teamNames,
+                type,
+            }, { errors, touched });
+        case 'country':
+            return renderSelectField({
+                dataTestId: 'countrySelect',
+                disabled,
+                key,
+                label,
+                name,
+                options: index.countryCodes.map((countryCode) => ({
+                    label: countryCode.name,
+                    value: countryCode.code,
+                })),
+                type,
+            }, { errors, touched });
+        case 'policiesConsent':
+            return renderPoliciesConsentGroup(key, policiesConsentInnerComponentArray, disabled);
+        case 'phoneNumber':
+            return (jsxRuntime.jsx(formik.Field, { name: name, as: UserPhoneField.UserPhoneField, disabled: disabled, label: label, required: required, error: touched[name] && errors[name]
+                    ? getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name])
+                    : undefined, verify: verify, autoComplete: autoComplete }, name));
+        default:
+            return (jsxRuntime.jsx(formik.Field, { copykey: key, disabled: disabled, as: Input.Input, type: type, id: name, name: name, label: label, optional: enabled && !required, error: errors[name] && touched[name], message: touched[name] && getDisplayErrorMessage.getDisplayErrorMessage(label, errors[name]), autoComplete: autoComplete }, name));
     }
 };
 

package/src/lib/views/CollectUserDataView/UserDataFields/UserField/UserField.js

@@ -1,12 +1,12 @@
 'use client'
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Field } from 'formik';
+import { CustomFieldType } from '@dynamic-labs/sdk-api-core';
 import 'react';
 import '../../../../events/dynamicEvents.js';
 import '../../../../../../_virtual/_tslib.js';
 import '@dynamic-labs/utils';
 import '../../../../context/DynamicContext/DynamicContext.js';
-import '@dynamic-labs/sdk-api-core';
 import '../../../../shared/logger.js';
 import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
@@ -15,7 +15,7 @@ import '@dynamic-labs/wallet-book';
 import '../../../../utils/constants/colors.js';
 import '../../../../utils/constants/values.js';
 import '../../../../shared/utils/classes/storage/localStorage.js';
-import { tShirtSizes, teamNames, countryCodes } from '../../../../shared/consts/index.js';
+import { countryCodes, teamNames, tShirtSizes } from '../../../../shared/consts/index.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -23,6 +23,7 @@ import 'react-international-phone';
 import 'viem';
 import 'viem/chains';
 import '../../../../config/ApiEndpoint.js';
+import '@dynamic-labs/store';
 import '../../../../locale/locale.js';
 import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../../../context/AccountExistsContext/AccountExistsContext.js';
@@ -31,14 +32,16 @@ import '../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
 import '../../../../context/WalletContext/WalletContext.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
+import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
 import '@dynamic-labs/types';
+import '../../../../context/LoadingContext/LoadingContext.js';
 import 'yup';
 import '../../../../context/MockContext/MockContext.js';
-import 'react-i18next';
+import '../../useFields.js';
 import '../../../../context/FieldsStateContext/FieldsStateContext.js';
-import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
+import 'react-i18next';
 import { Typography } from '../../../../components/Typography/Typography.js';
 import '../../../../context/FooterAnimationContext/index.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
@@ -48,9 +51,9 @@ import '../../../../components/Transition/OpacityTransition/OpacityTransition.js
 import '../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
 import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../../context/MfaSettingsContext/MfaSettingsContext.js';
 import '../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
-import '../../../../context/LoadingContext/LoadingContext.js';
 import '../../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
@@ -72,28 +75,74 @@ import '../../../WalletList/WalletList.js';
 import '../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../../LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSection.js';
+import '../../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import { Select } from '../../../../components/Select/Select.js';
 
-const UserField = ({ fieldData: { key, label, type, autoComplete }, fieldSettings: { enabled, name, required, verify }, errors, touched, disabled, policiesConsentInnerComponentArray, }) => {
-    if (name === 'tShirtSize') {
-        return (jsx(Field, { copykey: key, as: Select, type: type, id: name, name: name, label: label, error: errors[name] && touched[name], selectDataTestId: 'tShirtSizeSelect', message: touched[name] && getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: tShirtSizes.map((size) => (jsx("option", { value: size, children: size }, size))) }, name));
-    }
-    else if (name === 'team') {
-        return (jsx(Field, { copykey: key, as: Select, type: type, id: name, name: name, label: label, error: errors[name] && touched[name], selectDataTestId: 'teamSelect', message: touched[name] && getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: teamNames.map((teamName) => (jsx("option", { value: teamName, children: teamName }, teamName))) }, name));
-    }
-    else if (name === 'country') {
-        return (jsx(Field, { copykey: key, as: Select, type: type, id: name, name: name, label: label, error: errors[name] && touched[name], selectDataTestId: 'countrySelect', message: touched[name] && getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: countryCodes.map((countryCode) => (jsx("option", { value: countryCode.code, children: countryCode.name }, countryCode.code))) }, name));
-    }
-    else if (name === 'policiesConsent') {
-        return (jsx("div", { role: 'group', "aria-labelledby": 'checkbox-group', className: 'user-field__checkbox-container', children: policiesConsentInnerComponentArray === null || policiesConsentInnerComponentArray === void 0 ? void 0 : policiesConsentInnerComponentArray.map((component, index) => (jsxs("div", { className: 'user-field__consent-checkbox', children: [jsx(Field, { copykey: key, as: Checkbox, id: `policiesConsent_${index}`, name: 'policiesConsentArray', type: 'checkbox', value: `${index}`, disabled: disabled }, `policiesConsent_${index}`), jsx("label", { htmlFor: `policiesConsent_${index}`, className: 'user-field__checkbox-label', children: jsx(Typography, { variant: 'body_small', color: 'secondary', children: component }) })] }, `policiesConsent_${index}`))) }, 'policiesConsentGroup'));
-    }
-    else if (name === 'phoneNumber') {
-        return (jsx(Field, { name: name, as: UserPhoneField, disabled: disabled, label: label, required: required, error: touched[name] && errors[name]
-                ? getDisplayErrorMessage(label, errors[name])
-                : undefined, verify: verify, autoComplete: autoComplete }, name));
+const renderSelectField = ({ key, name, label, type, options, disabled, dataTestId }, { errors, touched }) => (jsx(Field, { copykey: key, as: Select, type: type, id: name, name: name, label: label, error: Boolean(errors[name] && touched[name]), selectDataTestId: dataTestId, message: touched[name] && getDisplayErrorMessage(label, errors[name]), disabled: disabled, children: options.map((option) => typeof option === 'string' ? (jsx("option", { value: option, children: option }, option)) : (jsx("option", { value: option.value, children: option.label }, option.value))) }, name));
+const renderCheckboxGroup = (key, name, label, validationRules, errors, touched, disabled) => (jsxs("div", { children: [jsx("div", { role: 'group', "aria-labelledby": 'checkbox-group', className: `user-field__checkbox-container ${errors[name] && touched[name]
+                ? 'user-field__checkbox-container--error'
+                : ''}`, children: (validationRules === null || validationRules === void 0 ? void 0 : validationRules.checkboxText) && (jsxs("div", { className: 'user-field__consent-checkbox', children: [jsx(Field, { as: Checkbox, id: key, name: name, type: 'checkbox', value: '0', disabled: disabled, selectDataTestId: 'customFieldCheckbox' }, key), jsx("label", { htmlFor: key, className: 'user-field__checkbox-label', children: jsx(Typography, { variant: 'body_small', color: 'secondary', children: validationRules.checkboxText }) })] }, key)) }, 'customConsentGroup'), touched[name] && getDisplayErrorMessage(label, errors[name]) && (jsx(Typography, { variant: 'body_mini', className: 'user-field__error-message', children: `${name.charAt(0).toUpperCase() + name.slice(1)} is required` }))] }));
+const renderPoliciesConsentGroup = (key, policiesConsentInnerComponentArray, disabled) => (jsx("div", { role: 'group', "aria-labelledby": 'checkbox-group', className: 'user-field__checkbox-container', children: policiesConsentInnerComponentArray === null || policiesConsentInnerComponentArray === void 0 ? void 0 : policiesConsentInnerComponentArray.map((component, index) => (jsxs("div", { className: 'user-field__consent-checkbox', children: [jsx(Field, { copykey: key, as: Checkbox, id: `policiesConsent_${index}`, name: 'policiesConsentArray', type: 'checkbox', value: `${index}`, disabled: disabled }, `policiesConsent_${index}`), jsx("label", { htmlFor: `policiesConsent_${index}`, className: 'user-field__checkbox-label', children: jsx(Typography, { variant: 'body_small', color: 'secondary', children: component }) })] }, `policiesConsent_${index}`))) }, 'policiesConsentGroup'));
+const UserField = ({ fieldData: { validationRules, isCustom, key, label, type, autoComplete }, fieldSettings: { enabled, name, required, verify }, errors, touched, disabled, policiesConsentInnerComponentArray, }) => {
+    if (isCustom) {
+        if (type === CustomFieldType.Select && (validationRules === null || validationRules === void 0 ? void 0 : validationRules.validOptions)) {
+            const options = validationRules.validOptions.map((opt) => opt.label);
+            return renderSelectField({
+                dataTestId: 'customFieldSelect',
+                disabled,
+                key,
+                label,
+                name,
+                options,
+                type,
+            }, { errors, touched });
+        }
+        else if (type === CustomFieldType.Checkbox) {
+            return renderCheckboxGroup(key, name, label, validationRules, errors, touched, disabled);
+        }
     }
-    else {
-        return (jsx(Field, { copykey: key, disabled: disabled, as: Input, type: type, id: name, name: name, label: label, optional: enabled && !required, error: errors[name] && touched[name], message: touched[name] && getDisplayErrorMessage(label, errors[name]), autoComplete: autoComplete }, name));
+    switch (name) {
+        case 'tShirtSize':
+            return renderSelectField({
+                dataTestId: 'tShirtSizeSelect',
+                disabled,
+                key,
+                label,
+                name,
+                options: tShirtSizes,
+                type,
+            }, { errors, touched });
+        case 'team':
+            return renderSelectField({
+                dataTestId: 'teamSelect',
+                disabled,
+                key,
+                label,
+                name,
+                options: teamNames,
+                type,
+            }, { errors, touched });
+        case 'country':
+            return renderSelectField({
+                dataTestId: 'countrySelect',
+                disabled,
+                key,
+                label,
+                name,
+                options: countryCodes.map((countryCode) => ({
+                    label: countryCode.name,
+                    value: countryCode.code,
+                })),
+                type,
+            }, { errors, touched });
+        case 'policiesConsent':
+            return renderPoliciesConsentGroup(key, policiesConsentInnerComponentArray, disabled);
+        case 'phoneNumber':
+            return (jsx(Field, { name: name, as: UserPhoneField, disabled: disabled, label: label, required: required, error: touched[name] && errors[name]
+                    ? getDisplayErrorMessage(label, errors[name])
+                    : undefined, verify: verify, autoComplete: autoComplete }, name));
+        default:
+            return (jsx(Field, { copykey: key, disabled: disabled, as: Input, type: type, id: name, name: name, label: label, optional: enabled && !required, error: errors[name] && touched[name], message: touched[name] && getDisplayErrorMessage(label, errors[name]), autoComplete: autoComplete }, name));
     }
 };
 

package/src/lib/views/CollectUserDataView/UserDataFields/UserPhoneField/UserPhoneField.cjs

@@ -27,6 +27,7 @@ var getCustomCountries = require('../../../../utils/functions/getCustomCountries
 require('viem');
 require('viem/chains');
 require('../../../../config/ApiEndpoint.cjs');
+require('@dynamic-labs/store');
 require('../../../../locale/locale.cjs');
 require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
@@ -35,14 +36,16 @@ require('../../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
 require('../../../../context/WalletContext/WalletContext.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
+require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
 require('@dynamic-labs/types');
+require('../../../../context/LoadingContext/LoadingContext.cjs');
 require('yup');
 require('../../../../context/MockContext/MockContext.cjs');
-require('react-i18next');
+require('../../useFields.cjs');
 var FieldsStateContext = require('../../../../context/FieldsStateContext/FieldsStateContext.cjs');
-require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
+require('react-i18next');
 var Typography = require('../../../../components/Typography/Typography.cjs');
 require('../../../../context/FooterAnimationContext/index.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
@@ -52,9 +55,9 @@ require('../../../../components/Transition/OpacityTransition/OpacityTransition.c
 require('../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
 require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../../../context/MfaSettingsContext/MfaSettingsContext.cjs');
 require('../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
-require('../../../../context/LoadingContext/LoadingContext.cjs');
 require('../../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
@@ -75,6 +78,7 @@ require('../../../WalletList/WalletList.cjs');
 require('../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSection.cjs');
+require('../../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 
 const UserPhoneField = ({ onChange, value: phone, onBlur, disabled, label, required, error, name, verify, }) => {
     const { selectedPhoneCountry } = FieldsStateContext.useFieldsState();

package/src/lib/views/CollectUserDataView/UserDataFields/UserPhoneField/UserPhoneField.js

@@ -23,6 +23,7 @@ import { getCustomCountries } from '../../../../utils/functions/getCustomCountri
 import 'viem';
 import 'viem/chains';
 import '../../../../config/ApiEndpoint.js';
+import '@dynamic-labs/store';
 import '../../../../locale/locale.js';
 import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../../../context/AccountExistsContext/AccountExistsContext.js';
@@ -31,14 +32,16 @@ import '../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
 import '../../../../context/WalletContext/WalletContext.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
+import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
 import '@dynamic-labs/types';
+import '../../../../context/LoadingContext/LoadingContext.js';
 import 'yup';
 import '../../../../context/MockContext/MockContext.js';
-import 'react-i18next';
+import '../../useFields.js';
 import { useFieldsState } from '../../../../context/FieldsStateContext/FieldsStateContext.js';
-import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
+import 'react-i18next';
 import { Typography } from '../../../../components/Typography/Typography.js';
 import '../../../../context/FooterAnimationContext/index.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
@@ -48,9 +51,9 @@ import '../../../../components/Transition/OpacityTransition/OpacityTransition.js
 import '../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
 import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../../context/MfaSettingsContext/MfaSettingsContext.js';
 import '../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
-import '../../../../context/LoadingContext/LoadingContext.js';
 import '../../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
@@ -71,6 +74,7 @@ import '../../../WalletList/WalletList.js';
 import '../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../../LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSection.js';
+import '../../../../context/IpConfigurationContext/IpConfigurationContext.js';
 
 const UserPhoneField = ({ onChange, value: phone, onBlur, disabled, label, required, error, name, verify, }) => {
     const { selectedPhoneCountry } = useFieldsState();

package/src/lib/views/CollectUserDataView/useFields.cjs

@@ -27,8 +27,14 @@ require('react-international-phone');
 require('viem');
 require('viem/chains');
 require('../../config/ApiEndpoint.cjs');
+require('@dynamic-labs/store');
 require('../../locale/locale.cjs');
 
+const customFieldValidationMap = {
+    checkbox: yup.array(),
+    select: yup.string(),
+    text: yup.string(),
+};
 const useFields = () => {
     const { t } = reactI18next.useTranslation();
     const { selectedPhoneCountry } = FieldsStateContext.useFieldsState();
@@ -119,4 +125,5 @@ const useFields = () => {
     return { fieldsConfig };
 };
 
+exports.customFieldValidationMap = customFieldValidationMap;
 exports.useFields = useFields;

package/src/lib/views/CollectUserDataView/useFields.d.ts

@@ -1,10 +1,18 @@
-import { BooleanSchema, StringSchema } from 'yup';
+import { StringSchema, ArraySchema, BooleanSchema } from 'yup';
+import { CustomFieldValidationRules } from '@dynamic-labs/sdk-api-core';
 export type FieldConfig = {
     label: string;
     key: string;
     type: string;
-    validation: StringSchema | BooleanSchema;
+    validation: StringSchema | BooleanSchema | ArraySchema<any>;
     autoComplete?: string;
+    isCustom?: boolean;
+    validationRules?: CustomFieldValidationRules;
+};
+export declare const customFieldValidationMap: {
+    checkbox: import("yup/lib/array").OptionalArraySchema<import("yup").AnySchema, import("yup/lib/types").AnyObject, any[] | undefined>;
+    select: StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
+    text: StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
 };
 export declare const useFields: () => {
     fieldsConfig: {

package/src/lib/views/CollectUserDataView/useFields.js

@@ -1,7 +1,7 @@
 'use client'
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { string, boolean } from 'yup';
+import { array, string, boolean } from 'yup';
 import { useFieldsState } from '../../context/FieldsStateContext/FieldsStateContext.js';
 import '@dynamic-labs/sdk-api-core';
 import '../../shared/logger.js';
@@ -23,8 +23,14 @@ import 'react-international-phone';
 import 'viem';
 import 'viem/chains';
 import '../../config/ApiEndpoint.js';
+import '@dynamic-labs/store';
 import '../../locale/locale.js';
 
+const customFieldValidationMap = {
+    checkbox: array(),
+    select: string(),
+    text: string(),
+};
 const useFields = () => {
     const { t } = useTranslation();
     const { selectedPhoneCountry } = useFieldsState();
@@ -115,4 +121,4 @@ const useFields = () => {
     return { fieldsConfig };
 };
 
-export { useFields };
+export { customFieldValidationMap, useFields };

package/src/lib/views/CollectUserDataViewNoWallet/CollectUserDataViewNoWallet.cjs

@@ -24,13 +24,13 @@ require('../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../context/ErrorContext/ErrorContext.cjs');
-var createUserProfile = require('../../utils/functions/createUserProfile/createUserProfile.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
 var getUserIdentifier = require('../../utils/functions/getUserIdentifier/getUserIdentifier.cjs');
 require('viem');
 require('viem/chains');
 require('../../config/ApiEndpoint.cjs');
+require('@dynamic-labs/store');
 require('../../locale/locale.cjs');
 require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../context/AccountExistsContext/AccountExistsContext.cjs');
@@ -39,11 +39,13 @@ require('../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
 require('../../context/WalletContext/WalletContext.cjs');
 require('../../context/ThemeContext/ThemeContext.cjs');
+require('../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
 require('@dynamic-labs/types');
+require('../../context/LoadingContext/LoadingContext.cjs');
 require('yup');
 require('../../context/MockContext/MockContext.cjs');
+require('../CollectUserDataView/useFields.cjs');
 require('../../context/FieldsStateContext/FieldsStateContext.cjs');
-require('../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
 require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 var Typography = require('../../components/Typography/Typography.cjs');
@@ -55,9 +57,9 @@ require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
 require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../context/MfaSettingsContext/MfaSettingsContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
-require('../../context/LoadingContext/LoadingContext.cjs');
 var Icon = require('../../components/Icon/Icon.cjs');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/IconButton/IconButton.cjs');
@@ -81,16 +83,16 @@ require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/Secondar
 require('@hcaptcha/react-hcaptcha');
 var UserAvatar = require('../../components/UserAvatar/UserAvatar.cjs');
 require('../LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSection.cjs');
+require('../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 
 const CollectUserDataViewNoWallet = ({ userIdentification, userIdentificationOverride }) => {
     var _a;
-    const { appName, handleLogOut, projectSettings, onboardingImageUrl, decodedOnboardingOnlyToken, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { appName, handleLogOut, projectSettings, onboardingImageUrl, unauthenticatedUser, } = useInternalDynamicContext.useInternalDynamicContext();
     const { t } = reactI18next.useTranslation();
-    if (!decodedOnboardingOnlyToken) {
+    if (!unauthenticatedUser) {
         return null;
     }
-    const userProfile = createUserProfile.createUserProfile(decodedOnboardingOnlyToken);
-    return (jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet', "data-testid": 'collect-user-data-login-no-wallet', children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'collect-user-data-login-no-wallet__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet__user-info-container', children: [jsxRuntime.jsx("div", { className: 'collect-user-data-login-no-wallet__icon-container', children: jsxRuntime.jsx(UserAvatar.UserAvatar, { user: userProfile }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', weight: 'medium', className: 'collect-user-data-login-no-wallet__user-identification', children: (_a = userIdentificationOverride !== null && userIdentificationOverride !== void 0 ? userIdentificationOverride : userProfile[userIdentification]) !== null && _a !== void 0 ? _a : getUserIdentifier.getUserIdentifier(userProfile) })] }), jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet__form', children: [jsxRuntime.jsx("div", { className: 'collect-user-data-login-no-wallet__success-icon', children: jsxRuntime.jsx(Icon.Icon, { color: 'text-primary', size: 'large', children: jsxRuntime.jsx(checkConnection.ReactComponent, {}) }) }), jsxRuntime.jsx(OnboardingUserDataForm.OnboardingUserDataForm, { userProfile: userProfile, children: jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet__welcome-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', className: 'collect-user-data-login-no-wallet__welcome-title', copykey: 'dyn_collect_user_data.greeting', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
+    return (jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet', "data-testid": 'collect-user-data-login-no-wallet', children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'collect-user-data-login-no-wallet__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet__user-info-container', children: [jsxRuntime.jsx("div", { className: 'collect-user-data-login-no-wallet__icon-container', children: jsxRuntime.jsx(UserAvatar.UserAvatar, { user: unauthenticatedUser }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', weight: 'medium', className: 'collect-user-data-login-no-wallet__user-identification', children: (_a = userIdentificationOverride !== null && userIdentificationOverride !== void 0 ? userIdentificationOverride : unauthenticatedUser[userIdentification]) !== null && _a !== void 0 ? _a : getUserIdentifier.getUserIdentifier(unauthenticatedUser) })] }), jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet__form', children: [jsxRuntime.jsx("div", { className: 'collect-user-data-login-no-wallet__success-icon', children: jsxRuntime.jsx(Icon.Icon, { color: 'text-primary', size: 'large', children: jsxRuntime.jsx(checkConnection.ReactComponent, {}) }) }), jsxRuntime.jsx(OnboardingUserDataForm.OnboardingUserDataForm, { userProfile: unauthenticatedUser, children: jsxRuntime.jsxs("div", { className: 'collect-user-data-login-no-wallet__welcome-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', className: 'collect-user-data-login-no-wallet__welcome-title', copykey: 'dyn_collect_user_data.greeting', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                         t('dyn_collect_user_data.greeting', { appName }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', copykey: 'dyn_collect_user_data.description', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
                                         t('dyn_collect_user_data.description') })] }) }), jsxRuntime.jsx(TextButton.TextButton, { className: 'collect-user-data-login-no-wallet__log-out', onClick: handleLogOut, copykey: 'dyn_collect_user_data.log_out_button', children: t('dyn_collect_user_data.log_out_button') })] })] }));
 };