@reactables/forms 1.0.1 → 1.0.2-beta.1

package/dist/Helpers/buildHub2Source.d.ts

@@ -1,4 +1,4 @@
 import { Observable } from 'rxjs';
 import { Action } from '@reactables/core';
 import { BaseFormState } from '../Models/Controls';
-export declare const buildHub2Source: <T>(hub1State$: Observable<BaseFormState<T>>) => Observable<Action<T>>;
+export declare const buildHub2Source: <T>(hub1State$: Observable<BaseFormState<T>>, initialBaseState: BaseFormState<T>) => Observable<Action<T>>;

package/dist/Models/Controls.d.ts

@@ -32,7 +32,7 @@ export interface BaseFormState<T> {
     _changedControls?: {
         [key: string]: BaseControl<unknown>;
     };
-    _removedConrols?: {
+    _removedControls?: {
         [key: string]: BaseControl<unknown>;
     };
 }

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

@@ -2,4 +2,4 @@ import { Action } from '@reactables/core';
 import { BaseFormState } from '../../Models/Controls';
 import { UpdateValuesPayload } from '../../Models/Payloads';
 import { RxFormProviders } from '../../RxForm/RxForm';
-export declare const updateValues: <T>({ form, _changedControls, _removedConrols }: BaseFormState<T>, action: Action<UpdateValuesPayload<unknown>>, providers: RxFormProviders, mergeChanges?: boolean) => BaseFormState<T>;
+export declare const updateValues: <T>({ form, _changedControls, _removedControls }: BaseFormState<T>, action: Action<UpdateValuesPayload<unknown>>, providers: RxFormProviders, mergeChanges?: boolean) => BaseFormState<T>;

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

@@ -1,5 +1,5 @@
 import { Form, FormControl, BaseFormState } from '../../Models/Controls';
-export declare const mergeControls: <T>(state: Form<T>, { form, _changedControls, _removedConrols }: BaseFormState<unknown>) => {
+export declare const mergeControls: <T>(state: Form<T>, { form, _changedControls, _removedControls }: BaseFormState<unknown>) => {
     [x: string]: FormControl<unknown>;
     root?: FormControl<unknown>;
 };

package/dist/Testing/AsyncValidators.d.ts

@@ -1,5 +1,7 @@
 import { ValidatorAsyncFn } from '../Models/Validators';
 export declare const uniqueEmail: ValidatorAsyncFn;
+export declare const noError: ValidatorAsyncFn;
+export declare const noError2: ValidatorAsyncFn;
 export declare const blacklistedEmail: ValidatorAsyncFn;
 export declare const arrayLengthError: ValidatorAsyncFn;
 export declare const uniqueFirstAndLastName: ValidatorAsyncFn;

package/dist/index.js

@@ -237,13 +237,16 @@ var getAsyncValidationActions = function (formControls) {
     }, []);
 };
 
