@bolttech/form-engine-core 0.0.1-beta.12 → 0.0.1-beta.14

package/index.esm.js

@@ -2298,7 +2298,7 @@ class FormField {
     dataSubject$,
     mapper
   }) {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     this.fieldStateSubscription$ = new Subscription();
     this.originalSchema = schemaComponent;
     this.config = {
@@ -2311,14 +2311,14 @@ class FormField {
     this.path = path;
     this.children = children;
     this.validations = schemaComponent.validations;
-    this.errorMessages = schemaComponent.errorMessages;
+    this.errorMessages = (_a = schemaComponent.validations) === null || _a === void 0 ? void 0 : _a.messages;
     this.visibilityConditions = schemaComponent.visibilityConditions;
     this.resetValues = schemaComponent.resetValues;
     this.apiSchema = schemaComponent.api;
     this.formatters = schemaComponent.formatters;
     this.masks = schemaComponent.masks;
     if (mapper.valueChangeEvent) this.valueChangeEvent = mapper.valueChangeEvent;
-    if ((_a = mapper.events) === null || _a === void 0 ? void 0 : _a.setValue) this.valuePropName = mapper.events.setValue;
+    if ((_b = mapper.events) === null || _b === void 0 ? void 0 : _b.setValue) this.valuePropName = mapper.events.setValue;
     this.mapper = mapper;
     this.validateVisibility = validateVisibility;
     this.resetValue = resetValue;
@@ -2327,7 +2327,7 @@ class FormField {
     this.dataSubject$ = dataSubject$;
     this._props = schemaComponent.props || {};
     this._value = '';
-    this._stateValue = ((_b = this.mapper.events) === null || _b === void 0 ? void 0 : _b.setValue) ? {
+    this._stateValue = ((_c = this.mapper.events) === null || _c === void 0 ? void 0 : _c.setValue) ? {
       [this.mapper.events.setValue]: ''
     } : {};
     this._metadata = '';
@@ -2337,9 +2337,9 @@ class FormField {
     this._visibility = true;
     this._api = {
       default: {
-        response: ((_e = (_d = (_c = this.apiSchema) === null || _c === void 0 ? void 0 : _c.defaultConfig) === null || _d === void 0 ? void 0 : _d.config) === null || _e === void 0 ? void 0 : _e.fallbackValue) || ''
+        response: ((_f = (_e = (_d = this.apiSchema) === null || _d === void 0 ? void 0 : _d.defaultConfig) === null || _e === void 0 ? void 0 : _e.config) === null || _f === void 0 ? void 0 : _f.fallbackValue) || ''
       },
-      named: ((_f = this.apiSchema) === null || _f === void 0 ? void 0 : _f.configs) && Object.keys((_g = this.apiSchema) === null || _g === void 0 ? void 0 : _g.configs).reduce((acc, curr) => {
+      named: ((_g = this.apiSchema) === null || _g === void 0 ? void 0 : _g.configs) && Object.keys((_h = this.apiSchema) === null || _h === void 0 ? void 0 : _h.configs).reduce((acc, curr) => {
         var _a, _b;
         acc[curr] = {
           response: ((_b = (_a = this.apiSchema) === null || _a === void 0 ? void 0 : _a.configs) === null || _b === void 0 ? void 0 : _b[curr].config.fallbackValue) || ''
@@ -2392,6 +2392,9 @@ class FormField {
     });
     if (!isNil(this.initialValue)) {
       this.value = this.initialValue;
+      this.setFieldValidity({
+        event: 'ON_FORM_SUBMIT'
+      });
     }
   }
   /**
@@ -2529,7 +2532,7 @@ class FormField {
     this.errorsList = Object.values(this.errors);
     this.errorsString = this.errorsList.join(', ');
     /**
-     * if any error receieves a list of errors, set a prop for it, currently only supporting a single string
+     * if any error receives a list of errors, set a prop for it, currently only supporting a single string
      */
     ((_a = this.mapper.events) === null || _a === void 0 ? void 0 : _a.setErrorMessage) && this.errorSubject$.next({
       [this.mapper.events.setErrorMessage]: this.errorsString
@@ -2637,54 +2640,41 @@ class FormField {
   setFieldValidity({
     event
   }) {
-    var _a;
-    if (!this.validations) {
+    var _a, _b;
+    if (!this.validations || !this.visibility) {
+      this.errors = {};
       this._valid = true;
       return;
     }
-    /*
-      @TODO evaluate if _valid flag needs to be updated on all events, this condition saves resources,
-      currently form submition needs to be controlled with form instance submit property function that
-      will evaluate if all fields are valid regardless the events that triggers error messages
-    */
-    if (!this.validations.events.includes(event) && event !== 'ON_FORM_SUBMIT') return;
     let valid = true;
-    const errors = Object.assign({}, this.errors);
-    const schemaValidations = (_a = this.validations) === null || _a === void 0 ? void 0 : _a.config;
+    const errors = {};
+    const schemaValidations = (_a = this.validations) === null || _a === void 0 ? void 0 : _a.methods;
     schemaValidations && Object.keys(schemaValidations).forEach(validationKey => {
-      var _a;
       const error = validations[validationKey](this.value, schemaValidations);
       // setting valid flag
       valid = !error && valid;
       // setting error messages
-      if (((_a = this.validations) === null || _a === void 0 ? void 0 : _a.events.includes(event)) || event === 'ON_FORM_SUBMIT') {
-        if (error && this.errorMessages) {
-          if (validationKey in this.errorMessages) {
-            const messages = this.errorMessages;
-            errors[validationKey] = messages[validationKey];
-          } else if ('default' in this.errorMessages) {
-            errors[validationKey] = this.errorMessages.default;
-          }
-        } else {
-          delete errors[validationKey];
+      if (error && this.errorMessages) {
+        if (validationKey in this.errorMessages) {
+          const messages = this.errorMessages;
+          errors[validationKey] = messages[validationKey];
+        } else if ('default' in this.errorMessages) {
+          errors[validationKey] = this.errorMessages.default;
         }
+      } else {
+        delete errors[validationKey];
       }
     });
     this._valid = valid;
-    this.errors = errors;
-  }
-  /**
-   * WIP expensive function to get updated field validity on each event
-   */
-  updateValidityFlag() {
-    var _a;
-    let valid = true;
-    const schemaValidations = (_a = this.validations) === null || _a === void 0 ? void 0 : _a.config;
-    schemaValidations && Object.keys(schemaValidations).forEach(validationKey => {
-      const error = validations[validationKey](this.value, schemaValidations);
-      valid = !error && valid;
-    });
-    this._valid = valid;
+    if (this.validations.availableMessagesByEvent[event]) {
+      const erros2 = {};
+      (_b = this.validations.availableMessagesByEvent[event]) === null || _b === void 0 ? void 0 : _b.forEach(method => {
+        if (method in errors) {
+          erros2[method] = errors[method];
+        }
+      });
+      this.errors = erros2;
+    }
   }
   /**
    * Formats the field value using the specified formatters, if available.
@@ -2955,7 +2945,6 @@ class FormCore {
         validations,
         visibilityConditions,
         resetValues,
-        errorMessages,
         api
       }
     }, key) => {
@@ -2966,7 +2955,6 @@ class FormCore {
         validations,
         visibilityConditions,
         resetValues,
-        errorMessages,
         apiSchema: api
       };
       traverseObject(template, key).forEach(element => this.subscribedTemplates.push(element));
@@ -3221,10 +3209,16 @@ class FormCore {
         const error = validations[validationKey](field.value, structElement.validations);
         if (Array.isArray(structElement.fields)) {
           structElement.fields.forEach(fieldKey => {
-            if (!this.fields.has(fieldKey)) console.warn(`failed to update visibility onto field ${fieldKey}`);else this.fields.get(fieldKey).visibility = error;
+            if (!this.fields.has(fieldKey)) console.warn(`failed to update visibility onto field ${fieldKey}`);else {
+              this.fields.get(fieldKey).visibility = !error;
+              if (error) this.fields.get(fieldKey).value = '';
+            }
           });
         } else if (structElement.fields) {
-          if (!this.fields.has(structElement.fields)) console.warn(`failed to update visibility onto field ${structElement.fields}`);else this.fields.get(structElement.fields).visibility = error;
+          if (!this.fields.has(structElement.fields)) console.warn(`failed to update visibility onto field ${structElement.fields}`);else {
+            this.fields.get(structElement.fields).visibility = !error;
+            if (error) this.fields.get(structElement.fields).value = '';
+          }
         }
       });
     });
@@ -3413,6 +3407,7 @@ class FormCore {
         set(values, val.nameToSubmit || key, val.value);
       }
     });
+    console.log(values);
   }
   /**
    * Gets the current values of all form fields.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bolttech/form-engine-core",
-  "version": "0.0.1-beta.12",
+  "version": "0.0.1-beta.14",
   "module": "./index.esm.js",
   "type": "module",
   "main": "./index.esm.js",

package/src/interfaces/schema.d.ts

@@ -1,5 +1,5 @@
 import { TMapper } from '../types/mapper';
-import { TApiEvent, TErrorMessages, TEvent, TFormatters, TMasks, TProps, TResetValueMethods, TSchemaFormConfig, TValidationMethods, TVisibility } from '../types/schema';
+import { TApiEvent, TFormatters, TMasks, TProps, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
 /**
  * @interface IComponentSchema
  * Represents the schema for a component within a form.
@@ -40,11 +40,10 @@ interface IComponentSchema {
     props?: TProps;
     name: string;
     nameToSubmit?: string;
-    validations?: TEvent<TValidationMethods>;
+    validations?: TValidations;
     api?: TApiEvent;
     visibilityConditions?: TVisibility[];
     resetValues?: TResetValueMethods[];
-    errorMessages?: TErrorMessages;
     formatters?: TFormatters;
     masks?: TMasks;
     children?: IComponentSchema[];

package/src/managers/field.d.ts

@@ -1,5 +1,5 @@
 import { Observable, Subject, Subscription } from 'rxjs';
-import { TApiConfig, TApiEvent, TApiResponse, TErrorMessages, TEvent, TFormatters, TMasks, TResetValueMethods, TSchemaFormConfig, TValidationMethods, TVisibility } from '../types/schema';
+import { TApiConfig, TApiEvent, TApiResponse, TErrorMessages, TFormatters, TMasks, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
 import { IComponentSchema, IComponentSchemaAsFormField } from '../interfaces/schema';
 import { IState } from '../interfaces/state';
 import { TEvents, TFieldEvent, TMutationEvents, TValueChangeEvent } from '../types/event';
@@ -15,7 +15,7 @@ declare class FormField {
     path?: string;
     children?: string[];
     originalSchema: IComponentSchemaAsFormField<unknown>;
-    validations?: TEvent<TValidationMethods>;
+    validations?: TValidations;
     visibilityConditions?: TVisibility[];
     resetValues?: TResetValueMethods[];
     errorMessages?: TErrorMessages;
@@ -221,10 +221,6 @@ declare class FormField {
     setFieldValidity({ event }: {
         event: TEvents;
     }): void;
-    /**
-     * WIP expensive function to get updated field validity on each event
-     */
-    updateValidityFlag(): void;
     /**
      * Formats the field value using the specified formatters, if available.
      *

package/src/types/schema.d.ts

@@ -666,31 +666,11 @@ type TProps = Record<string, unknown>;
  * };
  * ```
  */
-type TValidations = Partial<Record<TEvents, TValidationMethods>>;
-/**
- * @type TVisibilityConditions
- * Represents the visibility conditions for different events.
- *
- * @example
- * ```typescript
- * const visibilityConditions: TVisibilityConditions = {
- *   ON_FIELD_BLUR: [{ validations: { required: true }, fields: ['fieldName'] }]
- * };
- * ```
- */
-type TVisibilityConditions = Partial<Record<TEvents, TVisibility[]>>;
-/**
- * @type TResetValues
- * Represents the reset value methods for different events.
- *
- * @example
- * ```typescript
- * const resetValues: TResetValues = {
- *   ON_FIELD_BLUR: [{ validations: { required: true }, fields: ['fieldName'], resettledValue: [''] }]
- * };
- * ```
- */
-type TResetValues = Partial<Record<TEvents, TResetValueMethods[]>>;
+type TValidations = {
+    methods: TValidationMethods;
+    availableMessagesByEvent: Partial<Record<TEvents, string[]>>;
+    messages: TErrorMessages;
+};
 /**
  * @type TErrorMessages
  * Represents the error messages for different validation methods.
@@ -750,4 +730,4 @@ type TSchemaFormConfig = {
     defaultAPIdebounceTimeMS?: number;
     defaultStateRefreshTimeMS?: number;
 };
-export { TApiConfig, TErrorMessages, TResetValues, TVisibilityConditions, TValidations, TMasks, TProps, TResetValueMethods, TFormatters, TValidationMethods, TEvent, TVisibility, TApiEvent, TApiResponse, TSchemaFormConfig, TLengthValidation, TCreditCardMatch, TDocumentValidation, TCallbackValidation, TBetweenValidation, TMaskGeneric, TSplitterFormatterValue, TCurrencyMask, TDateOperatorsValidation, TConditionsValidationSet, TConditionsValidation, TMultipleValidation, TAvailableValidations, TDateValidation, TBetweenDatesValidation, TDateFormatsValidation, TDateInterval, };
+export { TApiConfig, TErrorMessages, TValidations, TMasks, TProps, TResetValueMethods, TFormatters, TValidationMethods, TEvent, TVisibility, TApiEvent, TApiResponse, TSchemaFormConfig, TLengthValidation, TCreditCardMatch, TDocumentValidation, TCallbackValidation, TBetweenValidation, TMaskGeneric, TSplitterFormatterValue, TCurrencyMask, TDateOperatorsValidation, TConditionsValidationSet, TConditionsValidation, TMultipleValidation, TAvailableValidations, TDateValidation, TBetweenDatesValidation, TDateFormatsValidation, TDateInterval, };