@reactables/forms 0.4.3-alpha.0 → 0.4.4-alpha.0

package/dist/Models/Controls.d.ts

@@ -9,12 +9,10 @@ export interface BaseControl<T> {
     dirty: boolean;
     touched: boolean;
     validatorErrors: FormErrors;
-    validatorsValid: boolean;
     config: AbstractControlConfig;
     key: string;
 }
 interface AsyncFields {
-    asyncValidatorsValid: boolean;
     asyncValidatorErrors: FormErrors;
     asyncValidateInProgress: {
         [key: string | number]: boolean;
@@ -38,7 +36,7 @@ export interface BaseForm<T> {
     [key: string]: BaseControl<unknown>;
 }
 export interface Form<T> {
-    root: FormControl<T>;
+    root?: FormControl<T>;
     [key: string]: FormControl<unknown>;
 }
 export {};

package/dist/Reducers/Hub1/getErrors.d.ts

@@ -0,0 +1,3 @@
+import { BaseControl } from '../../Models/Controls';
+import { FormErrors } from '../../Models';
+export declare const getErrors: <T>(control: BaseControl<T>, value: T) => FormErrors;

package/dist/Reducers/Hub1/updateAncestorValues.d.ts

@@ -1,5 +1,5 @@
 import { Action } from '@reactables/core';
 import { BaseForm } from '../../Models/Controls';
-import { ControlRef } from '../../Models/ControlRef';
+import { ControlChange } from '../../Models/Payloads';
 export declare const UPDATE_ANCESTOR_VALUES = "UPDATE_ANCESTOR_VALUES";
-export declare const updateAncestorValues: <T>(form: BaseForm<T>, { payload: controlRef }: Action<ControlRef>) => BaseForm<T>;
+export declare const updateAncestorValues: <T>(form: BaseForm<T>, { payload: { controlRef, value } }: Action<ControlChange<unknown>>) => BaseForm<T>;

package/dist/Reducers/Hub1/updateAncestorValuesAddControl.d.ts

@@ -0,0 +1,5 @@
+import { Action } from '@reactables/core';
+import { BaseForm } from '../../Models/Controls';
+import { ControlChange } from '../../Models/Payloads';
+export declare const UPDATE_ANCESTOR_VALUES_ADD_CONTROL = "UPDATE_ANCESTOR_VALUES_ADD_CONTROL";
+export declare const updateAncestorValuesAddControl: <T>(form: BaseForm<T>, { payload: { controlRef, value } }: Action<ControlChange<unknown>>) => BaseForm<T>;

package/dist/Reducers/Hub1/updateAncestorValuesRemoveControl.d.ts

@@ -0,0 +1,5 @@
+import { Action } from '@reactables/core';
+import { BaseForm } from '../../Models/Controls';
+import { ControlRef } from '../../Models/ControlRef';
+export declare const UPDATE_ANCESTOR_VALUES_REMOVE_CONTROL = "UPDATE_ANCESTOR_VALUES_REMOVE_CONTROL";
+export declare const updateAncestorValuesRemoveControl: <T>(form: BaseForm<T>, { payload: controlRef }: Action<ControlRef>) => BaseForm<T>;

package/dist/Reducers/Hub2/mergeBranchErrors.d.ts

@@ -0,0 +1,3 @@
+import { Form } from '../../Models/Controls';
+import { ControlRef } from '../../Models';
+export declare const mergeBranchErrors: <T>(form: Form<T>, controlRef: ControlRef) => Form<T>;

package/dist/Reducers/Hub2/mergeValueUpdated.d.ts

@@ -0,0 +1,3 @@
+import { Form, BaseForm } from '../../Models/Controls';
+import { ControlRef } from '../../Models/ControlRef';
+export declare const mergeValueUpdated: <T>(state: Form<T>, form: BaseForm<T>, controlRef: ControlRef) => Form<T>;

package/dist/index.js

@@ -122,44 +122,14 @@ var generateKey = function (length) {
     return result;
 };
 
-// Includes the original control of interest unless excludeSelf === true
-var getDescendantControls = function (controlRef, form, excludeSelf) {
-    if (excludeSelf === void 0) { excludeSelf = false; }
-    var result = Object.entries(form)
-        .filter(function (_a) {
-        var key = _a[0];
-        if (!controlRef.length)
-            return true;
-        var childRef = key.split('.');
-        return controlRef.every(function (refKey, index) {
-            return refKey == childRef[index];
-        });
-    })
-        .map(function (entry) { return entry[1]; });
-    return result.filter(function (control) {
-        return excludeSelf ? getFormKey(control.controlRef) !== getFormKey(controlRef) : true;
-    });
-};
-
 var syncValidate = function (form) {
     // First check each control for its own validation
-    var baseValidation = Object.entries(form).reduce(function (acc, _a) {
+    var validated = Object.entries(form).reduce(function (acc, _a) {
         var _b;
         var _c;
         var key = _a[0], control = _a[1];
         var validatorErrors = ((_c = control.config.validators) === null || _c === void 0 ? void 0 : _c.reduce(function (acc, validator) { return (__assign(__assign({}, acc), validator(control.value))); }, {})) || {};
-        var validatorsValid = !Object.values(validatorErrors).some(function (err) { return err; });
-        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { validatorErrors: validatorErrors, validatorsValid: validatorsValid }), _b));
-    }, {});
-    // Then check each controls children to see if there are errors
-    var validated = Object.entries(baseValidation).reduce(function (acc, _a) {
-        var _b;
-        var key = _a[0], control = _a[1];
-        var validatorsValid = getDescendantControls(control.controlRef, baseValidation).every(function (_a) {
-            var validatorsValid = _a.validatorsValid;
-            return validatorsValid;
-        });
-        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { validatorsValid: validatorsValid }), _b));
+        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { validatorErrors: validatorErrors }), _b));
     }, {});
     return validated;
 };