-var buildHub2Source = function (hub1State$) {
+var buildHub2Source = function (hub1State$, initialBaseState) {
     var hub1StateMapped$ = hub1State$.pipe(operators.map(function (payload) { return ({ type: 'formChange', payload: payload }); }));
-    var sourceForHub2$ = hub1StateMapped$.pipe(operators.mergeMap(function (formChangeAction) {
-        var _changedControls = formChangeAction.payload._changedControls;
-        var controlsToCheck = _changedControls ? Object.values(_changedControls) : [];
+    var initialAction = { type: 'formChange', payload: initialBaseState };
+    var sourceForHub2$ = hub1StateMapped$.pipe(operators.startWith(initialAction), operators.pairwise(), operators.mergeMap(function (_a) {
+        var prevForm = _a[0].payload.form, currAction = _a[1];
+        var _b = currAction.payload, _changedControls = _b._changedControls, currentForm = _b.form;
+        var valueChanged = !isEqual__default["default"](prevForm.root.value, currentForm.root.value);
+        var controlsToCheck = _changedControls && valueChanged ? Object.values(_changedControls) : [];
         var asyncValidationActions = getAsyncValidationActions(controlsToCheck);
-        return rxjs.of.apply(void 0, __spreadArray([formChangeAction], asyncValidationActions, false));
+        return rxjs.of.apply(void 0, __spreadArray([currAction], asyncValidationActions, false));
     }));
     return sourceForHub2$;
 };
@@ -404,7 +407,7 @@ var updateDescendantValues = function (form, _a, providers) {
 // Use AddControlPayload/RemoveControl action reducers to add/remove control
 var updateValues = function (_a, action, providers, mergeChanges) {
     var _b, _c;
-    var form = _a.form, _d = _a._changedControls, _changedControls = _d === void 0 ? {} : _d, _e = _a._removedConrols, _removedConrols = _e === void 0 ? {} : _e;
+    var form = _a.form, _d = _a._changedControls, _changedControls = _d === void 0 ? {} : _d, _e = _a._removedControls, _removedControls = _e === void 0 ? {} : _e;
     if (mergeChanges === void 0) { mergeChanges = false; }
     var normalizers = providers.normalizers;
     var _f = action.payload, controlRef = _f.controlRef, value = _f.value;
@@ -454,7 +457,7 @@ var updateValues = function (_a, action, providers, mergeChanges) {
         var _a;
         return (__assign(__assign({}, acc), (_a = {}, _a[control.key] = control, _a)));
     }, {});
-    var mergedResult = __assign(__assign({}, result), { _changedControls: __assign(__assign(__assign({}, (mergeChanges ? _changedControls : undefined)), changedAncestorControls), result._changedControls), _removedConrols: mergeChanges ? _removedConrols : undefined });
+    var mergedResult = __assign(__assign({}, result), { _changedControls: __assign(__assign(__assign({}, (mergeChanges ? _changedControls : undefined)), changedAncestorControls), result._changedControls), _removedControls: mergeChanges ? _removedControls : undefined });
     return mergedResult;
 };
 
@@ -564,7 +567,7 @@ var removeControl = function (state, action, providers, mergeChanges) {
             }
         }, {});
     }
-    var _removedConrols = __assign(__assign({}, (mergeChanges ? state._removedConrols || {} : undefined)), (_a = {}, _a[controlToRemove.key] = controlToRemove, _a));
+    var _removedControls = __assign(__assign({}, (mergeChanges ? state._removedControls || {} : undefined)), (_a = {}, _a[controlToRemove.key] = controlToRemove, _a));
     descendants
         .map(function (_a) {
         var key = _a.key;
@@ -576,7 +579,7 @@ var removeControl = function (state, action, providers, mergeChanges) {
     return {
         form: result,
         _changedControls: _changedControls,
-        _removedConrols: _removedConrols
+        _removedControls: _removedControls
     };
 };
 
@@ -634,7 +637,7 @@ var addControl = function (state, action, providers, mergeChanges) {
     return {
         form: ancestorsUpdated,
         _changedControls: __assign(__assign({}, (mergeChanges ? state._changedControls || {} : undefined)), _changedControls),
-        _removedConrols: mergeChanges ? state._removedConrols || {} : undefined
+        _removedControls: mergeChanges ? state._removedControls || {} : undefined
     };
 };
 
@@ -666,7 +669,7 @@ var pushControl = function (state, action, providers, mergeChanges) {
     return {
         form: ancestorsUpdated,
         _changedControls: __assign(__assign({}, (mergeChanges ? state._changedControls || {} : undefined)), _changedControls),
-        _removedConrols: mergeChanges ? state._removedConrols || {} : undefined
+        _removedControls: mergeChanges ? state._removedControls || {} : undefined
     };
 };
 
@@ -729,7 +732,7 @@ var markControlAsPristine = function (state, action, mergeChanges) {
     return {
         form: result,
         _changedControls: __assign(__assign({}, (mergeChanges ? state._changedControls || {} : undefined)), _changedControls),
-        _removedConrols: mergeChanges ? state._removedConrols || {} : undefined
+        _removedControls: mergeChanges ? state._removedControls || {} : undefined
     };
 };
 
@@ -753,7 +756,7 @@ var markControlAsTouched = function (state, action, mergeChanges) {
     return {
         form: __assign(__assign({}, form), controls),
         _changedControls: __assign(__assign({}, (mergeChanges ? state._changedControls || {} : undefined)), _changedControls),
-        _removedConrols: mergeChanges ? state._removedConrols || {} : undefined
+        _removedControls: mergeChanges ? state._removedControls || {} : undefined
     };
 };
 
@@ -783,7 +786,7 @@ var markControlAsUntouched = function (state, action, mergeChanges) {
     return {
         form: result,
         _changedControls: __assign(__assign({}, (mergeChanges ? state._changedControls || {} : undefined)), _changedControls),
-        _removedConrols: mergeChanges ? state._removedConrols || {} : undefined
+        _removedControls: mergeChanges ? state._removedControls || {} : undefined
     };
 };
 
@@ -814,7 +817,7 @@ var resetControl = function (state, action, providers, mergeChanges) {
         var _a;
         return (__assign(__assign({}, acc), (_a = {}, _a[control.key] = control, _a)));
     }, {}));
-    var _removedConrols = __assign(__assign({}, (mergeChanges ? state._removedConrols || {} : undefined)), (_a = {}, _a[controlToReset.key] = controlToReset, _a));
+    var _removedControls = __assign(__assign({}, (mergeChanges ? state._removedControls || {} : undefined)), (_a = {}, _a[controlToReset.key] = controlToReset, _a));
     // If control is removed, we can delete it from the _changedControls check
     descendants
         .map(function (_a) {
@@ -827,7 +830,7 @@ var resetControl = function (state, action, providers, mergeChanges) {
     return {
         form: result,
         _changedControls: _changedControls,
-        _removedConrols: _removedConrols
+        _removedControls: _removedControls
     };
 };
 
@@ -836,7 +839,7 @@ var asyncValidation = function (form, _a) {
     var updatedSelfAndAncestors = getAncestorControls(controlRef, form).reduce(function (acc, control) {
         var _a;
         var isChangedControl = getFormKey(control.controlRef) === getFormKey(controlRef);
-        return __assign(__assign({}, acc), (_a = {}, _a[getFormKey(control.controlRef)] = __assign(__assign({}, control), { pending: true, asyncValidateInProgress: isChangedControl
+        return __assign(__assign({}, acc), (_a = {}, _a[getFormKey(control.controlRef)] = __assign(__assign({}, control), { pending: true, valid: false, asyncValidateInProgress: isChangedControl
                 ? __assign({}, control.config.asyncValidators.reduce(function (acc, _, index) {
                     var _a;
                     return (__assign(__assign({}, acc), (_a = {}, _a[index] = true, _a)));
@@ -886,7 +889,7 @@ var mergeBranchErrors = function (form, controlRef) {
                 return valid;
             });
         }
-        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { errors: errors, valid: selfValid && childrenValid, childrenValid: childrenValid }), _b));
+        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { errors: errors, valid: selfValid && childrenValid && !control.pending, childrenValid: childrenValid }), _b));
     }, {});
     var errorsMergedOrderRestored = reverseObjectKeys(errorsMerged);
     return __assign(__assign({}, form), errorsMergedOrderRestored);
@@ -914,7 +917,8 @@ 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); }) }), _b));
+            var pending_1 = descendants.some(function (control) { return isControlValidating(control); });
+            return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { pending: pending_1 }), _b));
         }
         return __assign(__assign({}, acc), (_c = {}, _c[key] = control, _c));
     }, {});
