@evoke-platform/ui-components 1.15.0 → 1.15.1

package/dist/published/components/custom/CriteriaBuilder/CriteriaBuilder.js

@@ -390,7 +390,10 @@ const CriteriaBuilder = (props) => {
                 return defaultRuleProcessorMongoDB(newRule, options);
             },
         }));
-        if (!isEmpty(difference(newCriteria, { $and: [{ $expr: true }] }))) {
+        if (isEmpty(difference(newCriteria, criteria))) {
+            return;
+        }
+        else if (!isEmpty(difference(newCriteria, { $and: [{ $expr: true }] }))) {
             setCriteria(newCriteria);
         }
         else {

package/dist/published/components/custom/FormV2/FormRenderer.js

@@ -30,7 +30,6 @@ const FormRendererInternal = (props) => {
     const [fetchedOptions, setFetchedOptions] = useState({});
     const [expandAll, setExpandAll] = useState();
     const [action, setAction] = useState();
-    const [triggerFieldReset, setTriggerFieldReset] = useState(false);
     const [isInitializing, setIsInitializing] = useState(true);
     const [parameters, setParameters] = useState();
     const validationContainerRef = useRef(null);
@@ -83,9 +82,6 @@ const FormRendererInternal = (props) => {
                     setValue(key, value[key], { shouldValidate: true });
                 }
             }
-            if (triggerFieldReset === true) {
-                setTriggerFieldReset(false);
-            }
         }
     }, [value]);
     const handleReset = () => {
@@ -95,7 +91,6 @@ const FormRendererInternal = (props) => {
         else {
             reset(instance); // clears react-hook-form state back to default values
         }
-        setTriggerFieldReset(true);
     };
     useEffect(() => {
         handleValidation(entries, register, getValues(), action?.parameters, instance);
@@ -209,7 +204,6 @@ const FormRendererInternal = (props) => {
                 fieldHeight,
                 handleChange: onChange,
                 onAutosave,
-                triggerFieldReset,
                 showSubmitError: isSubmitted,
                 associatedObject,
                 form,

package/dist/published/components/custom/FormV2/FormRendererContainer.js

@@ -1,8 +1,8 @@
 import { useApiServices, useApp, useAuthenticationContext, useNavigate, useObject, } from '@evoke-platform/context';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import axios from 'axios';
-import { cloneDeep, get, isArray, isEmpty, isEqual, omit, pick, set } from 'lodash';
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import { cloneDeep, get, isArray, isEmpty, isEqual, isObject, pick, set } from 'lodash';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Skeleton, Snackbar } from '../../core';
 import { Box } from '../../layout';
 import ErrorComponent from '../ErrorComponent';
@@ -11,6 +11,7 @@ import { evalDefaultVals, processValueUpdate } from './components/DefaultValues'
 import Header from './components/Header';
 import { convertPropertiesToParams, createFileLinks, deleteDocuments, encodePageSlug, extractAllCriteria, extractPresetValuesFromCriteria, extractPresetValuesFromDynamicDefaultValues, formatSubmission, getEntryId, getPrefixedUrl, getUnnestedEntries, isAddressProperty, isEmptyWithDefault, plainTextToRtf, useFormById, } from './components/utils';
 import FormRenderer from './FormRenderer';
+import { DepGraph } from 'dependency-graph';
 // Wrapper to provide QueryClient context for FormRendererContainer if this is not a nested form
 function FormRendererContainer(props) {
     return (React.createElement(ConditionalQueryClientProvider, null,
@@ -23,7 +24,7 @@ function FormRendererContainerInner(props) {
     const navigateTo = useNavigate();
     const queryClient = useQueryClient();
     const { id: appId } = useApp();
-    const [parameters, setParameters] = useState();
+    const [parameters, setParameters] = useState([]);
     const formDataRef = useRef();
     // We only need the setter to force a re-render when form data updates; the value itself
     // is intentionally not referenced elsewhere to avoid stale reads (we use formDataRef).
@@ -53,7 +54,54 @@ function FormRendererContainerInner(props) {
     const [isSaving, setIsSaving] = useState(false);
     const [lastSavedData, setLastSavedData] = useState({});
     const [uniquePresetValues, setUniquePresetValues] = useState([]);
-    const flattenFormEntries = useMemo(() => getUnnestedEntries(form?.entries || []), [form?.entries]);
+    const flattenFormEntries = useMemo(() => {
+        const graph = new DepGraph({ circular: true });
+        const unnestedEntries = getUnnestedEntries(form?.entries || []);
+        const nonInputEntries = [];
+        for (const entry of unnestedEntries) {
+            const entryId = getEntryId(entry);
+            if (entryId && entry.type !== 'readonlyField') {
+                graph.addNode(entryId, entry);
+            }
+            else {
+                nonInputEntries.push(entry);
+            }
+        }
+        for (const entry of unnestedEntries) {
+            const entryId = getEntryId(entry);
+            if (entryId && (entry.type === 'input' || entry.type === 'inputField')) {
+                const { defaultValue } = entry.display || {};
+                let presetValues = [];
+                if (typeof defaultValue === 'string') {
+                    presetValues = extractPresetValuesFromDynamicDefaultValues([entry]);
+                }
+                else if (isObject(defaultValue) && 'criteria' in defaultValue && !isEmpty(defaultValue.criteria)) {
+                    presetValues = extractPresetValuesFromCriteria(defaultValue.criteria);
+                }
+                presetValues.forEach((presetValue) => {
+                    const fragments = presetValue.replace(/{{{input.|}}}|{{input.|}}/g, '').split('.');
+                    // preset value references top level fields i.e name or dateOfBirth
+                    if (fragments.length === 1 && graph.hasNode(fragments[0])) {
+                        graph.addDependency(entryId, fragments[0]);
+                    }
+                    else if (fragments.length > 1) {
+                        // preset value references nested fields i.e address.line1 or person.address.line1
+                        const addressKeys = ['line1', 'line2', 'city', 'county', 'state', 'zipCode', 'country'];
+                        if (addressKeys.includes(fragments[1]) && graph.hasNode(`${fragments[0]}.${fragments[1]}`)) {
+                            graph.addDependency(entryId, `${fragments[0]}.${fragments[1]}`);
+                        }
+                        else if (graph.hasNode(fragments[0])) {
+                            graph.addDependency(entryId, fragments[0]);
+                        }
+                    }
+                });
+            }
+        }
+        return graph
+            .overallOrder()
+            .map((id) => graph.getNodeData(id))
+            .concat(nonInputEntries);
+    }, [form?.entries]);
     const userAccount = useAuthenticationContext()?.account;
     const objectStore = useObject(form?.objectId ?? objectId);
     const onError = (err) => {
@@ -71,7 +119,7 @@ function FormRendererContainerInner(props) {
     });
     // trigger refetch on success
     const { data: instance, error: instanceError } = useQuery({
-        queryKey: [objectId, instanceId, 'instance'],
+        queryKey: [objectId, instanceId, 'instance', uniquePresetValues],
         queryFn: async () => {
             const instance = await apiServices.get(getPrefixedUrl(`/objects/${objectId}/instances/${instanceId}`), {
                 params: {
@@ -93,6 +141,87 @@ function FormRendererContainerInner(props) {
         staleTime: Infinity,
         enabled: !!instanceId && !!sanitizedObject,
     });
+    const getDefaultValues = useCallback(async (unnestedEntries, instanceData) => {
+        const result = cloneDeep(instanceData);
+        for (const entry of unnestedEntries) {
+            const fieldId = getEntryId(entry);
+            if (!fieldId)
+                continue;
+            const fieldValue = get(result, fieldId);
+            if ((entry.type === 'input' || entry.type === 'inputField') &&
+                isAddressProperty(entry.parameterId || entry.input?.id)) {
+                if ((isEmpty(result) || fieldValue === undefined || fieldValue === null || fieldValue === '') &&
+                    entry?.display?.defaultValue &&
+                    parameters) {
+                    const defaultValuesArray = await evalDefaultVals(parameters, entry, fieldValue, fieldId, apiServices, userAccount, result);
+                    if (isArray(defaultValuesArray)) {
+                        defaultValuesArray.forEach(({ fieldId, fieldValue }) => {
+                            set(result, fieldId, fieldValue);
+                        });
+                    }
+                }
+                else if (fieldValue !== undefined && fieldValue !== null) {
+                    set(result, fieldId, fieldValue);
+                }
+            }
+            else if (entry.type !== 'sections' && entry.type !== 'columns' && entry.type !== 'content') {
+                const parameter = parameters?.find((param) => param.id === fieldId);
+                if (associatedObject?.propertyId === fieldId &&
+                    associatedObject?.instanceId &&
+                    parameter &&
+                    action?.type === 'create') {
+                    try {
+                        const instance = await apiServices.get(getPrefixedUrl(`/objects/${parameter.objectId}/instances/${associatedObject.instanceId}`), {
+                            params: {
+                                expand: uniquePresetValues.filter((value) => value.startsWith(`{{{input.${fieldId}.`) ||
+                                    value.startsWith(`{{input.${fieldId}.`)),
+                            },
+                        });
+                        result[associatedObject.propertyId] = instance;
+                    }
+                    catch (error) {
+                        console.error(error);
+                    }
+                }
+                else if (entry.type === 'formlet') {
+                    // TODO: this should eventually fetch the formletId then get the fields and default values of those fields
+                }
+                else if (entry.type !== 'readonlyField') {
+                    if (isEmptyWithDefault(fieldValue, entry, result)) {
+                        if (fieldId && parameters && parameters.length > 0) {
+                            const defaultValuesArray = await evalDefaultVals(parameters, entry, fieldValue, fieldId, apiServices, userAccount, result);
+                            for (const { fieldId, fieldValue } of defaultValuesArray) {
+                                const parameter = parameters?.find((param) => param.id === fieldId);
+                                if (parameter?.type === 'object') {
+                                    const dependentFields = await processValueUpdate(unnestedEntries, parameters, fieldValue, apiServices, fieldId, formDataRef.current, userAccount);
+                                    for (const field of dependentFields) {
+                                        set(result, field.fieldId, field.fieldValue);
+                                    }
+                                }
+                                set(result, fieldId, fieldValue);
+                            }
+                        }
+                    }
+                    else if (parameter?.type === 'boolean' && (fieldValue === undefined || fieldValue === null)) {
+                        result[fieldId] = false;
+                    }
+                    else if (fieldValue !== undefined && fieldValue !== null) {
+                        if (parameter?.type === 'richText' && typeof fieldValue === 'string') {
+                            let RTFFieldValue = fieldValue;
+                            if (!fieldValue.trim().startsWith('{\\rtf')) {
+                                RTFFieldValue = plainTextToRtf(fieldValue);
+                            }
+                            result[fieldId] = RTFFieldValue;
+                        }
+                        else {
+                            result[fieldId] = fieldValue;
+                        }
+                    }
+                }
+            }
+        }
+        return result;
+    }, [action, parameters, associatedObject, uniquePresetValues, formDataRef, apiServices, userAccount]);
     useEffect(() => {
         if (!sanitizedObject)
             return;
@@ -113,7 +242,7 @@ function FormRendererContainerInner(props) {
         else {
             setError('Action could not be found');
         }
-    }, [sanitizedObject, actionId, form?.actionId, instanceId]);
+    }, [sanitizedObject, actionId, form?.actionId, instanceId, flattenFormEntries, parameters]);
     const { data: navigationSlug } = useQuery({
         queryKey: [appId, 'navigationSlug'],
         queryFn: () => apiServices.get(getPrefixedUrl(`/apps/${appId}/pages/${encodePageSlug(pageNavigation)}`)),
@@ -159,11 +288,12 @@ function FormRendererContainerInner(props) {
             onError(error);
     }, [sanitizedObjectError, fetchedFormError, instanceError]);
     useEffect(() => {
-        if (!form)
+        if (!form || !action)
             return;
         // If no parameters are defined, then the action is synced with object properties
-        const getParamsFromObject = sanitizedObject && !action?.parameters;
-        setParameters(getParamsFromObject ? convertPropertiesToParams(sanitizedObject) : action?.parameters);
+        const getParamsFromObject = sanitizedObject && !action.parameters;
+        const parameters = (getParamsFromObject ? convertPropertiesToParams(sanitizedObject) : action.parameters) ?? [];
+        setParameters(parameters.filter((param) => param.type !== 'collection' && !param.formula));
     }, [form, action?.parameters, sanitizedObject]);
     useEffect(() => {
         const getInitialValues = async () => {
@@ -175,7 +305,7 @@ function FormRendererContainerInner(props) {
             }
         };
         getInitialValues();
-    }, [instanceId, instance, flattenFormEntries]);
+    }, [instanceId, instance, flattenFormEntries, getDefaultValues]);
     const onSubmissionSuccess = (updatedInstance) => {
         setSnackbarError({
             showAlert: true,
@@ -222,9 +352,7 @@ function FormRendererContainerInner(props) {
             if (action?.type === 'create') {
                 const response = await apiServices.post(getPrefixedUrl(`/objects/${form.objectId}/instances/actions`), {
                     actionId: form.actionId,
-                    input: omit(submission, sanitizedObject?.properties
-                        ?.filter((property) => property.formula || property.type === 'collection')
-                        .map((property) => property.id) ?? []),
+                    input: pick(submission, parameters.map((parameter) => parameter.id)),
                 });
                 if (response) {
                     // Manually link files to created instance.
@@ -235,9 +363,7 @@ function FormRendererContainerInner(props) {
             else if (instanceId && action) {
                 const response = await objectStore.instanceAction(instanceId, {
                     actionId: action.id,
-                    input: omit(submission, sanitizedObject?.properties
-                        ?.filter((property) => property.formula || property.type === 'collection')
-                        .map((property) => property.id) ?? []),
+                    input: pick(submission, parameters.map((parameter) => parameter.id)),
                 });
                 if (sanitizedObject && instance) {
                     onSubmissionSuccess(response);
@@ -258,79 +384,6 @@ function FormRendererContainerInner(props) {
             throw error; // Throw error so caller knows submission failed
         }
     };
-    const getDefaultValues = async (unnestedEntries, instanceData) => {
-        const result = {};
-        for (const entry of unnestedEntries) {
-            const fieldId = getEntryId(entry);
-            if (!fieldId)
-                continue;
-            const fieldValue = get(instanceData, fieldId);
-            if ((entry.type === 'input' || entry.type === 'inputField') &&
-                isAddressProperty(entry.parameterId || entry.input?.id)) {
-                if ((isEmpty(instanceData) || fieldValue === undefined || fieldValue === null || fieldValue === '') &&
-                    entry?.display?.defaultValue &&
-                    parameters) {
-                    const defaultValuesArray = await evalDefaultVals(parameters, unnestedEntries, entry, fieldValue, fieldId, apiServices, userAccount, instanceData);
-                    if (isArray(defaultValuesArray)) {
-                        defaultValuesArray.forEach(({ fieldId, fieldValue }) => {
-                            set(result, fieldId, fieldValue);
-                        });
-                    }
-                }
-                else if (fieldValue !== undefined && fieldValue !== null) {
-                    set(result, fieldId, fieldValue);
-                }
-            }
-            else if (entry.type !== 'sections' && entry.type !== 'columns' && entry.type !== 'content') {
-                const parameter = parameters?.find((param) => param.id === fieldId);
-                if (associatedObject?.propertyId === fieldId &&
-                    associatedObject?.instanceId &&
-                    parameter &&
-                    action?.type === 'create') {
-                    try {
-                        const instance = await apiServices.get(getPrefixedUrl(`/objects/${parameter.objectId}/instances/${associatedObject.instanceId}`));
-                        result[associatedObject.propertyId] = instance;
-                    }
-                    catch (error) {
-                        console.error(error);
-                    }
-                }
-                else if (entry.type !== 'readonlyField') {
-                    if (isEmptyWithDefault(fieldValue, entry, instanceData)) {
-                        if (fieldId && parameters && parameters.length > 0) {
-                            const defaultValuesArray = await evalDefaultVals(parameters, unnestedEntries, entry, fieldValue, fieldId, apiServices, userAccount, instanceData);
-                            for (const { fieldId, fieldValue } of defaultValuesArray) {
-                                const parameter = parameters?.find((param) => param.id === fieldId);
-                                if (parameter?.type === 'object') {
-                                    const dependentFields = await processValueUpdate(unnestedEntries, parameters, fieldValue, apiServices, fieldId, formDataRef.current, userAccount);
-                                    for (const field of dependentFields) {
-                                        set(result, field.fieldId, field.fieldValue);
-                                    }
-                                }
-                                set(result, fieldId, fieldValue);
-                            }
-                        }
-                    }
-                    else if (parameter?.type === 'boolean' && (fieldValue === undefined || fieldValue === null)) {
-                        result[fieldId] = false;
-                    }
-                    else if (fieldValue !== undefined && fieldValue !== null) {
-                        if (parameter?.type === 'richText' && typeof fieldValue === 'string') {
-                            let RTFFieldValue = fieldValue;
-                            if (!fieldValue.trim().startsWith('{\\rtf')) {
-                                RTFFieldValue = plainTextToRtf(fieldValue);
-                            }
-                            result[fieldId] = RTFFieldValue;
-                        }
-                        else {
-                            result[fieldId] = fieldValue;
-                        }
-                    }
-                }
-            }
-        }
-        return result;
-    };
     const removeUneditedProtectedValues = (data) => {
         const protectedProperties = sanitizedObject?.properties?.filter((prop) => prop.protection?.maskChar);
         if (!protectedProperties || protectedProperties.length === 0) {
@@ -385,21 +438,19 @@ function FormRendererContainerInner(props) {
             !flattenFormEntries.some((e) => (e.type === 'input' && e.parameterId === id) || (e.type === 'inputField' && e.input.id === id));
         if (isReadOnlyField)
             return;
-        if (parameter) {
-            if (parameter.type === 'object' && parameters && parameters.length > 0) {
+        if (parameter?.type === 'string' && parameter.enum && value) {
+            // If a single select property has a sortBy option that isn't NONE the value gets spread and doesn't save properly,
+            // this will make it correctly save the value
+            value = value.value ? value.value : value;
+        }
+        if (!isEqual(value, get(formDataRef.current, id))) {
+            if (parameter?.type === 'object' && parameters && parameters.length > 0) {
                 // On change of a related object, update default values dependent on that object
                 const dependentFields = await processValueUpdate(flattenFormEntries, parameters, value, apiServices, id, formDataRef.current, userAccount);
                 for (const field of dependentFields) {
                     onChange(field.fieldId, field.fieldValue);
                 }
             }
-            else if (parameter.type === 'string' && parameter.enum && value) {
-                // If a single select property has a sortBy option that isn't NONE the value gets spread and doesn't save properly,
-                // this will make it correctly save the value
-                value = value.value ? value.value : value;
-            }
-        }
-        if (!isEqual(value, get(formDataRef.current, id))) {
             const newData = { ...formDataRef.current };
             set(newData, id, value);
             setFormData(newData);

package/dist/published/components/custom/FormV2/components/DefaultValues.d.ts

@@ -1,6 +1,6 @@
 import { ApiServices, FormEntry, InputField, InputParameter, InputParameterReference, ObjectInstance, Reference, UserAccount } from '@evoke-platform/context';
 import { FieldValues } from 'react-hook-form';
-export declare function evalDefaultVals(parameters: InputParameter[], unnestedEntries: FormEntry[], entry: InputParameterReference | InputField, fieldValue: unknown, fieldId: string, apiServices: ApiServices, userAccount?: UserAccount, formValues?: FieldValues, updatedRelatedObjectValue?: ObjectInstance | null | Reference): Promise<{
+export declare function evalDefaultVals(parameters: InputParameter[], entry: InputParameterReference | InputField, fieldValue: unknown, fieldId: string, apiServices: ApiServices, userAccount?: UserAccount, formValues?: FieldValues, updatedRelatedObjectValue?: ObjectInstance | null | Reference, updatedRelatedObjectParamId?: string): Promise<{
     fieldId: string;
     fieldValue: unknown;
 }[]>;

package/dist/published/components/custom/FormV2/components/DefaultValues.js

@@ -1,7 +1,7 @@
-import { isArray, isEmpty, uniq } from 'lodash';
+import { isArray, isEmpty, isObject, uniq } from 'lodash';
 import { DateTime } from 'luxon';
-import { getEntryId, getPrefixedUrl, isAddressProperty } from './utils';
-export async function evalDefaultVals(parameters, unnestedEntries, entry, fieldValue, fieldId, apiServices, userAccount, formValues, updatedRelatedObjectValue) {
+import { getEntryId, getPrefixedUrl, isAddressProperty, transformToWhere, updateCriteriaInputs } from './utils';
+export async function evalDefaultVals(parameters, entry, fieldValue, fieldId, apiServices, userAccount, formValues, updatedRelatedObjectValue, updatedRelatedObjectParamId) {
     const updates = [];
     const parameter = parameters.find((param) => param.id === fieldId);
     const defaultValue = entry.display?.defaultValue;
@@ -14,7 +14,6 @@ export async function evalDefaultVals(parameters, unnestedEntries, entry, fieldV
             const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedProperty>[a-zA-Z][a-zA-Z0-9_]*)}}$/;
             const groups = regex.exec(item)?.groups;
             if (groups?.relatedObjectProperty && groups?.nestedProperty) {
-                const relatedObjectParameter = parameters.find((param) => param.id === groups?.relatedObjectProperty);
                 let relatedObjectInstance = updatedRelatedObjectValue;
                 if (!relatedObjectInstance && !isEmpty(formValues)) {
                     relatedObjectInstance = formValues[groups.relatedObjectProperty];
@@ -28,30 +27,14 @@ export async function evalDefaultVals(parameters, unnestedEntries, entry, fieldV
                     ]);
                     updates.push({ fieldId, fieldValue });
                 }
-                else if (relatedObjectInstance?.id && relatedObjectParameter) {
-                    let relatedObjectId = relatedObjectParameter.objectId;
-                    if (!relatedObjectId) {
-                        const relatedObjectParamEntry = unnestedEntries.find((e) => getEntryId(e) === relatedObjectParameter.id);
-                        relatedObjectId = relatedObjectParamEntry?.display?.relatedObjectId;
-                    }
-                    const instance = await new Promise((resolve) => {
-                        apiServices.get(getPrefixedUrl(`/objects/${relatedObjectId}/instances/${relatedObjectInstance?.id}`), (error, instance) => {
-                            if (error) {
-                                console.error(error);
-                                return resolve(undefined);
-                            }
-                            resolve(instance);
-                        });
-                    });
-                    if (instance) {
-                        fieldValue = uniq([
-                            ...staticValues,
-                            ...(isArray(instance[groups.nestedProperty])
-                                ? instance[groups.nestedProperty]
-                                : []),
-                        ]);
-                        updates.push({ fieldId, fieldValue });
-                    }
+                else if (relatedObjectInstance) {
+                    fieldValue = uniq([
+                        ...staticValues,
+                        ...(isArray(relatedObjectInstance[groups.nestedProperty])
+                            ? relatedObjectInstance[groups.nestedProperty]
+                            : []),
+                    ]);
+                    updates.push({ fieldId, fieldValue });
                 }
                 else {
                     updates.push({ fieldId, fieldValue: staticValues });
@@ -65,42 +48,23 @@ export async function evalDefaultVals(parameters, unnestedEntries, entry, fieldV
     }
     else if (typeof defaultValue === 'string' && /^{{.*}}$/.test(defaultValue)) {
         if (isAddressProperty(fieldId)) {
-            const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<addressProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedAddressProperty>line1|line2|city|county|state|zipCode)}}$/;
+            const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<addressProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedAddressProperty>line1|line2|city|county|state|zipCode|country)}}$/;
             const groups = regex.exec(defaultValue)?.groups;
             if (groups?.relatedObjectProperty && groups?.addressProperty && groups?.nestedAddressProperty) {
-                const relatedObjectParameter = parameters.find((param) => param.id === groups?.relatedObjectProperty);
                 let relatedObjectInstance = updatedRelatedObjectValue;
                 if (!relatedObjectInstance && !isEmpty(formValues)) {
                     relatedObjectInstance = formValues[groups.relatedObjectProperty];
                 }
-                if (updatedRelatedObjectValue?.[groups.addressProperty]?.[groups.nestedAddressProperty]) {
+                if (updatedRelatedObjectValue === null) {
+                    updates.push({ fieldId, fieldValue: '' });
+                }
+                else if (updatedRelatedObjectValue?.[groups.addressProperty]?.[groups.nestedAddressProperty]) {
                     fieldValue = updatedRelatedObjectValue?.[groups.addressProperty]?.[groups.nestedAddressProperty];
                     updates.push({ fieldId, fieldValue });
                 }
-                else if (relatedObjectInstance?.id && relatedObjectParameter) {
-                    let relatedObjectId = relatedObjectParameter.objectId;
-                    if (!relatedObjectId) {
-                        const relatedObjectParamEntry = unnestedEntries.find((e) => getEntryId(e) === relatedObjectParameter.id);
-                        relatedObjectId = relatedObjectParamEntry?.display?.relatedObjectId;
-                    }
-                    const instance = await new Promise((resolve) => {
-                        apiServices.get(getPrefixedUrl(`/objects/${relatedObjectId}/instances/${relatedObjectInstance?.id}`), (error, instance) => {
-                            if (error) {
-                                console.error(error);
-                                return resolve(undefined);
-                            }
-                            resolve(instance);
-                        });
-                    });
-                    // Clear dependent fields only if value is explicitly null (user cleared it).
-                    // If updatedRelatedObjectValue is undefined (not triggered by onChange), use the value from the instance.
-                    if (updatedRelatedObjectValue === null) {
-                        updates.push({ fieldId, fieldValue: '' });
-                    }
-                    else if (instance) {
-                        fieldValue = instance?.[groups.addressProperty]?.[groups.nestedAddressProperty];
-                        updates.push({ fieldId, fieldValue });
-                    }
+                else if (relatedObjectInstance) {
+                    fieldValue = relatedObjectInstance?.[groups.addressProperty]?.[groups.nestedAddressProperty];
+                    updates.push({ fieldId, fieldValue });
                 }
             }
         }
@@ -108,44 +72,44 @@ export async function evalDefaultVals(parameters, unnestedEntries, entry, fieldV
             const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedProperty>[a-zA-Z][a-zA-Z0-9_]*)}}$/;
             const groups = regex.exec(defaultValue)?.groups;
             if (groups?.relatedObjectProperty && groups?.nestedProperty) {
-                const relatedObjectParameter = parameters.find((param) => param.id === groups?.relatedObjectProperty);
                 let relatedObjectInstance = updatedRelatedObjectValue;
                 if (!relatedObjectInstance && !isEmpty(formValues)) {
                     relatedObjectInstance = formValues[groups.relatedObjectProperty];
                 }
-                if (updatedRelatedObjectValue?.[groups.nestedProperty]) {
+                if (updatedRelatedObjectValue === null) {
+                    updates.push({ fieldId, fieldValue: null });
+                }
+                else if (updatedRelatedObjectValue?.[groups.nestedProperty]) {
                     fieldValue = updatedRelatedObjectValue[groups.nestedProperty];
                     updates.push({ fieldId, fieldValue });
                 }
-                else if (relatedObjectInstance?.id && relatedObjectParameter) {
-                    let relatedObjectId = relatedObjectParameter.objectId;
-                    if (!relatedObjectId) {
-                        const relatedObjectParamEntry = unnestedEntries.find((e) => getEntryId(e) === relatedObjectParameter.id);
-                        relatedObjectId = relatedObjectParamEntry?.display?.relatedObjectId;
-                    }
-                    const instance = await new Promise((resolve) => {
-                        apiServices.get(getPrefixedUrl(`/objects/${relatedObjectId}/instances/${relatedObjectInstance?.id}`), (error, instance) => {
-                            if (error) {
-                                console.error(error);
-                                return resolve(undefined);
-                            }
-                            resolve(instance);
-                        });
-                    });
-                    // Clear dependent fields only if value is explicitly null (user cleared it).
-                    // If updatedRelatedObjectValue is undefined (not triggered by onChange), use the value from the instance.
-                    if (updatedRelatedObjectValue === null) {
-                        updates.push({ fieldId, fieldValue: null });
-                    }
-                    else if (instance) {
-                        fieldValue = instance?.[groups.nestedProperty] || null;
-                        updates.push({ fieldId, fieldValue });
-                    }
+                else if (relatedObjectInstance) {
+                    fieldValue = relatedObjectInstance[groups.nestedProperty] || null;
+                    updates.push({ fieldId, fieldValue });
                 }
             }
         }
         // all other default values set here
     }
+    else if (isObject(defaultValue) && 'criteria' in defaultValue && !isEmpty(defaultValue.criteria)) {
+        const criteria = defaultValue.criteria;
+        const evaluatedCriteria = updateCriteriaInputs(criteria, { ...formValues, [updatedRelatedObjectParamId || '']: updatedRelatedObjectValue }, userAccount);
+        try {
+            const instances = await apiServices.get(getPrefixedUrl(`/objects/${parameter?.objectId || entry.display?.relatedObjectId}/instances`), {
+                params: {
+                    filter: {
+                        where: transformToWhere(evaluatedCriteria),
+                        limit: 1,
+                    },
+                },
+            });
+            updates.push({ fieldId, fieldValue: instances[0] ?? null });
+        }
+        catch (error) {
+            updates.push({ fieldId, fieldValue: null });
+            console.error(error);
+        }
+    }
     else if (parameter?.type !== 'object') {
         let updatedValue = defaultValue;
         // handles current default values ie: "Current logged in user", "Today" etc.
@@ -175,38 +139,45 @@ export async function processValueUpdate(unnestedEntries, parameters, updatedRel
             const parameterId = getEntryId(entry);
             if (!parameterId)
                 return [];
+            if (parameterId === changedEntryId) {
+                continue;
+            }
+            const defaultValue = entry.display.defaultValue;
             if (isAddressProperty(parameterId)) {
-                const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<addressProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedAddressProperty>line1|line2|city|county|state|zipCode)}}$/;
+                const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<addressProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedAddressProperty>line1|line2|city|county|state|zipCode|country)}}$/;
                 const groups = regex.exec(entry.display.defaultValue)?.groups;
                 const [addressObject, addressField] = parameterId.split('.');
                 if (groups?.relatedObjectProperty &&
                     groups?.addressProperty &&
                     groups?.nestedAddressProperty &&
                     changedEntryId === groups.relatedObjectProperty) {
-                    const result = await evalDefaultVals(parameters, unnestedEntries, entry, formValues?.[addressObject]?.[addressField], parameterId, apiServices, userAccount, formValues, updatedRelatedObjectValue);
+                    const result = await evalDefaultVals(parameters, entry, formValues?.[addressObject]?.[addressField], parameterId, apiServices, userAccount, formValues, updatedRelatedObjectValue, changedEntryId);
                     updates.push(...result);
                 }
             }
-            else if (isArray(entry.display.defaultValue) &&
-                entry.display.defaultValue.some((item) => /^{{.*}}$/.test(item))) {
-                for (const item of entry.display.defaultValue.filter((item) => /^{{.*}}$/.test(item))) {
+            else if (isArray(defaultValue) && defaultValue.some((item) => /^{{.*}}$/.test(item))) {
+                for (const item of defaultValue.filter((item) => /^{{.*}}$/.test(item))) {
                     const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedProperty>[a-zA-Z][a-zA-Z0-9_]*)}}$/;
                     const groups = regex.exec(item)?.groups;
                     if (groups?.relatedObjectProperty &&
                         groups?.nestedProperty &&
                         changedEntryId === groups.relatedObjectProperty) {
-                        const result = await evalDefaultVals(parameters, unnestedEntries, entry, entry.display.defaultValue, parameterId, apiServices, userAccount, formValues, updatedRelatedObjectValue);
+                        const result = await evalDefaultVals(parameters, entry, defaultValue, parameterId, apiServices, userAccount, formValues, updatedRelatedObjectValue, changedEntryId);
                         updates.push(...result);
                     }
                 }
             }
+            else if (isObject(defaultValue) && 'criteria' in defaultValue && !isEmpty(defaultValue.criteria)) {
+                const result = await evalDefaultVals(parameters, entry, formValues?.[parameterId], parameterId, apiServices, userAccount, formValues, updatedRelatedObjectValue, changedEntryId);
+                updates.push(...result);
+            }
             else {
                 const regex = /^{{input\.(?<relatedObjectProperty>[a-zA-Z][a-zA-Z0-9_]*)\.(?<nestedProperty>[a-zA-Z][a-zA-Z0-9_]*)}}$/;
-                const groups = regex.exec(entry.display.defaultValue)?.groups;
+                const groups = regex.exec(defaultValue)?.groups;
                 if (groups?.relatedObjectProperty &&
                     groups?.nestedProperty &&
                     changedEntryId === groups.relatedObjectProperty) {
-                    const result = await evalDefaultVals(parameters, unnestedEntries, entry, formValues?.[parameterId], parameterId, apiServices, userAccount, formValues, updatedRelatedObjectValue);
+                    const result = await evalDefaultVals(parameters, entry, formValues?.[parameterId], parameterId, apiServices, userAccount, formValues, updatedRelatedObjectValue, changedEntryId);
                     updates.push(...result);
                 }
             }

package/dist/published/components/custom/FormV2/components/FormContext.d.ts

@@ -18,7 +18,6 @@ type FormContextType = {
     handleChange?: (name: string, value: unknown) => void | Promise<void>;
     onAutosave?: (fieldId: string) => void | Promise<void>;
     fieldHeight?: 'small' | 'medium';
-    triggerFieldReset?: boolean;
     showSubmitError?: boolean;
     associatedObject?: {
         instanceId: string;

package/dist/published/components/custom/FormV2/components/FormContext.js

@@ -10,7 +10,6 @@ export const FormContext = createContext({
     expandedSections: [],
     parameters: [],
     showSubmitError: false,
-    triggerFieldReset: false,
     handleChange: () => { },
     fieldHeight: 'medium',
     form: {},

package/dist/published/components/custom/FormV2/components/FormFieldTypes/Criteria.d.ts

@@ -7,5 +7,5 @@ type CriteriaProps = {
     error?: boolean;
 };
 type CriteriaValue = Record<string, unknown>;
-export default function Criteria(props: CriteriaProps): React.JSX.Element;
-export {};
+declare const Criteria: (props: CriteriaProps) => React.JSX.Element;
+export default Criteria;

package/dist/published/components/custom/FormV2/components/FormFieldTypes/Criteria.js

@@ -6,7 +6,7 @@ import { Button, CircularProgress, Skeleton, Typography } from '../../../../core
 import { Box } from '../../../../layout';
 import CriteriaBuilder from '../../../CriteriaBuilder';
 import { addressProperties, getPrefixedUrl } from '../utils';
-export default function Criteria(props) {
+const Criteria = (props) => {
     const { value, canUpdateProperty, fieldDefinition, error } = props;
     const apiServices = useApiServices();
     const { handleChange, onAutosave } = useFormContext();
@@ -90,4 +90,5 @@ export default function Criteria(props) {
                     type: 'date-time',
                 },
             ], enablePresetValues: true }))) : (React.createElement(Typography, { variant: "body2", sx: { color: '#637381' } }, "No criteria"));
-}
+};
+export default Criteria;

package/dist/published/components/custom/FormV2/components/FormFieldTypes/Image.js

@@ -56,11 +56,9 @@ const styles = {
 export const Image = (props) => {
     const { id, canUpdateProperty, error, value, hasDescription } = props;
     const { handleChange, onAutosave: onAutosave } = useFormContext();
-    const [image, setImage] = useState();
+    const [image, setImage] = useState(value ?? null);
     useEffect(() => {
-        if (typeof value === 'string') {
-            setImage(value);
-        }
+        setImage(value ?? null);
     }, [value]);
     const handleUpload = async (file) => {
         // max file size 300KB

package/dist/published/components/custom/FormV2/components/FormFieldTypes/relatedObjectFiles/RelatedObjectInstance.js

@@ -1,7 +1,7 @@
 import { useApiServices } from '@evoke-platform/context';
 import { DialogActions } from '@mui/material';
 import { useQueryClient } from '@tanstack/react-query';
-import { isEmpty } from 'lodash';
+import { isEmpty, pick } from 'lodash';
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Close } from '../../../../../../icons';
 import useWidgetSize, { useFormContext } from '../../../../../../theme/hooks';
@@ -95,11 +95,15 @@ const RelatedObjectInstance = (props) => {
             // Handle the case where relatedObject is undefined
             return;
         }
+        const action = relatedObject.actions?.find((act) => act.id === actionId);
+        const parameters = action?.parameters || [];
         submission = await formatSubmission(submission, apiServices, relatedObject.id);
         try {
             const response = await apiServices.post(getPrefixedUrl(`/objects/${relatedObject.id}/instances/actions`), {
                 actionId: actionId,
-                input: submission,
+                input: pick(submission, parameters
+                    .filter((param) => param.type !== 'collection' && !param.formula)
+                    .map((param) => param.id)),
             });
             const expandedInstance = await apiServices.get(getPrefixedUrl(`/objects/${relatedObject.id}/instances/${response.id}`), {
                 params: {

package/dist/published/components/custom/FormV2/components/RecursiveEntryRenderer.js

@@ -39,7 +39,7 @@ function getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, displ
 }
 export function RecursiveEntryRenderer(props) {
     const { entry } = props;
-    const { object, getValues, errors, instance, richTextEditor: RichTextEditor, parameters, handleChange, onAutosave, fieldHeight, triggerFieldReset, associatedObject, width, } = useFormContext();
+    const { object, getValues, errors, instance, richTextEditor: RichTextEditor, parameters, handleChange, onAutosave, fieldHeight, associatedObject, width, } = useFormContext();
     const { isBelow, breakpoints } = useWidgetSize({
         scroll: false,
         defaultWidth: width,
@@ -154,7 +154,7 @@ export function RecursiveEntryRenderer(props) {
             }
         }
         else if (fieldDefinition.type === 'richText') {
-            return (React.createElement(FieldWrapper, { ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) }, RichTextEditor ? (React.createElement(RichTextEditor
+            return (React.createElement(FieldWrapper, { key: `${entryId}-${fieldValue}`, ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) }, RichTextEditor ? (React.createElement(RichTextEditor
             // RichTexts get a uniqueId when the form is loaded to prevent issues with multiple rich text fields on one form
             , { 
                 // RichTexts get a uniqueId when the form is loaded to prevent issues with multiple rich text fields on one form
@@ -170,7 +170,7 @@ export function RecursiveEntryRenderer(props) {
         }
         else if (fieldDefinition.type === 'criteria') {
             return (React.createElement(FieldWrapper, { ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) },
-                React.createElement(Criteria, { key: triggerFieldReset ? `${entryId}-reset-true` : `${entryId}-reset-false`, fieldDefinition: fieldDefinition, value: fieldValue, canUpdateProperty: !(entry.type === 'readonlyField'), error: !!errors?.[entryId] })));
+                React.createElement(Criteria, { key: `${entryId}-${fieldValue}`, fieldDefinition: fieldDefinition, value: fieldValue, canUpdateProperty: !(entry.type === 'readonlyField'), error: !!errors?.[entryId] })));
         }
         else {
             // Add `aria-describedby` to ensure screen readers read the description
@@ -198,12 +198,11 @@ export function RecursiveEntryRenderer(props) {
                  * Key remounts the field if a value is changed.
                  * Needed to clear certain fields on discard changes.
                  */
-                key: (fieldDefinition.type === 'choices' ||
+                key: fieldDefinition.type === 'choices' ||
                     fieldDefinition?.type === 'time' ||
-                    fieldDefinition?.type === 'boolean') &&
-                    triggerFieldReset
-                    ? `${entryId}-reset-true`
-                    : `${entryId}-reset-false`, ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors), errorMessage: undefined },
+                    fieldDefinition?.type === 'boolean'
+                    ? `${entryId}-${fieldValue}`
+                    : undefined, ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors), errorMessage: undefined },
                 React.createElement(FormField, { id: entryId, 
                     // TODO: Ideally the FormField prop should be called parameter but can't change the name for backwards compatibility reasons
                     property: fieldDefinition, defaultValue: fieldValue, onChange: handleChange, onBlur: () => {

package/dist/published/components/custom/FormV2/components/utils.js

@@ -403,7 +403,7 @@ export const convertPropertiesToParams = (object) => {
             ]
             : [...acc, property];
     }, [])
-        .filter(({ id, type }) => type !== 'collection')
+        .filter((prop) => prop.type !== 'collection' && !prop.formula)
         .flat()
         .sort((a, b) => a.name.localeCompare(b.name))
         .map(propertyToParameter);
@@ -630,8 +630,8 @@ export async function formatSubmission(submission, apiServices, objectId, instan
             // if there are address fields with no value address needs to be set to undefined to be able to submit
         }
         else if (typeof value === 'object' && value !== null) {
-            if (Object.values(value).every((v) => v === undefined)) {
-                submission[key] = undefined;
+            if (Object.values(value).every((v) => v === undefined || v === '')) {
+                submission[key] = null;
                 // only submit the name and id of a regular related object
                 // and include objectId if it is a dynamic related object
             }

package/dist/published/theme/hooks.d.ts

@@ -150,12 +150,11 @@ export declare function useFormContext(): {
     handleChange?: ((name: string, value: unknown) => void | Promise<void>) | undefined;
     onAutosave?: ((fieldId: string) => void | Promise<void>) | undefined;
     fieldHeight?: "medium" | "small" | undefined;
-    triggerFieldReset?: boolean | undefined;
     showSubmitError?: boolean | undefined;
     associatedObject?: {
         instanceId: string;
-        propertyId: string; /** Extra large screens (1536px and up) */
-    } | undefined; /** Extra large screens (1536px and up) */
+        propertyId: string;
+    } | undefined;
     form?: import("@evoke-platform/context").EvokeForm | undefined;
     width: number;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@evoke-platform/ui-components",
-    "version": "1.15.0",
+    "version": "1.15.1",
     "description": "",
     "main": "dist/published/index.js",
     "module": "dist/published/index.js",
@@ -112,6 +112,7 @@
         "@react-querybuilder/material": "^6.5.0",
         "@tanstack/react-query": "^5.90.20",
         "clean-deep": "^3.4.0",
+        "dependency-graph": "^1.0.0",
         "devexpress-richedit": "^23.1.5",
         "devextreme": "^23.1.5",
         "devextreme-dist": "^23.1.5",