@@ -176,7 +146,6 @@ var buildState = function (config, form, controlRef) {
         value: value,
         controlRef: controlRef,
         validatorErrors: {},
-        validatorsValid: null,
         config: config,
         key: generateKey(5)
     };
@@ -193,13 +162,13 @@ var buildState = function (config, form, controlRef) {
         // Adding controls for Form Array
         newForm = config.controls.reduce(function (acc, controlConfig, index) { return buildState(controlConfig, acc, controlRef.concat(index)); }, newForm);
     }
-    return syncValidate(newForm);
+    return newForm;
 };
 var buildFormState = function (config, form, controlRef) {
     if (form === void 0) { form = { root: null }; }
     if (controlRef === void 0) { controlRef = []; }
     return {
-        form: buildState(config, form, controlRef),
+        form: syncValidate(buildState(config, form, controlRef)),
         action: null
     };
 };
@@ -229,10 +198,39 @@ var getAncestorControls = function (controlRef, form, excludeSelf) {
     });
 };
 
+// Includes the original control of interest unless excludeSelf === true
+var getDescendantControls = function (controlRef, form, excludeSelf) {
+    if (excludeSelf === void 0) { excludeSelf = false; }
+    if (!controlRef.length) {
+        return Object.values(form).filter(function (_a) {
+            var controlRef = _a.controlRef;
+            return excludeSelf ? controlRef.length !== 0 : true;
+        });
+    }
+    var control = getControl(controlRef, form);
+    var value = control.value, config = control.config;
+    var descendants;
+    if (Array.isArray(config.controls)) {
+        // If control is a Form Array
+        descendants = value.reduce(function (acc, item, index) {
+            return acc.concat(getDescendantControls(controlRef.concat(index), form));
+        }, []);
+    }
+    else if (config.controls) {
+        // If control is a Form Group
+        descendants = Object.keys(value).reduce(function (acc, key) {
+            return acc.concat(getDescendantControls(controlRef.concat(key), form));
+        }, []);
+    }
+    if (excludeSelf)
+        return descendants;
+    return [control].concat(descendants || []);
+};
+
 var getControlBranch = function (controlRef, form) {
     var ancestors = getAncestorControls(controlRef, form);
     var childControls = getDescendantControls(controlRef, form).slice(1);
-    return ancestors.concat(childControls);
+    return ancestors.concat(childControls).sort(function (a, b) { return a.controlRef.length - b.controlRef.length; });
 };
 
 var getScopedEffectsForControl = function (formControl) {
@@ -306,49 +304,40 @@ var buildHub2Source = function (rx) {
     return sourceForHub2$;
 };
 
+var getErrors = function (control, value) {
+    var _a;
+    return ((_a = control.config.validators) === null || _a === void 0 ? void 0 : _a.reduce(function (acc, validator) { return (__assign(__assign({}, acc), validator(value))); }, {})) || {};
+};
+
 var UPDATE_ANCESTOR_VALUES = 'UPDATE_ANCESTOR_VALUES';
 var updateAncestorValues = function (form, _a) {
-    var _b;
-    var controlRef = _a.payload;
+    var _b, _c;
+    var _d = _a.payload, controlRef = _d.controlRef, value = _d.value;
     if (controlRef.length) {
         var parentRef = controlRef.slice(0, -1);
-        var parentKey = getFormKey(parentRef);
-        var siblingControls = getDescendantControls(parentRef, form).filter(
-        // Out of descendants we only need the siblings
-        function (control) { return control.controlRef.length === controlRef.length; });
+        var parentControl = getControl(parentRef, form);
+        var parentFormKey = getFormKey(parentControl.controlRef);
+        var childKey_1 = controlRef.slice(-1)[0];
         var newValue = void 0;
         // If parent is a Form Array
-        if (Array.isArray(form[parentKey].value)) {
-            newValue = siblingControls
-                .slice()
-                .sort(function (a, b) { return a.controlRef.at(-1) - b.controlRef.at(-1); })
-                .map(function (control) { return control.value; });
+        if (Array.isArray(parentControl.value)) {
+            newValue = parentControl.value.map(function (item, index) {
+                return index === childKey_1 ? value : item;
+            });
         }
         else {
             // If parent is a Form Group
-            newValue = siblingControls.reduce(function (acc, _a) {
-                var _b;
-                var controlRef = _a.controlRef, value = _a.value;
-                return __assign(__assign({}, acc), (_b = {}, _b[controlRef.at(-1)] = value, _b));
-            }, {});
+            newValue = __assign(__assign({}, parentControl.value), (_b = {}, _b[childKey_1] = value, _b));
         }
-        var newParentControl = __assign(__assign({}, form[parentKey]), { value: newValue });
-        return updateAncestorValues(__assign(__assign({}, form), (_b = {}, _b[parentKey] = newParentControl, _b)), {
+        var newParentControl = __assign(__assign({}, parentControl), { validatorErrors: getErrors(parentControl, newValue), value: newValue, dirty: !isEqual__default["default"](newValue, parentControl.pristineValue) });
+        return updateAncestorValues(__assign(__assign({}, form), (_c = {}, _c[parentFormKey] = newParentControl, _c)), {
             type: UPDATE_ANCESTOR_VALUES,
-            payload: parentRef
+            payload: { controlRef: parentRef, value: newValue }
         });
     }
     return form;
 };
 
-var updateDirty = function (form) {
-    return Object.entries(form).reduce(function (acc, _a) {
-        var _b;
-        var key = _a[0], control = _a[1];
-        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { dirty: !isEqual__default["default"](control.value, control.pristineValue) }), _b));
-    }, {});
-};
-
 var isChildRef = function (controlRef, parentRef) {
     return (parentRef.every(function (key, index) { return controlRef[index] === key; }) &&
         controlRef.length === parentRef.length + 1);
@@ -362,7 +351,8 @@ var updateDescendants = function (form, _a) {
         var key = _a[0], control = _a[1];
         if (isChildRef(control.controlRef, controlRef)) {
             var childValue = value[control.controlRef.at(-1)];
-            acc = __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { value: childValue }), _b));
+            var validatorErrors = getErrors(control, value);
+            acc = __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { value: childValue, validatorErrors: validatorErrors, dirty: !isEqual__default["default"](childValue, control.pristineValue) }), _b));
             var configControls = control.config.controls;
             if (configControls) {
                 acc = updateDescendants(acc, {
@@ -383,7 +373,8 @@ var updateValues = function (_a, action) {
     var _c = action.payload, controlRef = _c.controlRef, value = _c.value;
     // Update its own value
     var ctrlKey = getFormKey(controlRef);
-    var result = __assign(__assign({}, form), (_b = {}, _b[ctrlKey] = __assign(__assign({}, form[ctrlKey]), { value: value }), _b));
+    var validatorErrors = getErrors(form[ctrlKey], value);
+    var result = __assign(__assign({}, form), (_b = {}, _b[ctrlKey] = __assign(__assign({}, form[ctrlKey]), { validatorErrors: validatorErrors, dirty: !isEqual__default["default"](value, form[ctrlKey].pristineValue), value: value }), _b));
     var configControls = form[ctrlKey].config.controls;
     // Update its children
     if (configControls) {
@@ -399,10 +390,38 @@ var updateValues = function (_a, action) {
     if (controlRef.length) {
         result = updateAncestorValues(result, {
             type: UPDATE_ANCESTOR_VALUES,
-            payload: controlRef
+            payload: { controlRef: controlRef, value: value }
+        });
+    }
+    return { form: result, action: action };
+};
+
+var UPDATE_ANCESTOR_VALUES_REMOVE_CONTROL = 'UPDATE_ANCESTOR_VALUES_REMOVE_CONTROL';
+var updateAncestorValuesRemoveControl = function (form, _a) {
+    var _b;
+    var controlRef = _a.payload;
+    if (controlRef.length) {
+        var parentRef = controlRef.slice(0, -1);
+        var parentControl = getControl(parentRef, form);
+        var parentFormKey = getFormKey(parentControl.controlRef);
+        var childKey_1 = controlRef.slice(-1)[0];
+        var newValue = void 0;
+        // If parent is a Form Array
+        if (Array.isArray(parentControl.value)) {
+            newValue = parentControl.value.filter(function (item, index) { return index !== childKey_1; });
+        }
+        else {
+            // If parent is a Form Group
+            newValue = __assign({}, parentControl.value);
+            delete newValue[childKey_1];
+        }
+        var newParentControl = __assign(__assign({}, parentControl), { value: newValue, validatorErrors: getErrors(parentControl, newValue), dirty: !isEqual__default["default"](newValue, parentControl.pristineValue) });
+        return updateAncestorValues(__assign(__assign({}, form), (_b = {}, _b[parentFormKey] = newParentControl, _b)), {
+            type: UPDATE_ANCESTOR_VALUES,
+            payload: { controlRef: parentRef, value: newValue }
         });
     }
-    return { form: syncValidate(updateDirty(result)), action: action };
+    return form;
 };
 
 var removeControl = function (_a, action) {
@@ -446,14 +465,41 @@ var removeControl = function (_a, action) {
         return __assign(__assign({}, acc), (_c = {}, _c[key] = control, _c));
     }, {});
     return {
-        form: syncValidate(updateDirty(updateAncestorValues(controlRemoved, {
-            type: UPDATE_ANCESTOR_VALUES,
+        form: updateAncestorValuesRemoveControl(controlRemoved, {
+            type: UPDATE_ANCESTOR_VALUES_REMOVE_CONTROL,
             payload: controlRef
-        }))),
+        }),
         action: action
     };
 };
 
+var UPDATE_ANCESTOR_VALUES_ADD_CONTROL = 'UPDATE_ANCESTOR_VALUES_ADD_CONTROL';
+var updateAncestorValuesAddControl = function (form, _a) {
+    var _b, _c;
+    var _d = _a.payload, controlRef = _d.controlRef, value = _d.value;
+    if (controlRef.length) {
+        var parentRef = controlRef.slice(0, -1);
+        var parentControl = getControl(parentRef, form);
+        var parentFormKey = getFormKey(parentControl.controlRef);
+        var childKey = controlRef.slice(-1)[0];
+        var newValue = void 0;
+        // If parent is a Form Array
+        if (Array.isArray(parentControl.value)) {
+            newValue = parentControl.value.concat(value);
+        }
+        else {
+            // If parent is a Form Group
+            newValue = __assign(__assign({}, form[parentFormKey].value), (_b = {}, _b[childKey] = value, _b));
+        }
+        var newParentControl = __assign(__assign({}, parentControl), { value: newValue, validatorErrors: getErrors(parentControl, newValue), dirty: !isEqual__default["default"](newValue, parentControl.pristineValue) });
+        return updateAncestorValues(__assign(__assign({}, form), (_c = {}, _c[parentFormKey] = newParentControl, _c)), {
+            type: UPDATE_ANCESTOR_VALUES,
+            payload: { controlRef: parentRef, value: newValue }
+        });
+    }
+    return form;
+};
+
 var addControl = function (state, action) {
     var newControlRef;
     var _a = action.payload, config = _a.config, controlRef = _a.controlRef;
@@ -470,11 +516,12 @@ var addControl = function (state, action) {
         newControlRef = controlRef;
     }
     var newForm = buildState(config, state.form, newControlRef);
-    var ancestorsUpdated = updateAncestorValues(newForm, {
-        type: UPDATE_ANCESTOR_VALUES,
-        payload: newControlRef
+    var newValue = getControl(newControlRef, newForm).value;
+    var ancestorsUpdated = updateAncestorValuesAddControl(newForm, {
+        type: UPDATE_ANCESTOR_VALUES_ADD_CONTROL,
+        payload: { controlRef: newControlRef, value: newValue }
     });
-    return { form: syncValidate(updateDirty(ancestorsUpdated)), action: action };
+    return { form: ancestorsUpdated, action: action };
 };
 
 // Same implementation as updateAncestor values except updating pristine values
@@ -513,6 +560,14 @@ var updateAncestorPristineValues = function (form, _a) {
     return form;
 };
 
+var updateDirty = function (form) {
+    return Object.entries(form).reduce(function (acc, _a) {
+        var _b;
+        var key = _a[0], control = _a[1];
+        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { dirty: !isEqual__default["default"](control.value, control.pristineValue) }), _b));
+    }, {});
+};
+
 var markControlAsPristine = function (_a, action) {
     var form = _a.form;
     var controlRef = action.payload;
@@ -584,11 +639,12 @@ var resetControl = function (_a, action) {
         return __assign(__assign({}, acc), (_b = {}, _b[key] = control, _b));
     }, {});
     var restoredControls = buildState(controlToReset.config, descendantsRemoved, controlToReset.controlRef);
+    var restoredControlValue = getControl(controlRef, restoredControls).value;
     return {
-        form: updateDirty(syncValidate(updateAncestorValues(restoredControls, {
+        form: updateAncestorValues(restoredControls, {
             type: UPDATE_ANCESTOR_VALUES,
-            payload: controlRef
-        }))),
+            payload: { controlRef: controlRef, value: restoredControlValue }
+        }),
         action: action
     };
 };
@@ -612,23 +668,37 @@ var asyncValidation = function (form, _a) {
     return result;
 };
 
-var hasErrors = function (errors) {
+var hasErrors$1 = function (errors) {
     return Object.values(errors).some(function (hasError) { return hasError; });
 };
+// TODO: update merge errors to not do the entire form but just a subset of it
+// TODO: separation of concern to update validity of control and ancestors
 var mergeErrors = function (form) {
-    var errorsMerged = Object.entries(form).reduce(function (acc, _a) {
+    var errorsMerged = Object.entries(form)
+        .reverse()
+        .reduce(function (acc, _a) {
         var _b;
         var key = _a[0], control = _a[1];
         var errors = __assign(__assign({}, control.validatorErrors), control.asyncValidatorErrors);
-        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { errors: errors, valid: !hasErrors(errors) }), _b));
+        var selfValid = !hasErrors$1(errors);
+        var childrenValid = true;
+        if (Array.isArray(control.config.controls)) {
+            // If control is a FormArray
+            childrenValid = control.value.every(function (item, index) { return acc[getFormKey(control.controlRef.concat(index))].valid; });
+        }
+        else if (control.config.controls) {
+            // If control is a FormGroup
+            childrenValid = Object.keys(control.value).every(function (childKey) { return acc[getFormKey(control.controlRef.concat(childKey))].valid; });
+        }
+        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { errors: errors, valid: selfValid && childrenValid }), _b));
     }, {});
