@websolutespa/bom-mixer-forms 1.9.1 → 1.9.3

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @websolutespa/bom-mixer-forms
 
+## 1.9.3
+
+### Patch Changes
+
+- Modified: FormEmitter, FormAbstract, FormAbstractCollection
+
+## 1.9.2
+
+### Patch Changes
+
+- Added: emptyErrors
+
 ## 1.9.1
 
 ### Patch Changes

package/dist/index.d.ts

@@ -34,7 +34,7 @@ declare class FormAbstractCollection<U extends Record<string, FormValue> | FormV
     initControl_(controlOrValue: FormAbstract | FormValue, key: any): FormAbstract;
     protected setInitialOptions(options?: FormOptions): void;
     protected checkAsyncPropState_(key: keyof FormFlags, activator?: FormActivator, root?: FormCollection): Promise<void>;
-    revalidate_(): Promise<void>;
+    revalidate_(): Promise<boolean>;
     validate_(root?: FormCollection): Promise<void>;
     updateState_(): void;
     reset(): void;
@@ -63,6 +63,8 @@ declare class FormAbstractCollection<U extends Record<string, FormValue> | FormV
     set value(value: U);
     get errors(): ValidationError;
     set errors(errors: ValidationError);
+    get emptyErrors(): ValidationError;
+    set emptyErrors(emptyErrors: ValidationError);
 }
 
 declare class FormArray<T extends FormValue[] = FormValue[]> extends FormAbstractCollection<T, FormArrayControls> {
@@ -98,7 +100,6 @@ type FormValueGroup = {
 };
 type FormValueArray = FormValue[];
 type IControlParam = {
-    uid: number;
     control: FormControl;
 };
 type IFormOption = {
@@ -221,8 +222,11 @@ declare class FormEmitter<T = FormValue> extends EventEmitter {
     get pristine(): boolean;
     get untouched(): boolean;
     get unsubmitted(): boolean;
+    get required(): boolean;
     protected errors_: ValidationError;
     get errors(): ValidationError;
+    protected emptyErrors_: ValidationError;
+    get emptyErrors(): ValidationError;
     protected validators_: FormValidator[];
     get validators(): FormValidator[];
     constructor(value: T | null, validators?: (FormValidator | FormValidator[]));
@@ -245,6 +249,7 @@ declare class FormEmitter<T = FormValue> extends EventEmitter {
     set touched(touched: boolean);
     set submitted(submitted: boolean);
     set errors(errors: ValidationError);
+    set emptyErrors(emptyErrors: ValidationError);
     set validators(validators: FormValidator[]);
     protected revalidate_(): void;
     protected updateStateAndChange_(): Promise<boolean>;
@@ -259,7 +264,7 @@ declare class FormAbstract<T = FormValue> extends FormEmitter {
     protected setInitialOptions(options?: FormOptions): void;
     protected checkAsyncState_(root?: FormCollection): Promise<void>;
     protected checkAsyncPropState_(key: keyof FormFlags, activator?: FormActivator, root?: FormCollection): Promise<void>;
-    protected revalidate_(): Promise<void>;
+    protected revalidate_(): Promise<boolean>;
     validateAndChange_(root?: FormCollection): Promise<boolean>;
     validate_(root?: FormCollection): Promise<void>;
     protected updateStateAndChange_(): Promise<boolean>;

package/dist/index.js

@@ -212,6 +212,7 @@ var FormEmitter = class extends EventEmitter {
     this.value_ = validValue(value);
     this.state_ = new FormState();
     this.errors_ = {};
+    this.emptyErrors_ = {};
     this.validators_ = validators ? Array.isArray(validators) ? validators : [validators] : [];
   }
   get isDirty() {
@@ -283,9 +284,15 @@ var FormEmitter = class extends EventEmitter {
   get unsubmitted() {
     return this.state_.unsubmitted;
   }
+  get required() {
+    return Boolean(this.emptyErrors_.required);
+  }
   get errors() {
     return this.errors_;
   }
+  get emptyErrors() {
+    return this.emptyErrors_;
+  }
   get validators() {
     return this.validators_;
   }
@@ -345,21 +352,18 @@ var FormEmitter = class extends EventEmitter {
     if (this.state_.disabled !== disabled) {
       this.state_.disabled = disabled;
       this.markAsDirty_ = true;
-      this.revalidate_();
     }
   }
   set hidden(hidden) {
     if (this.state_.hidden !== hidden) {
       this.state_.hidden = hidden;
       this.markAsDirty_ = true;
-      this.revalidate_();
     }
   }
   set readonly(readonly) {
     if (this.state_.readonly !== readonly) {
       this.state_.readonly = readonly;
       this.markAsDirty_ = true;
-      this.revalidate_();
     }
   }
   set dirty(dirty) {
@@ -396,6 +400,19 @@ var FormEmitter = class extends EventEmitter {
     }
     this.errors_ = errors;
   }
+  // emptyErrors
+  set emptyErrors(emptyErrors) {
+    if (!this.markAsDirty_) {
+      const previous = Object.entries(this.emptyErrors_);
+      const current = Object.entries(emptyErrors);
+      const differs = previous.length !== current.length || previous.reduce((p, [k, v], i) => {
+        const c = current[i];
+        return p || (c[0] !== k || c[1] !== v);
+      }, false);
+      this.markAsDirty_ = differs;
+    }
+    this.emptyErrors_ = emptyErrors;
+  }
   // validators
   set validators(validators) {
     if (this.validators_ !== validators) {
@@ -468,6 +485,7 @@ var FormAbstract = class extends FormEmitter {
         yield this.checkAsyncPropState_("disabled", options.disabled, root);
         yield this.checkAsyncPropState_("hidden", options.hidden, root);
         yield this.checkAsyncPropState_("readonly", options.readonly, root);
+        this.updateStateAndChange_();
       }
     });
   }
@@ -485,7 +503,7 @@ var FormAbstract = class extends FormEmitter {
       if (this.parent) {
         return yield this.parent.revalidate_();
       }
-      yield this.validateAndChange_();
+      return yield this.validateAndChange_();
     });
   }
   validateAndChange_(root) {
@@ -498,6 +516,7 @@ var FormAbstract = class extends FormEmitter {
     return __async(this, null, function* () {
       yield this.checkAsyncState_(root);
       const errors = {};
+      const emptyErrors = {};
       if (this.validators.length === 0 || this.disabled || this.submitted) {
         this.invalid = false;
       } else {
@@ -518,8 +537,22 @@ var FormAbstract = class extends FormEmitter {
         }));
         this.invalid = results.length > 0;
         Object.assign(errors, ...results);
+        const emptyValidations = this.validators_.map((x) => x("", root == null ? void 0 : root.value, this, root)).filter((x) => x);
+        const { emptyResults, emptyPromises } = emptyValidations.reduce((p, c) => {
+          (0, import_bom_core.isPromise)(c) ? p.emptyPromises.push(c) : p.emptyResults.push(c);
+          return p;
+        }, { emptyResults: [], emptyPromises: [] });
+        emptyPromises.forEach((x) => x.then((emptyError) => {
+          if (emptyError) {
+            this.emptyErrors = Object.assign({}, this.emptyErrors_, emptyError);
+          }
+        }).catch((emptyError) => {
+          console.warn("Validation.async.emptyError", emptyError);
+        }));
+        Object.assign(emptyErrors, ...emptyResults);
       }
       this.errors = errors;
+      this.emptyErrors = emptyErrors;
       this.updateState_();
     });
   }
@@ -664,7 +697,7 @@ var FormAbstractCollection = class extends FormAbstract {
       if (this.parent) {
         return yield this.parent.revalidate_();
       }
-      yield this.validateAndChange_(this);
+      return yield this.validateAndChange_(this);
     });
   }
   validate_(root) {
@@ -838,6 +871,13 @@ var FormAbstractCollection = class extends FormAbstract {
   }
   set errors(errors) {
   }
+  get emptyErrors() {
+    return this.reduce_((result, control) => {
+      return Object.assign(result, control.emptyErrors);
+    }, {});
+  }
+  set emptyErrors(emptyErrors) {
+  }
 };
 
 // src/forms/form-array.ts

package/dist/index.mjs

@@ -162,6 +162,7 @@ var FormEmitter = class extends EventEmitter {
     this.value_ = validValue(value);
     this.state_ = new FormState();
     this.errors_ = {};
+    this.emptyErrors_ = {};
     this.validators_ = validators ? Array.isArray(validators) ? validators : [validators] : [];
   }
   get isDirty() {
@@ -233,9 +234,15 @@ var FormEmitter = class extends EventEmitter {
   get unsubmitted() {
     return this.state_.unsubmitted;
   }
+  get required() {
+    return Boolean(this.emptyErrors_.required);
+  }
   get errors() {
     return this.errors_;
   }
+  get emptyErrors() {
+    return this.emptyErrors_;
+  }
   get validators() {
     return this.validators_;
   }
@@ -295,21 +302,18 @@ var FormEmitter = class extends EventEmitter {
     if (this.state_.disabled !== disabled) {
       this.state_.disabled = disabled;
       this.markAsDirty_ = true;
-      this.revalidate_();
     }
   }
   set hidden(hidden) {
     if (this.state_.hidden !== hidden) {
       this.state_.hidden = hidden;
       this.markAsDirty_ = true;
-      this.revalidate_();
     }
   }
   set readonly(readonly) {
     if (this.state_.readonly !== readonly) {
       this.state_.readonly = readonly;
       this.markAsDirty_ = true;
-      this.revalidate_();
     }
   }
   set dirty(dirty) {
@@ -346,6 +350,19 @@ var FormEmitter = class extends EventEmitter {
     }
     this.errors_ = errors;
   }
+  // emptyErrors
+  set emptyErrors(emptyErrors) {
+    if (!this.markAsDirty_) {
+      const previous = Object.entries(this.emptyErrors_);
+      const current = Object.entries(emptyErrors);
+      const differs = previous.length !== current.length || previous.reduce((p, [k, v], i) => {
+        const c = current[i];
+        return p || (c[0] !== k || c[1] !== v);
+      }, false);
+      this.markAsDirty_ = differs;
+    }
+    this.emptyErrors_ = emptyErrors;
+  }
   // validators
   set validators(validators) {
     if (this.validators_ !== validators) {
@@ -418,6 +435,7 @@ var FormAbstract = class extends FormEmitter {
         yield this.checkAsyncPropState_("disabled", options.disabled, root);
         yield this.checkAsyncPropState_("hidden", options.hidden, root);
         yield this.checkAsyncPropState_("readonly", options.readonly, root);
+        this.updateStateAndChange_();
       }
     });
   }
@@ -435,7 +453,7 @@ var FormAbstract = class extends FormEmitter {
       if (this.parent) {
         return yield this.parent.revalidate_();
       }
-      yield this.validateAndChange_();
+      return yield this.validateAndChange_();
     });
   }
   validateAndChange_(root) {
@@ -448,6 +466,7 @@ var FormAbstract = class extends FormEmitter {
     return __async(this, null, function* () {
       yield this.checkAsyncState_(root);
       const errors = {};
+      const emptyErrors = {};
       if (this.validators.length === 0 || this.disabled || this.submitted) {
         this.invalid = false;
       } else {
@@ -468,8 +487,22 @@ var FormAbstract = class extends FormEmitter {
         }));
         this.invalid = results.length > 0;
         Object.assign(errors, ...results);
+        const emptyValidations = this.validators_.map((x) => x("", root == null ? void 0 : root.value, this, root)).filter((x) => x);
+        const { emptyResults, emptyPromises } = emptyValidations.reduce((p, c) => {
+          isPromise(c) ? p.emptyPromises.push(c) : p.emptyResults.push(c);
+          return p;
+        }, { emptyResults: [], emptyPromises: [] });
+        emptyPromises.forEach((x) => x.then((emptyError) => {
+          if (emptyError) {
+            this.emptyErrors = Object.assign({}, this.emptyErrors_, emptyError);
+          }
+        }).catch((emptyError) => {
+          console.warn("Validation.async.emptyError", emptyError);
+        }));
+        Object.assign(emptyErrors, ...emptyResults);
       }
       this.errors = errors;
+      this.emptyErrors = emptyErrors;
       this.updateState_();
     });
   }
