@reactables/forms 2.0.0-beta.1 → 2.0.0-beta.11

package/dist/Helpers/addAsyncValidationEffects.d.ts

@@ -1,9 +1,11 @@
-import { Action, Effect } from '@reactables/core';
+import { Effect } from '@reactables/core';
 import { BaseControl } from '../Models/Controls';
-import { ControlAsyncValidationResponse } from '../Models/Payloads';
 import { RxFormProviders } from '../RxForm/RxForm';
-import { ControlRef } from '../Models';
-type ControlScopedEffect<T> = Effect<BaseControl<T>, ControlAsyncValidationResponse | ControlRef>;
-export declare const getScopedEffectsForControl: <T>(formControl: BaseControl<T>, providers: RxFormProviders) => ControlScopedEffect<T>[];
-export declare const getAsyncValidationEffects: (formControls: BaseControl<unknown>[]) => Action<BaseControl<unknown>>[];
+type ControlScopedEffect<T> = Effect;
+export declare const getScopedEffectsForControl: <T>(formControl: BaseControl<T>, providers: RxFormProviders) => Effect[];
+export declare const getAsyncValidationEffects: (formControls: BaseControl<unknown>[]) => {
+    type: string;
+    scopedEffects?: import("@reactables/core").ScopedEffects | undefined;
+    payload: BaseControl<unknown>;
+}[];
 export {};

package/dist/Helpers/buildFormState.d.ts

@@ -2,5 +2,5 @@ import { AbstractControlConfig } from '../Models/Configs';
 import { BaseForm, BaseFormState } from '../Models/Controls';
 import { ControlRef } from '../Models/ControlRef';
 import { RxFormProviders } from '../RxForm/RxForm';
-export declare const buildState: <T>(config: AbstractControlConfig, form: BaseForm<T>, controlRef: ControlRef, providers: RxFormProviders) => BaseForm<T>;
-export declare const buildFormState: <T>(config: AbstractControlConfig, form: BaseForm<T>, controlRef: ControlRef, providers: RxFormProviders) => BaseFormState<T>;
+export declare const buildState: <T>(config: AbstractControlConfig, controlRef: ControlRef | undefined, providers: RxFormProviders, form?: BaseForm<T> | undefined) => BaseForm<T>;
+export declare const buildFormState: <T>(config: AbstractControlConfig, controlRef: ControlRef | undefined, providers: RxFormProviders, form?: BaseForm<T> | undefined) => BaseFormState<T>;

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>>, initialBaseState: BaseFormState<T>) => Observable<Action<T>>;
+export declare const buildHub2Source: (hub1State$: Observable<BaseFormState<any>>, initialBaseState: BaseFormState<any>) => Observable<Action<any>>;

package/dist/Models/Controls.d.ts

@@ -19,9 +19,9 @@ interface AsyncFields {
     pending?: boolean;
 }
 interface ValidatedFields {
-    valid: boolean;
+    valid: boolean | null;
     errors: FormErrors;
-    childrenValid: boolean;
+    childrenValid: boolean | null;
 }
 export interface Hub2Fields extends AsyncFields, ValidatedFields {
 }
@@ -36,13 +36,14 @@ export interface BaseFormState<T> {
         [key: string]: BaseControl<unknown>;
     };
 }
-export interface BaseForm<T> {
-    root?: BaseControl<T>;
+export type BaseForm<T> = {
+    root: BaseControl<T>;
     [key: string]: BaseControl<unknown>;
-}
-export interface Form<T> {
-    root?: FormControl<T>;
+};
+export type Form<T> = {
+    root: FormControl<T>;
+} & {
     [key: string]: FormControl<unknown>;
-}
+};
 export declare const DEFAULT_HUB2_FIELDS: Hub2Fields;
 export {};

package/dist/Models/FormErrors.d.ts

@@ -1,3 +1,3 @@
 export interface FormErrors {
-    [key: string]: boolean;
+    [key: string]: any;
 }

package/dist/Models/Validators.d.ts

@@ -1,5 +1,5 @@
 import { Observable } from 'rxjs';
 import { BaseControl } from './Controls';
 import { FormErrors } from './FormErrors';
-export type ValidatorFn = (value: unknown) => FormErrors;
+export type ValidatorFn = (value: any) => FormErrors;
 export type ValidatorAsyncFn = <T>(control$: Observable<BaseControl<T>>) => Observable<Observable<FormErrors>>;

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

@@ -1,4 +1,4 @@
 import { Action } from '@reactables/core';
 import { Form } from '../../Models/Controls';
 import { ControlRef } from '../../Models';