@@ -943,7 +947,7 @@ var mergeErrors = function (form) {
             // 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, childrenValid: childrenValid }), _b));
+        return __assign(__assign({}, acc), (_b = {}, _b[key] = __assign(__assign({}, control), { errors: errors, valid: selfValid && childrenValid && !control.pending, childrenValid: childrenValid }), _b));
     }, {});
     var restoredOrder = reverseObjectKeys(errorsMerged);
     return restoredOrder;
@@ -981,25 +985,25 @@ var mergeRemoveControl = function (state, form, controlRef) {
                 return valid;
             });
         }
-        return __assign(__assign({}, acc), (_a = {}, _a[key] = __assign(__assign(__assign({}, existingControl), baseControl), { errors: errors, valid: selfValid && childrenValid, childrenValid: childrenValid }), _a));
+        return __assign(__assign({}, acc), (_a = {}, _a[key] = __assign(__assign(__assign({}, existingControl), baseControl), { errors: errors, valid: selfValid && childrenValid && !existingControl.pending, childrenValid: childrenValid }), _a));
     }, {});
     var updatedControlBranchOrderRestored = reverseObjectKeys(updatedControlBranch);
     var descendants = existingBranch.filter(function (control) { return control.controlRef.length > parentRef.length; });
-    var _removedConrols = __assign({}, state);
+    var _removedControls = __assign({}, state);
     descendants.forEach(function (control) {
-        delete _removedConrols[getFormKey(control.controlRef)];
+        delete _removedControls[getFormKey(control.controlRef)];
     });