@@ -614,7 +647,7 @@ var FormAbstractCollection = class extends FormAbstract {
       if (this.parent) {
         return yield this.parent.revalidate_();
       }
-      yield this.validateAndChange_(this);
+      return yield this.validateAndChange_(this);
     });
   }
   validate_(root) {
@@ -788,6 +821,13 @@ var FormAbstractCollection = class extends FormAbstract {
   }
   set errors(errors) {
   }
+  get emptyErrors() {
+    return this.reduce_((result, control) => {
+      return Object.assign(result, control.emptyErrors);
+    }, {});
+  }
+  set emptyErrors(emptyErrors) {
+  }
 };
 
 // src/forms/form-array.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@websolutespa/bom-mixer-forms",
-  "version": "1.9.1",
+  "version": "1.9.3",
   "description": "Mixer Forms module of the BOM Repository",
   "keywords": [
     "bom",

package/src/forms/form-abstract-collection.ts

@@ -91,12 +91,12 @@ export class FormAbstractCollection<
     }
   }
 
-  async revalidate_(): Promise<void> {
+  async revalidate_(): Promise<boolean> {
     if (this.parent) {
       return await this.parent.revalidate_();
     }
     // console.log('FormAbstractCollection.revalidate_', this.name);
-    await this.validateAndChange_(this);
+    return await this.validateAndChange_(this);
   }
 
   async validate_(root?: FormCollection) {
@@ -305,4 +305,12 @@ export class FormAbstractCollection<
   }
 
   set errors(errors) { }
+
+  get emptyErrors(): ValidationError {
+    return this.reduce_((result: ValidationError, control: FormAbstract) => {
+      return Object.assign(result, control.emptyErrors);
+    }, {});
+  }
+
+  set emptyErrors(emptyErrors) { }
 }

