intelicoreact 1.4.76 → 1.4.78

package/dist/Functions/useFormTools/index.js

@@ -1,22 +1,30 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = useFormTools;
+
 var _react = require("react");
+
 var _ArrayWithObjects = _interopRequireDefault(require("./form-drivers/ArrayWithObjects"));
+
 var _ObjectWithIterableObjects = _interopRequireDefault(require("./form-drivers/ObjectWithIterableObjects"));
+
 var _ObjectWithNamedKeyObjects = _interopRequireDefault(require("./form-drivers/ObjectWithNamedKeyObjects"));
+
 var _General = _interopRequireDefault(require("./functions/General"));
+
 var _RenderFields = _interopRequireDefault(require("./functions/RenderFields"));
-// eslint-disable-next-line no-unused-vars
 
+// eslint-disable-next-line no-unused-vars
 const DefaultFocusControllerProps = {
   setAutoFocus: true,
   onlyEmptyFieldAutoFocus: false
 };
+
 function useFormTools() {
   let {
     form,
@@ -28,8 +36,7 @@ function useFormTools() {
     FocusControllerProps = DefaultFocusControllerProps,
     goToNextFieldOnEnterPressed = true
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  FocusControllerProps = {
-    ...DefaultFocusControllerProps,
+  FocusControllerProps = { ...DefaultFocusControllerProps,
     ...FocusControllerProps
   };
   const FormDataDrivers = {
@@ -44,16 +51,21 @@ function useFormTools() {
       handlers: _ObjectWithNamedKeyObjects.default
     }
   };
+
   const getFormDataDriver = name => {
     var _FormDataDrivers$name, _Object$values$find;
+
     return FormDataDriver || ((_FormDataDrivers$name = FormDataDrivers[name]) === null || _FormDataDrivers$name === void 0 ? void 0 : _FormDataDrivers$name.handlers) || ((_Object$values$find = Object.values(FormDataDrivers).find(df => df.default === true)) === null || _Object$values$find === void 0 ? void 0 : _Object$values$find.handlers) || (() => ({}));
   };
+
   const getFormDataDriverInstance = function (name) {
     for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
       args[_key - 1] = arguments[_key];
     }
+
     return getFormDataDriver(name)(...args);
   };
+
   const {
     getFieldClassName,
     updateFormField
@@ -72,11 +84,11 @@ function useFormTools() {
     form,
     setForm,
     FormFields
-  });
-
-  ///////////////////////////////////////////////////////////////
+  }); ///////////////////////////////////////////////////////////////
   //--- OnChange Observer ---//--- START ---//
+
   const [onChangeObservers, setOnChangeObservers] = (0, _react.useState)({});
+
   const addOnChangeObserver = (key, cb) => {
     let observerId = null;
     setOnChangeObservers(state => {
@@ -88,6 +100,7 @@ function useFormTools() {
     });
     return observerId;
   };
+
   const removeOnChangeObserver = (key, id) => {
     setOnChangeObservers(state => {
       //Set Default Value
@@ -96,6 +109,7 @@ function useFormTools() {
       return state;
     });
   };
+
   const onChangeObserver = (key, value) => {
     if (!onChangeObservers[key] || typeof onChangeObservers[key] !== "object") return;
     const Observers = onChangeObservers[key];
@@ -107,61 +121,67 @@ function useFormTools() {
       return null;
     });
   };
+
   const onFieldChange = (key, value) => {
     var _getFormField;
+
     if (value === ((_getFormField = getFormField(key)) === null || _getFormField === void 0 ? void 0 : _getFormField.value)) return false;
     onChangeObserver(key, value);
-    setFormField(field => ({
-      ...field,
+    setFormField(field => ({ ...field,
       error: "",
       value
     }), key);
-  };
-  //--- OnChange Observer ---//--- END ---//
-
+  }; //--- OnChange Observer ---//--- END ---//
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //--- Form Submit Blocker ---//--- START ---//
+
+
   const [formSubmitBlockers, setFormSubmitBlockers] = (0, _react.useState)([]);
+
   const toggleFormSubmitBlock = (key, value) => {
     setFormSubmitBlockers(state => state.includes(key) || !value ? [...state.filter(k => k !== key)] : [...state, key]);
   };
-  const clearFormSubmitBlockers = () => setFormSubmitBlockers([]);
-  //--- Form Submit Blocker ---//--- END ---//
 
+  const clearFormSubmitBlockers = () => setFormSubmitBlockers([]); //--- Form Submit Blocker ---//--- END ---//
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //--- Property Observer Blocker ---//--- START ---//
   // const [propertyObservers, setPropertyObservers] = useState({});
   // function addPropertyObserver () {
   // };
   //--- Property Observer Blocker ---//--- END ---//
-
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //--- Render Fields Controller ---//--- START ---//
+
+
   const [isFormFieldsAdded, setIsFormFieldsAdded] = (0, _react.useState)(false);
   const [renderFormFields, setRenderFormFieldsState] = (0, _react.useState)([]);
+
   const setRenderFormFields = data => {
-    setIsFormFieldsAdded(true);
-    // eslint-disable-next-line no-use-before-define
-    removeRenderFields(renderFormFields);
-    // eslint-disable-next-line no-use-before-define
+    setIsFormFieldsAdded(true); // eslint-disable-next-line no-use-before-define
+
+    removeRenderFields(renderFormFields); // eslint-disable-next-line no-use-before-define
+
     resetIsInitFocused();
     setRenderFormFieldsState(data);
   };
+
   const addRenderFields = fields => {
     setRenderFormFieldsState(state => [...state, ...fields]);
   };
+
   const removeRenderFields = fields => {
     setRenderFormFieldsState(state => state.filter(field => !fields.includes(field)));
   };
+
   const [isFormRendered, setIsFormRendered] = (0, _react.useState)(false);
+
   const submitIsFormRendered = () => setIsFormRendered(true);
+
   const resetIsFormRendered = () => setIsFormRendered(false);
+
   const onEnterDown = async e => {
     if (!goToNextFieldOnEnterPressed) return false;
     const focusable = document.querySelectorAll('a, button, input, [tabindex]:not([tabindex="-1"])');
@@ -176,10 +196,12 @@ function useFormTools() {
     const nextItem = focusable[nextIndex];
     nextItem.focus();
   };
+
   const onKeyDown = function () {
     for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
       args[_key2] = arguments[_key2];
     }
+
     const event = args.reduce((e, item) => {
       if ((item === null || item === void 0 ? void 0 : item.nativeEvent) instanceof KeyboardEvent) return item;
       return e;
@@ -188,61 +210,70 @@ function useFormTools() {
     const {
       keyCode
     } = event;
+
     switch (keyCode) {
       //OnEnterDown
       case 13:
         onEnterDown(event);
         break;
+
       default:
         break;
     }
-  };
+  }; //On Type Change
+
 
-  //On Type Change
   (0, _react.useEffect)(() => {
     resetIsFormRendered();
-  }, [FormType]);
+  }, [FormType]); //On Render Fields Change
 
-  //On Render Fields Change
   (0, _react.useEffect)(() => {
-    if (isFormFieldsAdded) resetIsFormRendered(false);
+    if (isFormFieldsAdded) resetIsFormRendered(false); //Add Form Fields
 
-    //Add Form Fields
     if (renderFormFields.length !== 0) {
       setFormFields(fields => {
         return renderFormFields.reduce((result, key) => {
           var _field$className;
+
           const fieldData = getFieldData(key);
           const field = getFormField(key) ? getFormField(key) : fieldData;
-          if (!(field !== null && field !== void 0 && field.className) || (field === null || field === void 0 || (_field$className = field.className) === null || _field$className === void 0 ? void 0 : _field$className.indexOf(getFieldClassName(key, FormType))) === -1) {
+
+          if (!(field !== null && field !== void 0 && field.className) || (field === null || field === void 0 ? void 0 : (_field$className = field.className) === null || _field$className === void 0 ? void 0 : _field$className.indexOf(getFieldClassName(key, FormType))) === -1) {
             field.className = "".concat(field === null || field === void 0 ? void 0 : field.className, " ").concat(getFieldClassName(key, FormType));
           }
+
           if (typeof (fieldData === null || fieldData === void 0 ? void 0 : fieldData.label) === "object") {
             field.label = fieldData.label[FormType] || fieldData.label.default;
           }
+
           field.ref = /*#__PURE__*/(0, _react.createRef)();
           field.wrapperRef = /*#__PURE__*/(0, _react.createRef)();
           field.isValueChangedByUser = false;
+
           if (goToNextFieldOnEnterPressed) {
             const onKeyDownProp = field.onKeyDown || (() => {});
+
             field.onKeyDown = function () {
               onKeyDown(...arguments);
               onKeyDownProp(...arguments);
             };
-          }
-
-          //Is Field Value Changed By USER
+          } //Is Field Value Changed By USER
           // eslint-disable-next-line no-use-before-define
+
+
           addOnFieldRenderedObserver(key, () => {
-            var _getFormField2;
-            const element = (_getFormField2 = getFormField(key)) === null || _getFormField2 === void 0 || (_getFormField2 = _getFormField2.ref) === null || _getFormField2 === void 0 || (_getFormField2 = _getFormField2.current) === null || _getFormField2 === void 0 ? void 0 : _getFormField2.querySelector((field === null || field === void 0 ? void 0 : field.focusSelector) || "input");
+            var _getFormField2, _getFormField2$ref, _getFormField2$ref$cu;
+
+            const element = (_getFormField2 = getFormField(key)) === null || _getFormField2 === void 0 ? void 0 : (_getFormField2$ref = _getFormField2.ref) === null || _getFormField2$ref === void 0 ? void 0 : (_getFormField2$ref$cu = _getFormField2$ref.current) === null || _getFormField2$ref$cu === void 0 ? void 0 : _getFormField2$ref$cu.querySelector((field === null || field === void 0 ? void 0 : field.focusSelector) || "input");
+
             const handler = () => setFormField({
               isValueChangedByUser: true
             }, key);
-            element === null || element === void 0 || element.addEventListener("paste", handler, {
+
+            element === null || element === void 0 ? void 0 : element.addEventListener("paste", handler, {
               once: true
             });
-            element === null || element === void 0 || element.addEventListener("keypress", handler, {
+            element === null || element === void 0 ? void 0 : element.addEventListener("keypress", handler, {
               once: true
             });
           }, true);
@@ -252,6 +283,7 @@ function useFormTools() {
     }
   }, [renderFormFields]);
   const [onFormRenderObservers, setOnFormRenderObservers] = (0, _react.useState)([]);
+
   const addOnFormRenderObserver = function (cb) {
     let {
       once = false
@@ -261,21 +293,23 @@ function useFormTools() {
       once,
       isWorkedOut: false
     }]);
-  };
-  // eslint-disable-next-line no-unused-vars
+  }; // eslint-disable-next-line no-unused-vars
+
+
   const updateOnFormRenderObserver = (key, data) => {
     setOnFormRenderObservers(state => {
       const copy = [...state];
-      copy[key] = {
-        ...state[key],
+      copy[key] = { ...state[key],
         ...data
       };
       return copy;
     });
   };
+
   const removeOnFormRenderObserver = key => {
     setOnFormRenderObservers(state => state.slice().filter((v, i) => i !== key));
   };
+
   const onFormRenderWorker = () => {
     // eslint-disable-next-line default-param-last
     onFormRenderObservers.map(function () {
@@ -292,9 +326,9 @@ function useFormTools() {
       });
       return null;
     });
-  };
+  }; //On Form Rendered
+
 
-  //On Form Rendered
   (0, _react.useEffect)(() => {
     if (!isFormRendered && onFormRenderObservers.length) {
       const formFieldsKeys = getFormFieldsKeys(form);
@@ -302,53 +336,56 @@ function useFormTools() {
         if (!formFieldsKeys.includes(key)) result = false;
         return result;
       }, true);
+
       if (isAllFieldsRendered) {
         submitIsFormRendered(true);
         onFormRenderWorker();
       }
     }
-  }, [form, renderFormFields, onFormRenderObservers]);
-  //--- Render Fields Controller ---//--- END ---//
-
+  }, [form, renderFormFields, onFormRenderObservers]); //--- Render Fields Controller ---//--- END ---//
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //--- HIGHTLIGHT LABELS IF FIELD WITH ERROR ---//--- START ---//
+
   const hightliteErrorLabels = () => {
     const fields = getFormFieldsAsArray();
     const filtered = fields === null || fields === void 0 ? void 0 : fields.reduce((result, field) => {
       if (field !== null && field !== void 0 && field.errorLabelHightlite) {
         // eslint-disable-next-line no-use-before-define
-        result.push({
-          ...field,
+        result.push({ ...field,
           className: getFieldClassName(field === null || field === void 0 ? void 0 : field.key, FormType)
         });
       }
+
       return result;
     }, []);
-    filtered === null || filtered === void 0 || filtered.map(field => {
+    filtered === null || filtered === void 0 ? void 0 : filtered.map(field => {
       const formField = document.querySelector(".".concat(field === null || field === void 0 ? void 0 : field.className));
       if (!formField) return null;
       formField.classList.remove("errorLabelHightlite");
+
       if (field !== null && field !== void 0 && field.error) {
         formField.classList.add("errorLabelHightlite");
       }
+
       return null;
     });
   };
+
   (0, _react.useEffect)(() => {
     hightliteErrorLabels();
-  }, [form]);
-  //--- HIGHTLIGHT LABELS IF FIELD WITH ERROR ---//--- END ---//
-
+  }, [form]); //--- HIGHTLIGHT LABELS IF FIELD WITH ERROR ---//--- END ---//
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //--- Fields Focus Controller ---//--- START ---//
+
   const [isInitFocused, setIsInitFocused] = (0, _react.useState)(false);
   const [autoFocusedField, setAutoFocusedField] = (0, _react.useState)(null);
+
   const setFirstFieldInitFocused = () => setIsInitFocused(true);
+
   const resetIsInitFocused = () => setIsInitFocused(false);
+
   const toggleFieldFocus = function (_ref) {
     let {
       key,
@@ -360,16 +397,20 @@ function useFormTools() {
     if (!key && !field) return null;
     if (!argForm) argForm = form;
     const formField = field || getFormField(key, argForm);
+
     if (!formField || !formField.ref) {
       return false;
     }
+
     if (action === "focus" && FocusControllerProps.onlyEmptyFieldAutoFocus && Boolean(formField === null || formField === void 0 ? void 0 : formField.value)) return null;
     setTimeout(() => {
-      var _formField$ref$curren;
-      (_formField$ref$curren = formField.ref.current) === null || _formField$ref$curren === void 0 || (_formField$ref$curren = _formField$ref$curren.querySelector((formField === null || formField === void 0 ? void 0 : formField.focusSelector) || "input")) === null || _formField$ref$curren === void 0 || _formField$ref$curren[action]();
+      var _formField$ref$curren, _formField$ref$curren2;
+
+      (_formField$ref$curren = formField.ref.current) === null || _formField$ref$curren === void 0 ? void 0 : (_formField$ref$curren2 = _formField$ref$curren.querySelector((formField === null || formField === void 0 ? void 0 : formField.focusSelector) || "input")) === null || _formField$ref$curren2 === void 0 ? void 0 : _formField$ref$curren2[action]();
       cb();
     }, 50);
   };
+
   const setFieldFocus = _ref2 => {
     let {
       key,
@@ -384,6 +425,7 @@ function useFormTools() {
       field
     }, "focus");
   };
+
   const setFieldBlur = _ref3 => {
     let {
       key,
@@ -398,73 +440,93 @@ function useFormTools() {
       field
     }, "blur");
   };
+
   const setFirstFieldFocus = () => {
     var _field;
+
     let field = null;
+
     for (let i = 0; i < renderFormFields.length && !field; ++i) {
       const key = renderFormFields[i];
       const tmpField = getFormField(key);
       if (tmpField && !(tmpField !== null && tmpField !== void 0 && tmpField.disabled)) field = tmpField;
     }
+
     if (!field) return false;
+
     if (FocusControllerProps.onlyEmptyFieldAutoFocus && Boolean((_field = field) === null || _field === void 0 ? void 0 : _field.value)) {
       setFirstFieldInitFocused();
       return false;
     }
+
     setAutoFocusedField(field.key);
+
     const callback = () => {
       setFormField({
         value: field.value
       }, field.key);
       setFirstFieldInitFocused();
     };
+
     setTimeout(() => setFieldFocus({
       key: field.key,
       cb: callback,
       form
     }), 50);
   };
+
   const [onFieldFocusCallbacks, setOnFieldFocusCallbacks] = (0, _react.useState)({});
+
   const addOnFieldFocusCallback = (key, cb) => {
     setOnFieldFocusCallbacks(state => {
-      const stateCopy = {
-        ...state
+      const stateCopy = { ...state
       };
       if (!state[key]) stateCopy[key] = [];
       stateCopy[key].push(cb);
       return stateCopy;
     });
   };
+
   const callOnFieldFocusCallbacks = key => {
     var _onFieldFocusCallback;
+
     if (!Array.isArray(onFieldFocusCallbacks[key])) return null;
-    (_onFieldFocusCallback = onFieldFocusCallbacks[key]) === null || _onFieldFocusCallback === void 0 || _onFieldFocusCallback.map(cb => cb());
+    (_onFieldFocusCallback = onFieldFocusCallbacks[key]) === null || _onFieldFocusCallback === void 0 ? void 0 : _onFieldFocusCallback.map(cb => cb());
   };
+
   const [focusOnRenderFields, setFocusOnRenderFields] = (0, _react.useState)([]);
+
   const addFocusFieldOnRender = (key, cb) => {
     setFocusOnRenderFields(state => [...state, key]);
     if (cb) addOnFieldFocusCallback(key, cb);
   };
+
   const removeFocusFieldOnRender = key => {
     setFocusOnRenderFields(state => state.filter(field => field !== key));
   };
+
   (0, _react.useEffect)(() => {
     if (FocusControllerProps.setAutoFocus && !isInitFocused && !autoFocusedField && isFormRendered) setFirstFieldFocus();
+
     if (focusOnRenderFields.length) {
       var _getFormFieldsKeys;
-      (_getFormFieldsKeys = getFormFieldsKeys(form)) === null || _getFormFieldsKeys === void 0 || _getFormFieldsKeys.map(key => {
-        var _getFormField3;
-        if (focusOnRenderFields.includes(key) && ((_getFormField3 = getFormField(key)) === null || _getFormField3 === void 0 || (_getFormField3 = _getFormField3.value) === null || _getFormField3 === void 0 ? void 0 : _getFormField3.length) === 0) {
+
+      (_getFormFieldsKeys = getFormFieldsKeys(form)) === null || _getFormFieldsKeys === void 0 ? void 0 : _getFormFieldsKeys.map(key => {
+        var _getFormField3, _getFormField3$value;
+
+        if (focusOnRenderFields.includes(key) && ((_getFormField3 = getFormField(key)) === null || _getFormField3 === void 0 ? void 0 : (_getFormField3$value = _getFormField3.value) === null || _getFormField3$value === void 0 ? void 0 : _getFormField3$value.length) === 0) {
           const cb = () => {
             removeFocusFieldOnRender(key);
             callOnFieldFocusCallbacks(key);
           };
+
           setFieldFocus({
             key,
             form,
             cb
           });
         }
+
         return null;
       });
     }
@@ -474,25 +536,22 @@ function useFormTools() {
   }, [isInitFocused]);
   (0, _react.useEffect)(() => {
     resetIsInitFocused();
-  }, [FormType]);
-
-  //Remove Focus From Autocomplete field !!! TODO
+  }, [FormType]); //Remove Focus From Autocomplete field !!! TODO
   // useEffect(() => {
   //   if (!autoFocusedField) return null;
   //   const field = getFormField(autoFocusedField);
-
   //   if (field?.value !== '' && !field?.isValueChangedByUser) {
   //     setFieldBlur({key: autoFocusedField, form});
   //   }
   // }, [autoFocusedField, form]);
   //--- Fields Focus Controller ---//--- END ---//
-
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //--- OnFieldRendered Observer ---//--- START ---//
+
   const [onFieldRenderedObservers, setOnFieldRenderedObservers] = (0, _react.useState)({});
   const [isFieldObserversReset, setIsFieldObserversReset] = (0, _react.useState)(false);
+
   const resetOnFieldRenderObserversWorkedOut = () => {
     if (!isFieldObserversReset && renderFormFields.length) {
       renderFormFields.map(key => {
@@ -504,6 +563,7 @@ function useFormTools() {
       setIsFieldObserversReset(true);
     }
   };
+
   const addOnFieldRenderedObserver = function (key, cb) {
     let isOnceCallable = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
     let observerId = null;
@@ -519,17 +579,18 @@ function useFormTools() {
     });
     return observerId;
   };
+
   const updateOnFieldRenderedObserver = (key, id, data) => {
     setOnFieldRenderedObservers(state => {
       //Set Default Value
       if (!state[key]) return state;
-      state[key][id] = {
-        ...state[key][id],
+      state[key][id] = { ...state[key][id],
         ...data
       };
       return state;
     });
   };
+
   const removeOnFieldRenderedObserver = (key, id) => {
     setOnFieldRenderedObservers(state => {
       //Set Default Value
@@ -538,6 +599,7 @@ function useFormTools() {
       return state;
     });
   };
+
   const onFieldRenderedObserver = (key, data) => {
     if (!onFieldRenderedObservers[key] || typeof onFieldRenderedObservers[key] !== "object") return;
     const Observers = onFieldRenderedObservers[key];
@@ -558,11 +620,14 @@ function useFormTools() {
       return null;
     });
   };
+
   const onRenderObserverWorker = () => {
     var _getFormFieldsKeys2;
+
     return (_getFormFieldsKeys2 = getFormFieldsKeys(form)) === null || _getFormFieldsKeys2 === void 0 ? void 0 : _getFormFieldsKeys2.map(key => {
       //OnFieldRendered
       const fieldData = getFormField(key);
+
       if (!(fieldData !== null && fieldData !== void 0 && fieldData.isOnRenderObserversWorkedOut)) {
         onFieldRenderedObserver(key, fieldData);
         return {
@@ -570,28 +635,26 @@ function useFormTools() {
           isWorkedOut: true
         };
       }
+
       return {
         key,
         isWorkedOut: false
       };
     });
   };
+
   (0, _react.useEffect)(() => {
     resetOnFieldRenderObserversWorkedOut();
     onRenderObserverWorker();
   }, [form]);
   (0, _react.useEffect)(() => {
     setIsFieldObserversReset(false);
-  }, [FormType]);
-  //--- OnFieldRendered Observer ---//--- END ---//
-
+  }, [FormType]); //--- OnFieldRendered Observer ---//--- END ---//
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //Detect What Changed || TRY TO DO
   // const compare = async (prev, current) => {
   //   if (!prev) return current;
-
   //   return new Promise((resolve) => {
   //     Object.keys(current).reduce((result, key, i, arr) => {
   //       //If PROPERTY is NOT EXISTS BEFORE
@@ -609,22 +672,20 @@ function useFormTools() {
   //       else if (prev[key] !== current[key]) {
   //         result[key] = current[key];
   //       }
-
   //       if (i === arr.length-1) {
   //         resolve(result);
   //       }
-
   //       return result;
   //     }, {});
   //   });
   // };
-
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
-
   //--- WindowScrollController ---//--- START ---//
+
   const scrollToField = _ref5 => {
     var _field2, _field3, _wrapperRef$current;
+
     let {
       key = null,
       field = null,
@@ -633,22 +694,20 @@ function useFormTools() {
     if (!key && !field) return false;
     if (!argForm) argForm = form;
     if (!field) field = getFormField(key, argForm);
-    const wrapperRef = ((_field2 = field) === null || _field2 === void 0 ? void 0 : _field2.wrapperRef) || ((_field3 = field) === null || _field3 === void 0 ? void 0 : _field3.ref);
-    // eslint-disable-next-line no-unsafe-optional-chaining
+    const wrapperRef = ((_field2 = field) === null || _field2 === void 0 ? void 0 : _field2.wrapperRef) || ((_field3 = field) === null || _field3 === void 0 ? void 0 : _field3.ref); // eslint-disable-next-line no-unsafe-optional-chaining
+
     const {
       top: topOffset
-    } = wrapperRef === null || wrapperRef === void 0 || (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.getBoundingClientRect();
+    } = wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.getBoundingClientRect();
     const scrollTop = Math.abs(Math.abs(topOffset) - Math.abs(window.scrollY)) - 16;
     window.scrollTo({
       top: scrollTop
     });
-  };
-
-  //--- WindowScrollController ---//--- END ---//
-
+  }; //--- WindowScrollController ---//--- END ---//
   ///////////////////////////////////////////////////////////////
   ///////////////////////////////////////////////////////////////
 
+
   const addErrorsToForm = function (errors) {
     let argForm = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : form;
     if (!argForm) argForm = form;
@@ -664,6 +723,7 @@ function useFormTools() {
       }, fields);
     });
   };
+
   return {
     FormDataDrivers,
     //OnChangeObserver
@@ -678,7 +738,6 @@ function useFormTools() {
     isFormSubmitBlocked: Boolean(formSubmitBlockers.length),
     //Property Observers
     // addPropertyObserver,
-
     //Render Fields
     renderFormFields,
     setRenderFormFields,