-export declare const asyncValidation: <T>(form: Form<T>, { payload: controlRef }: Action<ControlRef>) => Form<T>;
+export declare const asyncValidation: (form: Form<any> | null, { payload: controlRef }: Action<ControlRef>) => Form<any>;

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

@@ -1,4 +1,4 @@
 import { Action } from '@reactables/core';
 import { Form } from '../../Models/Controls';
 import { ControlAsyncValidationResponse } from '../../Models/Payloads';
-export declare const asyncValidationResponse: <T>(form: Form<T>, { payload: { key, validatorIndex, errors } }: Action<ControlAsyncValidationResponse>) => Form<T>;
+export declare const asyncValidationResponse: (form: Form<any> | null, { payload: { key, validatorIndex, errors } }: Action<ControlAsyncValidationResponse>) => Form<any>;

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

@@ -1,3 +1,3 @@
-import { Reducer } from '@reactables/core';
-import { Form } from '../../Models/Controls';
-export declare const formChange: Reducer<Form<unknown>>;
+import { Action } from '@reactables/core';
+import { BaseFormState, Form } from '../../Models/Controls';
+export declare const formChange: (state: Form<any> | null | undefined, { payload }: Action<BaseFormState<any>>) => Form<any>;

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, _removedControls }: BaseFormState<unknown>) => {
     [x: string]: FormControl<unknown>;
-    root?: FormControl<unknown>;
+    root: FormControl<unknown>;
 };

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

@@ -2,5 +2,5 @@ import { Form, BaseForm, FormControl } from '../../Models/Controls';
 import { ControlRef } from '../../Models/ControlRef';
 export declare const mergeRemoveControl: <T>(state: Form<T>, form: BaseForm<T>, controlRef: ControlRef) => {
     [x: string]: FormControl<unknown>;
-    root?: FormControl<unknown>;
+    root: FormControl<unknown>;
 };

package/dist/RxForm/RxForm.d.ts

@@ -29,22 +29,17 @@ export interface FormReducers {
     markControlAsUntouched: <T>(state: BaseFormState<T>, payload: ControlRef) => BaseFormState<T>;
     resetControl: <T>(state: BaseFormState<T>, payload: ControlRef) => BaseFormState<T>;
 }