package/src/forms/form-abstract.ts

@@ -58,11 +58,13 @@ export class FormAbstract<T = FormValue> extends FormEmitter {
   }
 
   protected async checkAsyncState_(root?: FormCollection): Promise<void> {
+    // console.log('FormAbstract.checkAsyncState_', this.name);
     const options = this.initialOptions_;
     if (options) {
       await this.checkAsyncPropState_('disabled', options.disabled, root);
       await this.checkAsyncPropState_('hidden', options.hidden, root);
       await this.checkAsyncPropState_('readonly', options.readonly, root);
+      this.updateStateAndChange_();
     }
   }
 
@@ -79,7 +81,7 @@ export class FormAbstract<T = FormValue> extends FormEmitter {
       return await this.parent.revalidate_();
     }
     // console.log('FormAbstract.revalidate_', this.name);
-    await this.validateAndChange_();
+    return await this.validateAndChange_();
   }
 
   async validateAndChange_(root?: FormCollection): Promise<boolean> {
@@ -92,6 +94,7 @@ export class FormAbstract<T = FormValue> extends FormEmitter {
     // console.log('FormAbstract.validate_', this.name);
     await this.checkAsyncState_(root);
     const errors: ValidationError = {};
+    const emptyErrors: ValidationError = {};
     if (this.validators.length === 0 || this.disabled || this.submitted) {
       this.invalid = false;
     } else {
@@ -114,9 +117,24 @@ export class FormAbstract<T = FormValue> extends FormEmitter {
       this.invalid = results.length > 0;
       Object.assign(errors, ...results);
       // console.log(`${this.name}.value`, '=', this.value_, '{', ...Object.keys(errors), '}');
-      // return this.errors_;
+      // emptyErrors
+      const emptyValidations = this.validators_.map((x) => x('', root?.value, this, root)).filter((x) => x);
+      const { emptyResults, emptyPromises } = emptyValidations.reduce((p: { emptyResults: (ValidationError | null)[], emptyPromises: Promise<ValidationError | null>[] }, c: (ValidationError | null) | Promise<ValidationError | null>) => {
+        isPromise(c) ? p.emptyPromises.push(c as Promise<ValidationError | null>) : p.emptyResults.push(c);
+        return p;
+      }, { emptyResults: [], emptyPromises: [] });
+      emptyPromises.forEach(x => x.then((emptyError: ValidationError | null) => {
+        // console.log('Validation.async.error', emptyError);
+        if (emptyError) {
+          this.emptyErrors = Object.assign({}, this.emptyErrors_, emptyError);
+        }
+      }).catch(emptyError => {
+        console.warn('Validation.async.emptyError', emptyError);
+      }));
+      Object.assign(emptyErrors, ...emptyResults);
     }
     this.errors = errors;
+    this.emptyErrors = emptyErrors;
     this.updateState_();
   }
 

package/src/forms/form-emitter.ts

@@ -59,6 +59,7 @@ export class FormEmitter<T = FormValue> extends EventEmitter {
   get pristine() { return this.state_.pristine; }
   get untouched() { return this.state_.untouched; }
   get unsubmitted() { return this.state_.unsubmitted; }
+  get required() { return Boolean(this.emptyErrors_.required); }
 
   // errors
   protected errors_: ValidationError;
@@ -66,6 +67,12 @@ export class FormEmitter<T = FormValue> extends EventEmitter {
     return this.errors_;
   }
 
+  // emptyErrors
+  protected emptyErrors_: ValidationError;
+  get emptyErrors() {
+    return this.emptyErrors_;
+  }
+
   // validators
   protected validators_: FormValidator[];
   get validators() {
@@ -78,6 +85,7 @@ export class FormEmitter<T = FormValue> extends EventEmitter {
     this.value_ = validValue(value);
     this.state_ = new FormState();
     this.errors_ = {};
+    this.emptyErrors_ = {};
     this.validators_ = validators ? (Array.isArray(validators) ? validators : [validators]) : [];
   }
 
@@ -142,21 +150,21 @@ export class FormEmitter<T = FormValue> extends EventEmitter {
     if (this.state_.disabled !== disabled) {
       this.state_.disabled = disabled;
       this.markAsDirty_ = true;
-      this.revalidate_();
+      // this.revalidate_();
     }
   }
   set hidden(hidden: boolean) {
     if (this.state_.hidden !== hidden) {
       this.state_.hidden = hidden;
       this.markAsDirty_ = true;
-      this.revalidate_();
+      // this.revalidate_();
     }
   }
   set readonly(readonly: boolean) {
     if (this.state_.readonly !== readonly) {
       this.state_.readonly = readonly;
       this.markAsDirty_ = true;
-      this.revalidate_();
+      // this.revalidate_();
     }
   }
   set dirty(dirty: boolean) {
@@ -197,6 +205,21 @@ export class FormEmitter<T = FormValue> extends EventEmitter {
     this.errors_ = errors;
   }
 
+  // emptyErrors
+  set emptyErrors(emptyErrors: ValidationError) {
+    if (!this.markAsDirty_) {
+      const previous = Object.entries(this.emptyErrors_);
+      const current = Object.entries(emptyErrors);
+      const differs = previous.length !== current.length ||
+        previous.reduce((p, [k, v], i) => {
+          const c = current[i];
+          return p || (c[0] !== k || c[1] !== v);
+        }, false);
+      this.markAsDirty_ = differs;
+    }
+    this.emptyErrors_ = emptyErrors;
+  }
+
   // validators
   set validators(validators) {
     if (this.validators_ !== validators) {

package/src/forms/types.ts

@@ -11,20 +11,20 @@ export type FormValueGroup = { [key: string]: FormValue };
 
 export type FormValueArray = FormValue[];
 
-export type IControlParam = { uid: number, control: FormControl };
+export type IControlParam = { control: FormControl };
 
 export type IFormOption = { id: IEquatable, name: string };
 
 export type FormOptions = {
   schema?: ControlType;
-  name?: string,
-  label?: string,
+  name?: string;
+  label?: string;
   value?: FormValue;
-  placeholder?: string,
-  required?: FormActivator,
-  hidden?: FormActivator,
-  disabled?: FormActivator,
-  readonly?: FormActivator,
+  placeholder?: string;
+  required?: FormActivator;
+  hidden?: FormActivator;
+  disabled?: FormActivator;
+  readonly?: FormActivator;
   options?: IOption[];
   optionsExtra?: { asEquatable: boolean };
   customData?: Record<string, any>;
@@ -81,9 +81,9 @@ export type IFormBuilderControlSchema = {
   value?: FormValue;
   placeholder?: string;
   required?: FormActivator;
-  hidden?: FormActivator,
-  disabled?: FormActivator,
-  readonly?: FormActivator,
+  hidden?: FormActivator;
+  disabled?: FormActivator;
+  readonly?: FormActivator;
   options?: IOption[];
   optionsExtra?: { asEquatable: boolean };
   validators?: FormValidator | FormValidator[];

package/src/forms/utils.ts

@@ -21,13 +21,6 @@ export function mapState_(state: FormState): FormFlags & FormDerivedFlags {
     untouched: !state.touched,
     unsubmitted: !state.submitted,
   };
-  /*
-  return Object.fromEntries(
-    Object.entries(
-      Object.getOwnPropertyDescriptors(state)
-    ).map(([k, v]) => [k, v.value])
-  ) as FormFlags & FormDerivedFlags;
-  */
 }
 
 export function valueToString(value: IOption | IOption[] | IEquatable | IEquatable[] | null): string | string[] | undefined {