-    delete _removedConrols[getFormKey(controlRef)];
-    return __assign(__assign({}, _removedConrols), updatedControlBranchOrderRestored);
+    delete _removedControls[getFormKey(controlRef)];
+    return __assign(__assign({}, _removedControls), updatedControlBranchOrderRestored);
 };
 
 var hasErrors = function (errors) {
     return Object.values(errors).some(function (hasError) { return hasError; });
 };
 var mergeControls = function (state, _a) {
-    var form = _a.form, _b = _a._changedControls, _changedControls = _b === void 0 ? {} : _b, _removedConrols = _a._removedConrols;
-    var controlsRemoved = _removedConrols
-        ? Object.values(_removedConrols).reduce(function (acc, _a) {
+    var form = _a.form, _b = _a._changedControls, _changedControls = _b === void 0 ? {} : _b, _removedControls = _a._removedControls;
+    var controlsRemoved = _removedControls
+        ? Object.values(_removedControls).reduce(function (acc, _a) {
             var controlRef = _a.controlRef;
             return mergeRemoveControl(acc, form, controlRef);
         }, state)
@@ -1032,7 +1036,7 @@ var mergeControls = function (state, _a) {
                 return valid;
             });
         }
-        return __assign(__assign({}, acc), (_a = {}, _a[formKey] = __assign(__assign({}, newControl), { errors: errors, valid: selfValid && childrenValid, childrenValid: childrenValid }), _a));
+        return __assign(__assign({}, acc), (_a = {}, _a[formKey] = __assign(__assign({}, newControl), { errors: errors, valid: selfValid && childrenValid && !newControl.pending, childrenValid: childrenValid }), _a));
     }, {});
     var orderRestored = reverseObjectKeys(updatedBranch);
     var result = __assign(__assign({}, controlsRemoved), orderRestored);
@@ -1160,7 +1164,7 @@ var createReactable = function (initialBaseState, options, initialFormState) {
                 return resetControl(state, action, providers, mergeChanges);
             }, markControlAsPristine: markControlAsPristine, markControlAsTouched: markControlAsTouched, markControlAsUntouched: markControlAsUntouched }, customReducers) }, otherOptions)), hub1State$ = _d[0], hub1Actions = _d[1];
     var state$ = core.RxBuilder({
-        sources: [buildHub2Source(hub1State$).pipe(operators.skip(initialFormState ? 1 : 0))],
+        sources: [buildHub2Source(hub1State$, initialBaseState).pipe(operators.skip(initialFormState ? 1 : 0))],
         initialState: initialFormState || null,
         name: "Stage 2 ".concat(name ? name : 'rxForm'),
         debug: debug,

package/package.json

@@ -14,7 +14,7 @@
   "author": "David Lai",
   "license": "ISC",
   "dependencies": {
-    "@reactables/core": "^1.0.1",
+    "@reactables/core": "^1.0.2-beta.1",
     "lodash.isequal": "^4.5.0"
   },
   "peerDependencies": {
@@ -23,5 +23,5 @@
   "devDependencies": {
     "lodash.clonedeep": "^4.5.0"
   },
-  "version": "1.0.1"
+  "version": "1.0.2-beta.1"
 }