-    var childrenErrorsChecked = Object.entries(errorsMerged).reduce(function (acc, _a) {
-        var _b;
-        var key = _a[0], control = _a[1];
-        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { valid: control.valid &&
-                getDescendantControls(control.controlRef, errorsMerged).every(function (control) { return control.valid; }) }), _b));
+    var restoredOrder = Object.keys(errorsMerged)
+        .reverse()
+        .reduce(function (acc, key) {
+        acc[key] = errorsMerged[key];
+        return acc;
     }, {});
-    return childrenErrorsChecked;
+    return restoredOrder;
 };
 
 var isControlValidating = function (control) {
@@ -636,9 +706,6 @@ var isControlValidating = function (control) {
         return false;
     return Object.values(control.asyncValidateInProgress).some(function (pending) { return pending; });
 };
-var isControlAsyncValid = function (control) {
-    return !Object.values(control.asyncValidatorErrors).some(function (error) { return error; });
-};
 var getControlByKey = function (key, form) {
     return Object.values(form).find(function (control) { return control.key === key; });
 };
@@ -656,15 +723,60 @@ var asyncValidationResponseSuccess = function (form, _a) {
         var key = _a[0], control = _a[1];
         if (ancestors.includes(control)) {
             var descendants = getDescendantControls(control.controlRef, controlUpdated);
-            return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { pending: descendants.some(function (control) { return isControlValidating(control); }), asyncValidatorsValid: descendants.every(function (control) { return isControlAsyncValid(control); }) }), _b));
+            return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { pending: descendants.some(function (control) { return isControlValidating(control); }) }), _b));
         }
         return __assign(__assign({}, acc), (_c = {}, _c[key] = control, _c));
     }, {});
     return mergeErrors(ancestorsUpdated);
 };
 
