@bolttech/form-engine-core 0.0.2-beta.7 → 0.0.3-beta.2

package/index.esm.js

@@ -1,4 +1,4 @@
-import { Subject, Subscription, combineLatest, startWith, groupBy, mergeMap, debounceTime, filter, map, distinctUntilKeyChanged } from 'rxjs';
+import { Subject, Subscription, combineLatest, startWith, groupBy, mergeMap, debounceTime, filter, map, distinctUntilKeyChanged, distinctUntilChanged } from 'rxjs';
 import creditCardType from 'credit-card-type';
 import { isNumber as isNumber$1, isFunction, cloneDeep, isEqual, get, isNil, set } from 'lodash';
 import { getCurrencySymbol } from '@gaignoux/currency';
@@ -51,6 +51,8 @@ const TEMPLATE_REGEX_DELIMITATOR = /\$\{((?:[^{}]|\{(?:[^{}]|\{[^{}]*\})*\})*)\}
 const TEMPLATE_REGEX_OPERATOR_SPLITTER = /\s*(\|\||&&|!)\s*/g;
 const TEMPLATE_REGEX_OPERATOR_MATCHER = /^\|\||&&|!$/;
 const TEMPLATE_AVALIABLE_SCOPES = ['fields', 'iVars'];
+const ALLOWED_RESET_PROPS_MUTATIONS = ['api', 'apiSchema', 'props', 'validations', 'visibilityConditions', 'resetValues'];
+const DEFAULT_LOG_VERBOSE = false;
 
 /**
  * Makes an HTTP request using XMLHttpRequest.
@@ -66,9 +68,16 @@ const TEMPLATE_AVALIABLE_SCOPES = ['fields', 'iVars'];
  * const response = await makeRequest('GET', 'https://api.example.com/data');
  * ```
  */