-export type CustomReducerFunc<T = unknown> = (reducers: FormReducers, state: BaseFormState<unknown>, action: Action<T>) => BaseFormState<unknown>;
-export type CustomReducer = CustomReducerFunc | {
-    reducer: CustomReducerFunc;
-    effects?: Effect<unknown, unknown>[] | ((payload?: unknown) => ScopedEffects<unknown>);
+export type CustomReducerFunc<FormValue = unknown> = (reducers: FormReducers, state: BaseFormState<FormValue>, action: any) => BaseFormState<unknown>;
+export type CustomReducer<FormValue = unknown> = CustomReducerFunc<FormValue> | {
+    reducer: CustomReducerFunc<FormValue>;
+    effects?: Effect[] | ((payload?: unknown) => ScopedEffects);
 };
-export type CustomReducers<T> = {
-    [key in keyof (T & {
-        [key: string]: CustomReducer;
-    })]: CustomReducer;
-};
-export type ActionCreatorTypeFromCustomReducer<T> = T extends (reducers: FormReducers, state: BaseFormState<unknown>) => BaseFormState<unknown> ? () => void : T extends CustomReducerFunc<infer P> ? (payload: P) => void : T extends {
-    reducer: (reducers: FormReducers, state: BaseFormState<unknown>) => BaseFormState<unknown>;
+export type ActionCreatorTypeFromCustomReducer<T> = T extends (formReducers: FormReducers, state: any) => unknown ? () => void : T extends (formReducers: FormReducers, state: any, action: Action<infer P>) => unknown ? (payload: P) => void : T extends {
+    reducer: (formReducers: FormReducers, state: any) => unknown;
 } ? () => void : T extends {
-    reducer: CustomReducerFunc<infer P>;
+    reducer: (formReducers: FormReducers, state: any, action: Action<infer P>) => unknown;
 } ? (payload: P) => void : never;
-export interface RxFormOptions<T extends CustomReducers<unknown> = CustomReducers<unknown>> {
+export interface RxFormOptions<T extends Record<string, CustomReducer<any>> = Record<string, CustomReducer<any>>> {
     reducers?: T;
     providers?: RxFormProviders;
     name?: string;
@@ -54,7 +49,7 @@ export interface RxFormOptions<T extends CustomReducers<unknown> = CustomReducer
 type NormalizerFunction<T> = (value: T) => T;
 export interface RxFormProviders {
     normalizers?: {
-        [key: string]: NormalizerFunction<unknown>;
+        [key: string]: NormalizerFunction<any>;
     };
     validators?: {
         [key: string]: ValidatorFn;
@@ -63,8 +58,8 @@ export interface RxFormProviders {
         [key: string]: ValidatorAsyncFn;
     };
 }
-export declare const build: <T extends CustomReducers<unknown>>(config: AbstractControlConfig, options?: RxFormOptions<T>) => Reactable<Form<unknown>, { [K in keyof T]: ActionCreatorTypeFromCustomReducer<T[K]>; } & {
-    updateValues: <T_1>(payload: UpdateValuesPayload<T_1>) => void;
+export declare const build: <FormValue, CustomReducers extends Record<string, CustomReducer<FormValue>> = Record<string, CustomReducer<FormValue>>>(config: AbstractControlConfig, options?: RxFormOptions<CustomReducers>) => Reactable<Form<FormValue>, { [K in keyof CustomReducers]: ActionCreatorTypeFromCustomReducer<CustomReducers[K]>; } & {
+    updateValues: <T>(payload: UpdateValuesPayload<T>) => void;
     addControl: (payload: AddControlPayload) => void;
     pushControl: (payload: PushControlPayload) => void;
     removeControl: (payload: ControlRef) => void;
@@ -72,11 +67,11 @@ export declare const build: <T extends CustomReducers<unknown>>(config: Abstract
     markControlAsTouched: (payload: MarkTouchedPayload) => void;
     markControlAsUntouched: (payload: ControlRef) => void;
     resetControl: (payload: ControlRef) => void;
-} & ActionMap & DestroyAction, CustomReducerActionTypes<T> & FormActionTypes & {
+} & ActionMap & DestroyAction, CustomReducerActionTypes<CustomReducers> & FormActionTypes & {
     destroy: 'destroy';
 }>;
-export declare const load: <Value, T extends CustomReducers<unknown>>(state: Form<Value>, options?: RxFormOptions<T>) => Reactable<Form<unknown>, { [K in keyof T]: ActionCreatorTypeFromCustomReducer<T[K]>; } & {
-    updateValues: <T_1>(payload: UpdateValuesPayload<T_1>) => void;
+export declare const load: <FormValue, CustomReducers extends Record<string, CustomReducer<FormValue>> = Record<string, CustomReducer<FormValue>>>(state: Form<FormValue>, options?: RxFormOptions<CustomReducers>) => Reactable<Form<FormValue>, { [K in keyof CustomReducers]: ActionCreatorTypeFromCustomReducer<CustomReducers[K]>; } & {
+    updateValues: <T>(payload: UpdateValuesPayload<T>) => void;
     addControl: (payload: AddControlPayload) => void;
     pushControl: (payload: PushControlPayload) => void;
     removeControl: (payload: ControlRef) => void;
@@ -84,10 +79,10 @@ export declare const load: <Value, T extends CustomReducers<unknown>>(state: For
     markControlAsTouched: (payload: MarkTouchedPayload) => void;
     markControlAsUntouched: (payload: ControlRef) => void;
     resetControl: (payload: ControlRef) => void;
-} & ActionMap & DestroyAction, CustomReducerActionTypes<T> & FormActionTypes & {
+} & ActionMap & DestroyAction, CustomReducerActionTypes<CustomReducers> & FormActionTypes & {
     destroy: 'destroy';
 }>;
-type CustomReducerActionTypes<T extends CustomReducers<unknown>> = {
+type CustomReducerActionTypes<T extends Record<string, CustomReducer>> = {
     [K in keyof T as `${K & string}`]: `${K & string}`;
 };
 type FormActionTypes = {

package/dist/RxForm/index.d.ts

@@ -1 +1 @@
-export { build, load, group, array, control, RxFormActions, CustomReducer, CustomReducers, FormReducers, RxFormOptions, RxFormProviders, } from './RxForm';
+export { build, load, group, array, control, RxFormActions, CustomReducer, FormReducers, RxFormOptions, RxFormProviders, } from './RxForm';

package/dist/Testing/Models/initialState.d.ts

@@ -44,7 +44,7 @@ export declare const initialState: {
                 email: string;
             };
         };
-        controlRef: any[];
+        controlRef: never[];
         validatorErrors: {
             firstNameNotSameAsLast: boolean;
         };

package/dist/index.cjs

@@ -11,7 +11,7 @@ var DEFAULT_HUB2_FIELDS = {
     pending: false,
     valid: null,
     childrenValid: null,
-    errors: null
+    errors: {}
 };
 
 var Controls = /*#__PURE__*/Object.freeze({
@@ -149,16 +149,15 @@ var getErrors = function (control, value, _a) {
     var _b;
     var validators = _a.validators;
     return ((_b = control.config.validators) === null || _b === void 0 ? void 0 : _b.reduce(function (acc, validator) {
-        if (!validators[validator]) {
+        if (!(validators === null || validators === void 0 ? void 0 : validators[validator])) {
             throw "You have not provided a validator for \"".concat(validator, "\"");
         }
         return __assign(__assign({}, acc), validators[validator](value));
     }, {})) || {};
 };
 
-var buildState = function (config, form, controlRef, providers) {
+var buildState = function (config, controlRef, providers, form) {
     var _a;
-    if (form === void 0) { form = { root: null }; }
     if (controlRef === void 0) { controlRef = []; }
     var value = getValueFromControlConfig(config);
     var control = {
@@ -177,22 +176,21 @@ var buildState = function (config, form, controlRef, providers) {
     if (controls && !(controls instanceof Array)) {
         newForm = Object.entries(config.controls).reduce(function (acc, _a) {
             var key = _a[0], controlConfig = _a[1];
-            return buildState(controlConfig, acc, controlRef.concat(key), providers);
+            return buildState(controlConfig, controlRef.concat(key), providers, acc);
         }, newForm);
     }
     else if (controls && controls instanceof Array) {
         // Adding controls for Form Array
         newForm = config.controls.reduce(function (acc, controlConfig, index) {
-            return buildState(controlConfig, acc, controlRef.concat(index), providers);
+            return buildState(controlConfig, controlRef.concat(index), providers, acc);
         }, newForm);
     }
     return newForm;
 };
-var buildFormState = function (config, form, controlRef, providers) {
-    if (form === void 0) { form = { root: null }; }
+var buildFormState = function (config, controlRef, providers, form) {
     if (controlRef === void 0) { controlRef = []; }
     return {
-        form: buildState(config, form, controlRef, providers)
+        form: buildState(config, controlRef, providers, form)
     };
 };
 
@@ -203,7 +201,8 @@ var getScopedEffectsForControl = function (formControl, providers) {
     if (asyncValidators && asyncValidators.length) {
         scopedEffects = asyncValidators.reduce(function (acc, asyncValidator, validatorIndex) {
             var effect = function (actions$) {
-                if (!providers.asyncValidators[asyncValidator]) {
+                var _a;
+                if (!((_a = providers.asyncValidators) === null || _a === void 0 ? void 0 : _a[asyncValidator])) {
                     throw "You have not provided an asyncValidator for \"".concat(asyncValidator, "\"");
                 }
                 return actions$.pipe(operators.map(function (_a) {
@@ -305,7 +304,7 @@ var getDescendantControls = function (controlRef, form, excludeSelf) {
     }
     var control = getControl(controlRef, form);
     var value = control.value, config = control.config;
-    var descendants;
+    var descendants = [];
     if (Array.isArray(config.controls)) {
         // If control is a Form Array
         descendants = value.reduce(function (acc, item, index) {
@@ -384,9 +383,11 @@ var controlRefCheck = function (ref) {
     catch (_a) { }
 };
 
-var checkKeys = function (obj1, obj2) {
-    if (Object.keys(obj1).slice().sort().join() !== Object.keys(obj2).slice().sort().join()) {
-        throw 'Can not update value because keys are not the same.';
+var checkKeys = function (oldObj, newObj) {
+    var oldKeys = Object.keys(oldObj).slice().sort().join();
+    var newKeys = Object.keys(newObj).slice().sort().join();
+    if (oldKeys !== newKeys) {
+        console.warn("You are trying to update multiple controls but the keys don't match. It is recommended your keys match. Old keys: ".concat(oldKeys, ". New Keys: ").concat(newKeys, "  "));
     }
 };
 var updateDescendantValues = function (form, _a, providers) {
@@ -417,10 +418,11 @@ 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._removedControls, _removedControls = _e === void 0 ? {} : _e;
+    var _d;
+    var form = _a.form, _e = _a._changedControls, _changedControls = _e === void 0 ? {} : _e, _f = _a._removedControls, _removedControls = _f === void 0 ? {} : _f;
     if (mergeChanges === void 0) { mergeChanges = false; }
     var normalizers = providers.normalizers;
-    var _f = action.payload, controlRef = _f.controlRef, value = _f.value;
+    var _g = action.payload, controlRef = _g.controlRef, value = _g.value;
     controlRefCheck(controlRef);
     // Update its own value
     var ctrlKey = getFormKey(controlRef);
@@ -428,8 +430,8 @@ var updateValues = function (_a, action, providers, mergeChanges) {
     var oldValue = form[ctrlKey].value;
     var config = form[ctrlKey].config;
     if (config.normalizers) {
-        newValue = config.normalizers.reduce(function (acc, normalizer) {
-            if (!normalizers[normalizer]) {
+        newValue = (_d = config.normalizers) === null || _d === void 0 ? void 0 : _d.reduce(function (acc, normalizer) {
+            if (!(normalizers === null || normalizers === void 0 ? void 0 : normalizers[normalizer])) {
                 throw "You have not provided a normalizer for \"".concat(normalizer, "\"");
             }
             return normalizers[normalizer](acc);
@@ -629,7 +631,7 @@ var addControl = function (state, action, providers, mergeChanges) {
     if (!getControl(controlRef.slice(0, -1), state.form)) {
         throw 'You are attempting to add a control to a non-existent form group';
     }
-    var newForm = buildState(config, state.form, controlRef, providers);
+    var newForm = buildState(config, controlRef, providers, state.form);
     var newValue = getControl(controlRef, newForm).value;
     var ancestorsUpdated = updateAncestorValuesAddControl(newForm, {
         payload: { controlRef: controlRef, value: newValue }
@@ -660,7 +662,7 @@ var pushControl = function (state, action, providers, mergeChanges) {
     else {
         throw 'You are attempting to push to a control that is not a Form Array';
     }
-    var newForm = buildState(config, state.form, newControlRef, providers);
+    var newForm = buildState(config, newControlRef, providers, state.form);
     var newValue = getControl(newControlRef, newForm).value;
     var ancestorsUpdated = updateAncestorValuesAddControl(newForm, {
         payload: { controlRef: newControlRef, value: newValue }
@@ -804,7 +806,7 @@ var resetControl = function (state, action, providers, mergeChanges) {
         delete descendantsRemoved[key];
     });
     // Remove all descendants
-    var restoredControls = buildState(controlToReset.config, descendantsRemoved, controlToReset.controlRef, providers);
+    var restoredControls = buildState(controlToReset.config, controlToReset.controlRef, providers, descendantsRemoved);
     var restoredControlValue = getControl(controlRef, restoredControls).value;
     var result = updateAncestorValues(restoredControls, {
         payload: { controlRef: controlRef, value: restoredControlValue }
@@ -834,12 +836,14 @@ var asyncValidation = function (form, _a) {
     var controlRef = _a.payload;
     var updatedSelfAndAncestors = getAncestorControls(controlRef, form).reduce(function (acc, control) {
         var _a;
+        var _b;
         var isChangedControl = getFormKey(control.controlRef) === getFormKey(controlRef);
         return __assign(__assign({}, acc), (_a = {}, _a[getFormKey(control.controlRef)] = __assign(__assign({}, control), { pending: true, asyncValidateInProgress: isChangedControl
-                ? __assign({}, control.config.asyncValidators.reduce(function (acc, _, index) {
+                ? __assign({}, (_b = control.config.asyncValidators) === null || _b === void 0 ? void 0 : _b.reduce(function (acc, _, index) {
                     var _a;
                     return (__assign(__assign({}, acc), (_a = {}, _a[index] = true, _a)));
-                }, {})) : control.asyncValidateInProgress }), _a));
+                }, {}))
+                : control.asyncValidateInProgress }), _a));
     }, {});
     return __assign(__assign({}, form), updatedSelfAndAncestors);
 };
@@ -1103,7 +1107,7 @@ var build = function (config, options) {
         validators: __assign(__assign({}, Validators), (_b = options.providers) === null || _b === void 0 ? void 0 : _b.validators),
         asyncValidators: __assign({}, (_c = options.providers) === null || _c === void 0 ? void 0 : _c.asyncValidators)
     };
-    var initialState = buildFormState(config, undefined, undefined, providers);
+    var initialState = buildFormState(config, undefined, providers);
     return createReactable(initialState, options);
 };
 var load = function (state, options) {
@@ -1183,9 +1187,10 @@ var createReactable = function (initialBaseState, options, initialFormState) {
         hub1Actions.destroy();
         hub2Actions.destroy();
     };
+    var actions = __assign(__assign({}, hub1Actions), { destroy: destroy });
     return [
         state$.pipe(operators.filter(function (form) { return form !== null; })),
-        __assign(__assign({}, hub1Actions), { destroy: destroy }),
+        actions,
         hub1Actions$,
     ];
 };