+var hasErrors = function (errors) {
+    return Object.values(errors).some(function (hasError) { return hasError; });
+};
+var mergeBranchErrors = function (form, controlRef) {
+    var controlBranch = getControlBranch(controlRef, form).reduce(function (acc, ctrl) {
+        var _a;
+        return __assign(__assign({}, acc), (_a = {}, _a[getFormKey(ctrl.controlRef)] = ctrl, _a));
+    }, {});
+    var errorsMerged = Object.entries(controlBranch)
+        .reverse()
+        .reduce(function (acc, _a) {
+        var _b;
+        var key = _a[0], control = _a[1];
+        var errors = __assign(__assign({}, control.validatorErrors), control.asyncValidatorErrors);
+        var selfValid = !hasErrors(errors);
+        var childrenValid = true;
+        if (Array.isArray(control.config.controls)) {
+            // If control is a FormArray
+            childrenValid = control.value.every(function (item, index) {
+                var formKey = getFormKey(control.controlRef.concat(index));
+                var valid = acc[formKey] === undefined ? form[formKey].valid : acc[formKey].valid;
+                return valid;
+            });
+        }
+        else if (control.config.controls) {
+            // If control is a FormGroup
+            childrenValid = Object.keys(control.value).every(function (childKey) {
+                var formKey = getFormKey(control.controlRef.concat(childKey));
+                var valid = acc[formKey] === undefined ? form[formKey].valid : acc[formKey].valid;
+                return valid;
+            });
+        }
+        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { errors: errors, valid: selfValid && childrenValid }), _b));
+    }, {});
+    return __assign(__assign({}, form), errorsMerged);
+};
+
+var mergeValueUpdated = function (state, form, controlRef) {
+    var controlBranch = getControlBranch(controlRef, form).reduce(function (acc, control) {
+        var _a;
+        var key = getFormKey(control.controlRef);
+        return __assign(__assign({}, acc), (_a = {}, _a[key] = __assign(__assign({}, state[key]), control), _a));
+    }, {});
+    return mergeBranchErrors(__assign(__assign({}, state), controlBranch), controlRef);
+};
+
 var DEFAULT_HUB2_FIELDS = {
-    asyncValidatorsValid: true,
     asyncValidatorErrors: {},
     asyncValidateInProgress: {},
     pending: false,
@@ -674,16 +786,28 @@ var DEFAULT_HUB2_FIELDS = {
 var formChange = function (state, _a) {
     if (state === void 0) { state = null; }
     var _b = _a.payload, form = _b.form, action = _b.action;
-    return mergeErrors(Object.entries(form).reduce(function (acc, _a) {
-        var _b;
-        var dictKey = _a[0], baseControl = _a[1];
-        var existingControl = (action === null || action === void 0 ? void 0 : action.type) === 'removeControl'
-            ? state && Object.values(state).find(function (control) { return baseControl.key === control.key; })
-            : state && state[dictKey];
-        return __assign(__assign({}, acc), (_b = {}, _b[dictKey] = __assign(__assign({}, (existingControl
-            ? existingControl
-            : structuredClone(DEFAULT_HUB2_FIELDS))), baseControl), _b));
-    }, {}));
+    if (state === null) {
+        return mergeErrors(Object.entries(form).reduce(function (acc, _a) {
+            var _b;
+            var dictKey = _a[0], baseControl = _a[1];
+            return __assign(__assign({}, acc), (_b = {}, _b[dictKey] = __assign(__assign({}, structuredClone(DEFAULT_HUB2_FIELDS)), baseControl), _b));
+        }, {}));
+    }
+    switch (action === null || action === void 0 ? void 0 : action.type) {
+        case 'updateValues':
+            return mergeValueUpdated(state, form, action.payload.controlRef);
+        default:
+            return mergeErrors(Object.entries(form).reduce(function (acc, _a) {
+                var _b;
+                var dictKey = _a[0], baseControl = _a[1];
+                var existingControl = (action === null || action === void 0 ? void 0 : action.type) === 'removeControl'
+                    ? state && Object.values(state).find(function (control) { return baseControl.key === control.key; })
+                    : state && state[dictKey];
+                return __assign(__assign({}, acc), (_b = {}, _b[dictKey] = __assign(__assign({}, (existingControl
+                    ? existingControl
+                    : structuredClone(DEFAULT_HUB2_FIELDS))), baseControl), _b));
+            }, {}));
+    }
 };
 
 var control = function (config) {

package/package.json

@@ -14,12 +14,12 @@
   "author": "David Lai",
   "license": "ISC",
   "dependencies": {
-    "@reactables/core": "^0.4.3-alpha.0",
+    "@reactables/core": "^0.4.4-alpha.0",
     "lodash.clonedeep": "^4.5.0",
     "lodash.isequal": "^4.5.0"
   },
   "peerDependencies": {
     "rxjs": "^6.0.0 || ^7.0.0"
   },
-  "version": "0.4.3-alpha.0"
+  "version": "0.4.4-alpha.0"
 }