-function makeRequest(method, url, headers, body) {
+function makeRequest(method, url, headers, body, queryParams) {
   return new Promise(function (resolve, reject) {
     const xhr = new XMLHttpRequest();
+    if (queryParams) {
+      const newUrl = new URL(url);
+      Object.keys(queryParams).forEach(param => {
+        newUrl.searchParams.append(param, queryParams[param]);
+      });
+      url = newUrl.toString();
+    }
     xhr.open(method, url, true);
     if (headers) {
       Object.keys(headers).forEach(header => {
@@ -2467,7 +2476,7 @@ class FormField {
    * @param {string[]} options.children - An array of children fields names.
    * @param {Function} options.validateVisibility - A function to validate the visibility of the field.
    * @param {Function} options.resetValue - A function to reset the field value.
-   * @param {unknown} [options.initialValue] - The initial value of the form field.
+   * @param {Function} options.resetProperty - A function to reset a field property.
    * @param {Subject<{ key: string }>} options.templateSubject$ - A subject for template updates.
    * @param {Subject<TFieldEvent>} options.fieldEventSubject$, - Subject for basic event mapped field emissions, except onData to form instance
    * @param {Subject<{ key: string; event: TEvents }>} options.dataSubject$, - Subject to emit onData events to form instance
@@ -2482,7 +2491,7 @@ class FormField {
     children,
     validateVisibility,
     resetValue,
-    initialValue,
+    resetProperty,
     templateSubject$,
     fieldEventSubject$,
     dataSubject$,
@@ -2496,7 +2505,8 @@ class FormField {
     this.originalSchema = cloneDeep(schemaComponent);
     this.config = {
       defaultAPIdebounceTimeMS: Number(config === null || config === void 0 ? void 0 : config.defaultAPIdebounceTimeMS) ? Number(config === null || config === void 0 ? void 0 : config.defaultAPIdebounceTimeMS) : DEFAULT_API_DEBOUNCE_TIME,
-      defaultStateRefreshTimeMS: Number(config === null || config === void 0 ? void 0 : config.defaultStateRefreshTimeMS) ? Number(config === null || config === void 0 ? void 0 : config.defaultStateRefreshTimeMS) : DEFAULT_STATE_REFRESH_TIME
+      defaultStateRefreshTimeMS: Number(config === null || config === void 0 ? void 0 : config.defaultStateRefreshTimeMS) ? Number(config === null || config === void 0 ? void 0 : config.defaultStateRefreshTimeMS) : DEFAULT_STATE_REFRESH_TIME,
+      defaultLogVerbose: (config === null || config === void 0 ? void 0 : config.defaultLogVerbose) ? config.defaultLogVerbose : DEFAULT_LOG_VERBOSE
     };
     this.name = schemaComponent.name;
     this.nameToSubmit = schemaComponent.nameToSubmit;
@@ -2507,6 +2517,7 @@ class FormField {
     this.errorMessages = cloneDeep((_a = schemaComponent.validations) === null || _a === void 0 ? void 0 : _a.messages);
     this.visibilityConditions = cloneDeep(schemaComponent.visibilityConditions);
     this.resetValues = cloneDeep(schemaComponent.resetValues);
+    this.resetPropertyValues = cloneDeep(schemaComponent.resetPropertyValues);
     this.apiSchema = cloneDeep(schemaComponent.api);
     this.formatters = cloneDeep(schemaComponent.formatters);
     this.masks = cloneDeep(schemaComponent.masks);
@@ -2515,6 +2526,7 @@ class FormField {
     this.mapper = mapper;
     this.validateVisibility = validateVisibility;
     this.resetValue = resetValue;
+    this.resetProperty = resetProperty;
     this.getFormValues = getFormValues;
     this.templateSubject$ = templateSubject$;
     this.fieldEventSubject$ = fieldEventSubject$;
@@ -2524,7 +2536,6 @@ class FormField {
     this._metadata = '';
     this.errorsString = '';
     this.errorsList = [];
-    this.initialValue = initialValue || (this.valuePropName && !String(this.props[this.valuePropName]).includes('${') ? this.props[this.valuePropName] : null);
     this._visibility = true;
     this._api = {
       default: {
@@ -2544,7 +2555,6 @@ class FormField {
     this._mounted = true;
     this._valid = false;
     this.initializeObservers();
-    this.value = this.initialValue || '';
   }
   /**
    * method to initialize all recycled Subjects and initialize Observers on field instance creation or rerender
@@ -2688,23 +2698,6 @@ class FormField {
   set visibility(visible) {
     if (typeof visible === 'undefined' || visible === this.visibility) return;
     this._visibility = visible;
-    /**
-     * I was sure I would not require to gambiarra, but..
-     * in order to ignore an hidden value on a form submit
-     * or revalidate it when it comes back to visibility
-     * I needed to...
-     * I don't recommend setting private properties like this
-     * this will force the field to be valid when it's hidden
-     * and trigger the validation when it's visible
-     */
-    if (!this.visibility) {
-      this.value = '';
-      this.valid = true;
-    } else {
-      this.setFieldValidity({
-        event: 'ON_FIELD_MOUNT'
-      });
-    }
     this.visibilitySubject$.next(this.visibility);
     this.templateSubject$.next({
       scope: 'fields',
@@ -2814,6 +2807,7 @@ class FormField {
    * @returns {void}
    */
   emitValue(prop) {
+    if (!this.visibility) return;
     this.value = prop.value;
     this.emitEvents({
       event: prop.event
@@ -2843,6 +2837,10 @@ class FormField {
       event,
       key: this.name
     });
+    this.resetProperty({
+      event,
+      key: this.name
+    });
     this.apiEventQueueSubject$.next({
       event
     });
@@ -2956,7 +2954,7 @@ class FormField {
           const {
             status,
             response
-          } = yield makeRequest(config.method, config.url, config.headers, config.body);
+          } = yield makeRequest(config.method, config.url, config.headers, config.body, config.queryParams);
           const callbackTransform = (_k = config.transform) === null || _k === void 0 ? void 0 : _k.callback;
           const apiResponseData = callbackTransform ? callbackTransform({
             payload: JSON.parse(String(response)),
@@ -3042,6 +3040,9 @@ class FormField {
     this.errorSubject$.unsubscribe();
     this.apiSubject$.unsubscribe();
     this.apiEventQueueSubject$.unsubscribe();
+    this.formValidNotification$.next({
+      fieldTrigger: this.name
+    });
   }
   /**
    * Subscribes to changes in the field state and executes the provided callback function.
@@ -3083,20 +3084,22 @@ class FormCore {
    * @param {((payload: {field: string;data: TFormValues;}) => void) | undefined} [entry.onData] - A callback function to handle data emission.
    */
   constructor(entry) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
     this.templateSubscription$ = new Subscription();
     this.mappers = new Map();
     this.queuedFieldVisibilityEvents = new Map();
     this.queuedFieldResetValuesEvents = new Map();
+    this.queuedFieldResetPropertyEvents = new Map();
+    this.queuedInitialValues = new Map();
     this.schema = entry.schema;
     this.fields = new Map();
-    this.initialValues = entry.initialValues || ((_a = entry.schema) === null || _a === void 0 ? void 0 : _a.initialValues);
-    this.action = entry.action || ((_b = entry.schema) === null || _b === void 0 ? void 0 : _b.action);
-    this.method = entry.method || ((_c = entry.schema) === null || _c === void 0 ? void 0 : _c.method);
-    this._iVars = entry.iVars || ((_d = entry.schema) === null || _d === void 0 ? void 0 : _d.iVars) || {};
+    this.action = entry.action || ((_a = entry.schema) === null || _a === void 0 ? void 0 : _a.action);
+    this.method = entry.method || ((_b = entry.schema) === null || _b === void 0 ? void 0 : _b.method);
+    this._iVars = entry.iVars || ((_c = entry.schema) === null || _c === void 0 ? void 0 : _c.iVars) || {};
     this.config = {
-      defaultAPIdebounceTimeMS: Number((_e = entry.config) === null || _e === void 0 ? void 0 : _e.defaultAPIdebounceTimeMS) ? Number((_f = entry.config) === null || _f === void 0 ? void 0 : _f.defaultAPIdebounceTimeMS) : DEFAULT_API_DEBOUNCE_TIME,
-      defaultStateRefreshTimeMS: Number((_g = entry.config) === null || _g === void 0 ? void 0 : _g.defaultStateRefreshTimeMS) ? Number((_h = entry.config) === null || _h === void 0 ? void 0 : _h.defaultStateRefreshTimeMS) : DEFAULT_STATE_REFRESH_TIME
+      defaultAPIdebounceTimeMS: Number((_d = entry.config) === null || _d === void 0 ? void 0 : _d.defaultAPIdebounceTimeMS) ? Number((_e = entry.config) === null || _e === void 0 ? void 0 : _e.defaultAPIdebounceTimeMS) : DEFAULT_API_DEBOUNCE_TIME,
+      defaultStateRefreshTimeMS: Number((_f = entry.config) === null || _f === void 0 ? void 0 : _f.defaultStateRefreshTimeMS) ? Number((_g = entry.config) === null || _g === void 0 ? void 0 : _g.defaultStateRefreshTimeMS) : DEFAULT_STATE_REFRESH_TIME,
+      defaultLogVerbose: ((_h = entry.config) === null || _h === void 0 ? void 0 : _h.defaultLogVerbose) ? entry.config.defaultLogVerbose : DEFAULT_LOG_VERBOSE
     };
     (_j = entry.mappers) === null || _j === void 0 ? void 0 : _j.map(mapper => {
       this.mappers.set(mapper.componentName, mapper);
@@ -3117,20 +3120,39 @@ class FormCore {
       event: 'ON_IVARS'
     });
     /*
-      mount events needs to occur on form level, only when all the fields are instantiated
-      is it possible to apply all the side effects that occur globally, same effect occur
-      onto refreshFields
+    only emits event ON_FIELD_MOUNT if does not have initialValue, if has initialValue, initialValues class property setter will
+    emit the value along with ON_FIELD_MOUNT event
     */
+    const initialValues = entry.initialValues || ((_k = entry.schema) === null || _k === void 0 ? void 0 : _k.initialValues);
     this.fields.forEach((field, key) => {
-      field.emitEvents({
-        event: 'ON_FIELD_MOUNT'
-      });
+      if (!initialValues || initialValues && !Object.keys(initialValues).includes(key)) {
+        !(field === null || field === void 0 ? void 0 : field.value) && (field === null || field === void 0 ? void 0 : field.emitValue({
+          value: '',
+          event: 'ON_FIELD_MOUNT'
+        }));
+      }
       this.refreshTemplates({
         scope: 'fields',
         key,
         event: 'ON_FIELDS'
       });
     });
+    this.setInitialValues(initialValues);
+  }
+  setInitialValues(payload) {
+    if (payload) {
+      Object.keys(payload).forEach(key => {
+        const field = this.fields.get(key);
+        if (!field || !(field === null || field === void 0 ? void 0 : field.visibility)) {
+          this.queuedInitialValues.set(key, payload === null || payload === void 0 ? void 0 : payload[key]);
+        } else {
+          field.emitValue({
+            value: payload === null || payload === void 0 ? void 0 : payload[key],
+            event: 'ON_FIELD_MOUNT'
+          });
+        }
+      });
+    }
   }
   /**
    * Retrieves the internal variables (iVars) of the form.
@@ -3176,6 +3198,7 @@ class FormCore {
         validations,
         visibilityConditions,
         resetValues,
+        resetPropertyValues,
         api
       }
     }, key) => {
@@ -3186,6 +3209,7 @@ class FormCore {
         validations,
         visibilityConditions,
         resetValues,
+        resetPropertyValues,
         apiSchema: api
       };
       traverseObject(template, key).forEach(element => this.subscribedTemplates.push(element));
@@ -3215,7 +3239,7 @@ class FormCore {
       case 'fields':
         {
           const field = this.fields.get(key);
-          if (!field) return console.warn(`failed to get value from ${key}`);
+          if (!field) return this.config.defaultLogVerbose && console.warn(`failed to get value from ${key}`);
           if (property === 'props' && path[0] === field.valuePropName) {
             return field.value;
           }
@@ -3243,7 +3267,7 @@ class FormCore {
   }) {
     const field = this.fields.get(key);
     if (!field) {
-      console.warn(`failed to update field ${key}`);
+      this.config.defaultLogVerbose && console.warn(`failed to update field ${key}`);
       return;
     }
     if (path.length > 0) {
@@ -3267,7 +3291,7 @@ class FormCore {
       } else if (typeof fieldProp === 'object' && !isNil(fieldProp)) {
         propState = Object.assign({}, fieldProp);
       } else {
-        console.warn(`invalid template property, skipping evaluation of ${field.name} with ${fieldProp}`);
+        this.config.defaultLogVerbose && console.warn(`invalid template property, skipping evaluation of ${field.name} with ${fieldProp}`);
         return;
       }
       set(propState, path, value);
@@ -3358,8 +3382,8 @@ class FormCore {
       try {
         return parse ? new Function(`return ${value}`)() : value;
       } catch (_a) {
-        console.warn(`unhandled parsing on ${expression} returning`);
-        console.warn(value);
+        this.config.defaultLogVerbose && console.warn(`unhandled parsing on ${expression} returning`);
+        this.config.defaultLogVerbose && console.warn(value);
         return value;
       }
     });
@@ -3441,33 +3465,67 @@ class FormCore {
       }, this.queuedFieldVisibilityEvents.get(field)));
       this.queuedFieldVisibilityEvents.delete(field);
     }
+    if (this.queuedInitialValues.has(field)) {
+      this.setInitialValues({
+        [field]: this.queuedInitialValues.get(field)
+      });
+      this.queuedInitialValues.delete(field);
+    }
     if (this.queuedFieldResetValuesEvents.has(field)) {
       this.setResetFieldValue(Object.assign({
         key: field
       }, this.queuedFieldResetValuesEvents.get(field)));
       this.queuedFieldResetValuesEvents.delete(field);
     }
+    if (this.queuedFieldResetPropertyEvents.has(field)) {
+      this.setResetPathValue(Object.assign({
+        key: field
+      }, this.queuedFieldResetPropertyEvents.get(field)));
+      this.queuedFieldResetPropertyEvents.delete(field);
+    }
   }
   /**
    * @internal
    * Update field visibility accordingly.
    *
-   * @param {string} field - Field name to be updated.
-   * @param {boolean} hasError - Condition to be used as visibility.
-   * @param {boolean|undefined} showOnlyIfTrue - Flag to be considered when update field visibility. If it's true, then considered error, if it's false, always considered the opposite.
+   * @param {object} options - options to set field visibility
+   * @param {string} options.field - Field name to be updated.
+   * @param {boolean} options.hasError - Condition to be used as visibility.
+   * @param {boolean|undefined} options.showOnlyIfTrue - Flag to be considered when update field visibility. If it's true, then considered error, if it's false, always considered the opposite.
    */
   setFieldVisibility({
     field,
     hasError,
     showOnlyIfTrue
   }) {
-    if (!this.fields.has(field)) {
+    const fieldInstance = this.fields.get(field);
+    if (!fieldInstance) {
       this.queuedFieldVisibilityEvents.set(field, {
         hasError,
         showOnlyIfTrue
       });
     } else {
-      this.fields.get(field).visibility = showOnlyIfTrue ? hasError : !hasError;
+      const visibility = showOnlyIfTrue ? hasError : !hasError;
+      fieldInstance.visibility = visibility;
+      /**
+       * I was sure I would not require to gambiarra, but..
+       * in order to ignore an hidden value on a form submit
+       * or revalidate it when it comes back to visibility
+       * I needed to...
+       * I don't recommend setting private properties like this
+       * this will force the field to be valid when it's hidden
+       * and trigger the validation when it's visible
+       */
+      if (fieldInstance.visibility) {
+        fieldInstance === null || fieldInstance === void 0 ? void 0 : fieldInstance.emitValue({
+          value: this.queuedInitialValues.get(field) || '',
+          event: 'ON_FIELD_MOUNT'
+        });
+        this.queuedInitialValues.delete(field);
+      } else {
+        fieldInstance.value = '';
+        fieldInstance.valid = true;
+      }
     }
   }
   /**
@@ -3512,8 +3570,9 @@ class FormCore {
    * @internal
    * Update field value and emit change and cleared event.
    *
-   * @param {string} key - Field name to be updated.
-   * @param {unknown} value - Value to be inserted into field.
+   * @param {options} options to reset the field value
+   * @param {string} options.key - Field name to be updated.
+   * @param {unknown} options.value - Value to be inserted into field.
    */
   setResetFieldValue({
     key,
@@ -3527,9 +3586,6 @@ class FormCore {
       const field = this.fields.get(key);
       field.emitValue({
         value: value,
-        event: 'ON_FIELD_CHANGE'
-      });
-      field.emitEvents({
         event: 'ON_FIELD_CLEARED'
       });
     }
@@ -3577,6 +3633,76 @@ class FormCore {
       });
     });
   }
+  /**
+   * @internal
+   * Update field property and emit template change.
+   *
+   * @param {object} options - Options for resetting field property
+   * @param {string} options.key - Field name to be updated.
+   * @param {string} options.property - field property to change.
+   * @param {string} options.path - field property path to change.
+   * @param {unknown} options.value - Value to be inserted into field.
+   */
+  setResetPathValue({
+    key,
+    property,
+    path,
+    value
+  }) {
+    if (!this.fields.has(key)) {
+      this.queuedFieldResetPropertyEvents.set(key, {
+        property,
+        path,
+        value
+      });
+    } else {
+      this.setValue({
+        key,
+        property,
+        path: path.split('.'),
+        value: value,
+        event: 'ON_RESET'
+      });
+    }
+  }
+  /**
+   * Resets field properties based on reset conditions defined in the schema.
+   *
+   * @param {object} options - Options for resetting field property.
+   * @param {TEvents} options.event - The event triggering the reset.
+   * @param {string} options.key - The key of the field.
+   */
+  resetProperty({
+    event,
+    key
+  }) {
+    const field = this.fields.get(key);
+    const structResetPath = field === null || field === void 0 ? void 0 : field.resetPropertyValues;
+    if (!structResetPath || !(structResetPath === null || structResetPath === void 0 ? void 0 : structResetPath.some(config => config.events.includes(event)))) return;
+    structResetPath.forEach(structElement => {
+      if (!structElement.events.includes(event)) return;
+      if (!ALLOWED_RESET_PROPS_MUTATIONS.includes(structElement.property)) return;
+      if (!structElement.validations) {
+        return this.setResetPathValue({
+          key: structElement.field,
+          path: structElement.path,
+          property: structElement.property,
+          value: structElement.resettledValue
+        });
+      }
+      Object.keys(structElement.validations).forEach(validationKey => {
+        const error = handleValidation(field.value, structElement.validations, validations, validationKey);
+        if (!error) {
+          this.setResetPathValue({
+            key: structElement.field,
+            path: structElement.path,
+            property: structElement.property,
+            value: structElement.resettledValue
+          });
+        }
+      });
+    });
+  }
   /**
    * Adds a field onto the form instance regardless there is a schema or not
    *
@@ -3587,7 +3713,7 @@ class FormCore {
     fieldSchema,
     mapperElement
   }) {
-    var _a, _b, _c;
+    var _a;
     if (this.fields.has(fieldSchema.name)) {
       throw new Error(`field name ${fieldSchema.name} already defined`);
     }
@@ -3599,8 +3725,8 @@ class FormCore {
       children: fieldSchema.children ? fieldSchema.children.map(el => el.name) : [],
       validateVisibility: this.validateVisibility.bind(this),
       resetValue: this.resetValue.bind(this),
+      resetProperty: this.resetProperty.bind(this),
       getFormValues: this.getFormValues.bind(this),
-      initialValue: (_b = this.initialValues) === null || _b === void 0 ? void 0 : _b[fieldSchema.name],
       templateSubject$: this.templateSubject$,
       fieldEventSubject$: this.fieldEventSubject$,
       dataSubject$: this.dataSubject$,
@@ -3610,13 +3736,16 @@ class FormCore {
     this.subscribeTemplates();
     this.refreshTemplates({
       scope: 'fields',
-      event: 'ON_FIELDS',
-      key: fieldSchema.name
+      event: 'ON_FIELDS'
     });
+    if (!this.queuedInitialValues.has(fieldSchema.name)) {
+      const field = this.fields.get(fieldSchema.name);
+      !(field === null || field === void 0 ? void 0 : field.value) && (field === null || field === void 0 ? void 0 : field.emitValue({
+        value: '',
+        event: 'ON_FIELD_MOUNT'
+      }));
+    }
     this.checkFieldEventQueues(fieldSchema.name);
-    (_c = this.fields.get(fieldSchema.name)) === null || _c === void 0 ? void 0 : _c.emitEvents({
-      event: 'ON_FIELD_MOUNT'
-    });
   }
   removeField({
     key
@@ -3640,7 +3769,7 @@ class FormCore {
   serializeStructure(struct, path) {
     if (!struct) return;
     struct.forEach(structElement => {
-      var _a, _b, _c;
+      var _a, _b;
       const currField = this.fields.get(structElement.name);
       if (!currField) {
         let mapper;
@@ -3657,7 +3786,7 @@ class FormCore {
           children: structElement.children ? structElement.children.map(el => el.name) : [],
           validateVisibility: this.validateVisibility.bind(this),
           resetValue: this.resetValue.bind(this),
-          initialValue: (_b = this.initialValues) === null || _b === void 0 ? void 0 : _b[structElement.name],
+          resetProperty: this.resetProperty.bind(this),
           templateSubject$: this.templateSubject$,
           fieldEventSubject$: this.fieldEventSubject$,
           dataSubject$: this.dataSubject$,
@@ -3666,7 +3795,7 @@ class FormCore {
           getFormValues: this.getFormValues.bind(this)
         }));
       } else {
-        currField.children = ((_c = structElement === null || structElement === void 0 ? void 0 : structElement.children) === null || _c === void 0 ? void 0 : _c.map(el => el.name)) || (currField === null || currField === void 0 ? void 0 : currField.children) || [];
+        currField.children = ((_b = structElement === null || structElement === void 0 ? void 0 : structElement.children) === null || _b === void 0 ? void 0 : _b.map(el => el.name)) || (currField === null || currField === void 0 ? void 0 : currField.children) || [];
         currField.path = path;
         currField.originalSchema = structElement;
         currField.templateSubject$ = this.templateSubject$;
@@ -3834,12 +3963,12 @@ class FormCore {
     this.submitSubject$.next(values);
   }
   destroy() {
+    this.fields.forEach(field => field.destroyField());
     this.submitSubject$.unsubscribe();
     this.templateSubscription$.unsubscribe();
     this.fieldEventSubject$.unsubscribe();
     this.dataSubject$.unsubscribe();
     this.formValidNotification$.unsubscribe();
-    this.fields.forEach(field => field.destroyField());
   }
 }
 /**
@@ -3878,14 +4007,15 @@ class FormGroup {
    * Creates an instance of FormGroup.
    */
   constructor(entry) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e;
     this.destroy = () => {
       this.forms.forEach(form => form.destroy());
     };
     this.forms = new Map();
     this.config = {
       defaultAPIdebounceTimeMS: Number((_a = entry === null || entry === void 0 ? void 0 : entry.config) === null || _a === void 0 ? void 0 : _a.defaultAPIdebounceTimeMS) ? Number((_b = entry === null || entry === void 0 ? void 0 : entry.config) === null || _b === void 0 ? void 0 : _b.defaultAPIdebounceTimeMS) : DEFAULT_API_DEBOUNCE_TIME,
-      defaultStateRefreshTimeMS: Number((_c = entry === null || entry === void 0 ? void 0 : entry.config) === null || _c === void 0 ? void 0 : _c.defaultStateRefreshTimeMS) ? Number((_d = entry === null || entry === void 0 ? void 0 : entry.config) === null || _d === void 0 ? void 0 : _d.defaultStateRefreshTimeMS) : DEFAULT_STATE_REFRESH_TIME
+      defaultStateRefreshTimeMS: Number((_c = entry === null || entry === void 0 ? void 0 : entry.config) === null || _c === void 0 ? void 0 : _c.defaultStateRefreshTimeMS) ? Number((_d = entry === null || entry === void 0 ? void 0 : entry.config) === null || _d === void 0 ? void 0 : _d.defaultStateRefreshTimeMS) : DEFAULT_STATE_REFRESH_TIME,
+      defaultLogVerbose: ((_e = entry === null || entry === void 0 ? void 0 : entry.config) === null || _e === void 0 ? void 0 : _e.defaultLogVerbose) ? entry.config.defaultLogVerbose : DEFAULT_LOG_VERBOSE
     };
   }
   /**
@@ -4031,7 +4161,7 @@ class FormGroup {
       if (sub) {
         acc[formId] = sub;
       } else {
-        console.warn(`failed to register form id ${formId}`);
+        this.config.defaultLogVerbose && console.warn(`failed to register form id ${formId}`);
       }
       return acc;
     }, {});
@@ -4049,11 +4179,11 @@ class FormGroup {
       }), map(() => {
         var _a;
         return ((_a = this.forms.get(formId)) === null || _a === void 0 ? void 0 : _a.isValid) === false ? false : true;
-      }));
+      }), distinctUntilChanged());
       if (sub) {
         acc[formId] = sub;
       } else {
-        console.warn(`failed to register validation subscription form id ${formId}`);
+        this.config.defaultLogVerbose && console.warn(`failed to register validation subscription form id ${formId}`);
       }
       return acc;
     }, {});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bolttech/form-engine-core",
-  "version": "0.0.2-beta.7",
+  "version": "0.0.3-beta.2",
   "module": "./index.esm.js",
   "type": "module",
   "main": "./index.esm.js",

package/src/constants/constants.d.ts

@@ -5,4 +5,6 @@ declare const TEMPLATE_REGEX_DELIMITATOR: RegExp;
 declare const TEMPLATE_REGEX_OPERATOR_SPLITTER: RegExp;
 declare const TEMPLATE_REGEX_OPERATOR_MATCHER: RegExp;
 declare const TEMPLATE_AVALIABLE_SCOPES: readonly ["fields", "iVars"];
-export { DEFAULT_API_DEBOUNCE_TIME, DEFAULT_STATE_REFRESH_TIME, TEMPLATE_REGEX_STRING_CONCATENATION_DETECTOR, TEMPLATE_REGEX_DELIMITATOR, TEMPLATE_REGEX_OPERATOR_SPLITTER, TEMPLATE_REGEX_OPERATOR_MATCHER, TEMPLATE_AVALIABLE_SCOPES, };
+declare const ALLOWED_RESET_PROPS_MUTATIONS: ("api" | "apiSchema" | "props" | "validations" | "visibilityConditions" | "resetValues")[];
+declare const DEFAULT_LOG_VERBOSE = false;
+export { DEFAULT_API_DEBOUNCE_TIME, DEFAULT_STATE_REFRESH_TIME, DEFAULT_LOG_VERBOSE, TEMPLATE_REGEX_STRING_CONCATENATION_DETECTOR, TEMPLATE_REGEX_DELIMITATOR, TEMPLATE_REGEX_OPERATOR_SPLITTER, TEMPLATE_REGEX_OPERATOR_MATCHER, TEMPLATE_AVALIABLE_SCOPES, ALLOWED_RESET_PROPS_MUTATIONS, };

package/src/helpers/helpers.d.ts

@@ -17,7 +17,7 @@ import { OutgoingHttpHeaders } from 'http2';
  * const response = await makeRequest('GET', 'https://api.example.com/data');
  * ```
  */
-declare function makeRequest(method: string, url: string, headers?: OutgoingHttpHeaders, body?: Record<string, unknown>): Promise<TApiResponsePayload>;
+declare function makeRequest(method: string, url: string, headers?: OutgoingHttpHeaders, body?: Record<string, unknown>, queryParams?: Record<string, string>): Promise<TApiResponsePayload>;
 /**
  * Extracts keys enclosed in `${}` from a given expression.
  *

package/src/interfaces/schema.d.ts

@@ -1,5 +1,5 @@
 import { TMapper } from '../types/mapper';
-import { TApiEvent, TFormatters, TMasks, TProps, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
+import { TApiEvent, TFormatters, TMasks, TProps, TResetPathMethods, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
 /**
  * @interface IComponentSchema
  * Represents the schema for a component within a form.
@@ -58,6 +58,7 @@ interface IComponentSchema {
     api?: TApiEvent;
     visibilityConditions?: TVisibility[];
     resetValues?: TResetValueMethods[];
+    resetPropertyValues?: TResetPathMethods[];
     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, TFormatters, TMasks, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
+import { TApiConfig, TApiEvent, TApiResponse, TErrorMessages, TFormatters, TMasks, TResetPathMethods, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
 import { IComponentSchema, IComponentSchemaAsFormField } from '../interfaces/schema';
 import { IState } from '../interfaces/state';
 import { TEvents, TFieldEvent, TFormValidationPayload, TValueChangeEvent } from '../types/event';
@@ -20,12 +20,12 @@ declare class FormField {
     validations?: TValidations;
     visibilityConditions?: TVisibility[];
     resetValues?: TResetValueMethods[];
+    resetPropertyValues?: TResetPathMethods[];
     errorMessages?: TErrorMessages;
     apiSchema?: TApiEvent;
     formatters?: TFormatters;
     masks?: TMasks;
     valuePropName?: string;
-    initialValue?: unknown;
     config: Required<TSchemaFormConfig>;
     mapper: TMapper<unknown>;
     errorsString: string;
@@ -65,6 +65,10 @@ declare class FormField {
         event: TEvents;
         key: string;
     }) => void;
+    resetProperty: (payload: {
+        event: TEvents;
+        key: string;
+    }) => void;
     getFormValues: () => TFormValues<unknown>;
     valueChangeEvent: TValueChangeEvent;
     /**
@@ -77,7 +81,7 @@ declare class FormField {
      * @param {string[]} options.children - An array of children fields names.
      * @param {Function} options.validateVisibility - A function to validate the visibility of the field.
      * @param {Function} options.resetValue - A function to reset the field value.
-     * @param {unknown} [options.initialValue] - The initial value of the form field.
+     * @param {Function} options.resetProperty - A function to reset a field property.
      * @param {Subject<{ key: string }>} options.templateSubject$ - A subject for template updates.
      * @param {Subject<TFieldEvent>} options.fieldEventSubject$, - Subject for basic event mapped field emissions, except onData to form instance
      * @param {Subject<{ key: string; event: TEvents }>} options.dataSubject$, - Subject to emit onData events to form instance
@@ -85,7 +89,7 @@ declare class FormField {
      * @param {TMapper<unknown>} options.mapper, - component generic mapper containing render parameters for adapters
      * @param {() => TFormValues<unknown>} options.getFormValues, - form instance function that builds onData parameter payload from fields
      */
-    constructor({ schemaComponent, config, path, children, validateVisibility, resetValue, initialValue, templateSubject$, fieldEventSubject$, dataSubject$, formValidNotification$, mapper, getFormValues, }: {
+    constructor({ schemaComponent, config, path, children, validateVisibility, resetValue, resetProperty, templateSubject$, fieldEventSubject$, dataSubject$, formValidNotification$, mapper, getFormValues, }: {
         schemaComponent: IComponentSchema;
         config?: TSchemaFormConfig;
         path?: string;
@@ -98,7 +102,10 @@ declare class FormField {
             event: TEvents;
             key: string;
         }) => void;
-        initialValue?: unknown;
+        resetProperty: (payload: {
+            event: TEvents;
+            key: string;
+        }) => void;
         templateSubject$: Subject<TTemplateEvent>;
         fieldEventSubject$: Subject<TFieldEvent>;
         dataSubject$: Subject<{

package/src/managers/form.d.ts

@@ -13,7 +13,6 @@ import { TEMPLATE_AVALIABLE_SCOPES } from '../constants/constants';
 declare class FormCore {
     schema?: IFormSchema;
     fields: Map<string, IFormField>;
-    initialValues?: Record<string, unknown>;
     private _iVars;
     templateSubject$: Subject<TTemplateEvent>;
     templateSubscription$: Subscription;
@@ -37,6 +36,12 @@ declare class FormCore {
     queuedFieldResetValuesEvents: Map<string, {
         value: unknown;
     }>;
+    queuedFieldResetPropertyEvents: Map<string, {
+        property: string;
+        path: string;
+        value: unknown;
+    }>;
+    queuedInitialValues: Map<string, unknown>;
     /**
      * Creates an instance of FormCore.
      *
@@ -49,6 +54,7 @@ declare class FormCore {
      * @param {((payload: {field: string;data: TFormValues;}) => void) | undefined} [entry.onData] - A callback function to handle data emission.
      */
     constructor(entry: TFormEntry & Omit<IFormSchema, 'components'>);
+    setInitialValues(payload: Record<string, unknown> | undefined): void;
     /**
      * Retrieves the internal variables (iVars) of the form.
      *
@@ -155,9 +161,10 @@ declare class FormCore {
      * @internal
      * Update field visibility accordingly.
      *
-     * @param {string} field - Field name to be updated.
-     * @param {boolean} hasError - Condition to be used as visibility.
-     * @param {boolean|undefined} showOnlyIfTrue - Flag to be considered when update field visibility. If it's true, then considered error, if it's false, always considered the opposite.
+     * @param {object} options - options to set field visibility
+     * @param {string} options.field - Field name to be updated.
+     * @param {boolean} options.hasError - Condition to be used as visibility.
+     * @param {boolean|undefined} options.showOnlyIfTrue - Flag to be considered when update field visibility. If it's true, then considered error, if it's false, always considered the opposite.
      */
     private setFieldVisibility;
     /**
@@ -175,8 +182,9 @@ declare class FormCore {
      * @internal
      * Update field value and emit change and cleared event.
      *
-     * @param {string} key - Field name to be updated.
-     * @param {unknown} value - Value to be inserted into field.
+     * @param {options} options to reset the field value
+     * @param {string} options.key - Field name to be updated.
+     * @param {unknown} options.value - Value to be inserted into field.
      */
     private setResetFieldValue;
     /**
@@ -190,6 +198,28 @@ declare class FormCore {
         event: TEvents;
         key: string;
     }): void;
+    /**
+     * @internal
+     * Update field property and emit template change.
+     *
+     * @param {object} options - Options for resetting field property
+     * @param {string} options.key - Field name to be updated.
+     * @param {string} options.property - field property to change.
+     * @param {string} options.path - field property path to change.
+     * @param {unknown} options.value - Value to be inserted into field.
+     */
+    private setResetPathValue;
+    /**
+     * Resets field properties based on reset conditions defined in the schema.
+     *
+     * @param {object} options - Options for resetting field property.
+     * @param {TEvents} options.event - The event triggering the reset.
+     * @param {string} options.key - The key of the field.
+     */
+    resetProperty({ event, key }: {
+        event: TEvents;
+        key: string;
+    }): void;
     /**
      * Adds a field onto the form instance regardless there is a schema or not
      *

package/src/types/event.d.ts

@@ -19,7 +19,7 @@ type TEvents = 'ON_FIELD_MOUNT' | 'ON_FIELD_CHANGE' | 'ON_FIELD_BLUR' | 'ON_FIEL
  * const event: TMutationEvents = 'ON_VALUE';
  * ```
  */
-type TMutationEvents = 'ON_VALUE' | 'ON_PROPS' | 'ON_VISIBILITY' | 'ON_API' | 'ON_IVARS' | 'ON_FIELDS';
+type TMutationEvents = 'ON_VALUE' | 'ON_PROPS' | 'ON_VISIBILITY' | 'ON_API' | 'ON_IVARS' | 'ON_FIELDS' | 'ON_RESET';
 declare enum TMutationEnum {
     ON_VALUE = "value",
     ON_PROPS = "props",

package/src/types/schema.d.ts

@@ -4,6 +4,7 @@ import { TCurrencyCode, TCurrencyLocalCode } from '@gaignoux/currency';
 import { OutgoingHttpHeaders } from 'http2';
 import { TEvents } from './event';
 import { TFormValues } from './form';
+import { ALLOWED_RESET_PROPS_MUTATIONS } from '../constants/constants';
 /**
  * @type TLengthValidation
  * Represents the validation rules based on the length of the input.
@@ -665,6 +666,14 @@ type TResetValueMethods = Omit<TVisibility, 'showOnlyIfTrue' | 'validations'> &
     resettledValue: unknown[] | unknown;
     validations?: TSchemaValidation;
 };
+type TResetPathMethods = {
+    property: typeof ALLOWED_RESET_PROPS_MUTATIONS[number];
+    path: string;
+    field: string;
+    resettledValue: unknown;
+    validations: TSchemaValidation;
+    events: Partial<TEvents>[];
+};
 /**
  * @type TApiConfig
  * Represents the configuration for an API request.
@@ -672,6 +681,7 @@ type TResetValueMethods = Omit<TVisibility, 'showOnlyIfTrue' | 'validations'> &
  * @property {'GET' | 'POST'} method - The HTTP method for the request.
  * @property {string} url - The URL for the request.
  * @property {OutgoingHttpHeaders} [headers] - The headers for the request.
+ * @property {Record<string, string>} queryParams - query parameters for request.
  * @property {string} [resultPath] - The path to extract the result from the response.
  * @property {unknown} [fallbackValue] - The fallback value if the request fails.
  * @property {TSchemaValidation} preConditions - validation conditions to execute the API call
@@ -697,6 +707,7 @@ type TApiConfig = {
     url: string;
     body?: Record<string, unknown>;
     headers?: OutgoingHttpHeaders;
+    queryParams?: Record<string, string>;
     resultPath?: string;
     fallbackValue?: unknown;
     preConditions?: TSchemaValidation;
@@ -815,5 +826,6 @@ type TApiResponse = {
 type TSchemaFormConfig = {
     defaultAPIdebounceTimeMS?: number;
     defaultStateRefreshTimeMS?: number;
+    defaultLogVerbose?: boolean;
 };
-export { TApiConfig, TErrorMessages, TValidations, TMasks, TProps, TResetValueMethods, TFormatters, TValidationMethods, TGenericValidationRule, TSchemaValidation, TEvent, TVisibility, TApiEvent, TApiResponsePayload, 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, TResetPathMethods, TFormatters, TValidationMethods, TGenericValidationRule, TSchemaValidation, TEvent, TVisibility, TApiEvent, TApiResponsePayload, TApiResponse, TSchemaFormConfig, TLengthValidation, TCreditCardMatch, TDocumentValidation, TCallbackValidation, TBetweenValidation, TMaskGeneric, TSplitterFormatterValue, TCurrencyMask, TDateOperatorsValidation, TConditionsValidationSet, TConditionsValidation, TMultipleValidation, TAvailableValidations, TDateValidation, TBetweenDatesValidation, TDateFormatsValidation, TDateInterval, };