@bigbinary/neetoui 5.1.8 → 5.1.10

package/formik.cjs.js

@@ -17733,6 +17733,15 @@ var getErrorFieldName = function getErrorFieldName(formikErrors) {
   var _transformObjectToDot;
   return (_transformObjectToDot = transformObjectToDotNotation(formikErrors)) === null || _transformObjectToDot === void 0 ? void 0 : _transformObjectToDot[0];
 };
+var scrollToError = function scrollToError(formRef, errors) {
+  var fieldErrorName = getErrorFieldName(errors);
+  if (!fieldErrorName) return;
+  var errorFormElement = formRef.current.querySelector("[name=\"".concat(fieldErrorName, "\"]"));
+  errorFormElement === null || errorFormElement === void 0 ? void 0 : errorFormElement.scrollIntoView({
+    behavior: "smooth",
+    block: "center"
+  });
+};
 
 var ScrollToErrorField = function ScrollToErrorField(_ref) {
   var formRef = _ref.formRef;
@@ -17740,26 +17749,15 @@ var ScrollToErrorField = function ScrollToErrorField(_ref) {
     submitCount = _useFormikContext.submitCount,
     isValid = _useFormikContext.isValid,
     errors = _useFormikContext.errors;
-  var isValidatedReference = React.useRef(false);
   React.useEffect(function () {
-    isValidatedReference.current = false;
+    if (!formRef.current || isValid) return;
+    scrollToError(formRef, errors);
   }, [submitCount]);
-  React.useEffect(function () {
-    if (!formRef.current || isValidatedReference.current || isValid) return;
-    isValidatedReference.current = true;
-    var fieldErrorName = getErrorFieldName(errors);
-    if (!fieldErrorName) return;
-    var errorFormElement = formRef.current.querySelector("[name=\"".concat(fieldErrorName, "\"]"));
-    errorFormElement === null || errorFormElement === void 0 ? void 0 : errorFormElement.scrollIntoView({
-      behavior: "smooth",
-      block: "center"
-    });
-  }, [submitCount, errors]);
   return null;
 };
 
 var _excluded$j = ["values", "validateForm", "setErrors", "setTouched"];
-var FormWrapper = /*#__PURE__*/React.forwardRef(function (_ref, formRef) {
+var FormWrapper = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     formProps = _ref.formProps,
     children = _ref.children,
@@ -17773,7 +17771,8 @@ var FormWrapper = /*#__PURE__*/React.forwardRef(function (_ref, formRef) {
     formikBag = _objectWithoutProperties$1(_useFormikContext, _excluded$j);
   var isFormDirty = formikBag.dirty,
     isSubmitting = formikBag.isSubmitting;
-  var formRefForScrollToErrorFiled = React.useRef();
+  var formRefForScrollToErrorField = React.useRef();
+  var formRef = ref || formRefForScrollToErrorField;
   var handleKeyDown = React.useCallback( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(event) {
       var isEventFromEditorOrTextarea, errors;
@@ -17814,6 +17813,7 @@ var FormWrapper = /*#__PURE__*/React.forwardRef(function (_ref, formRef) {
             if (Object.keys(errors).length > 0) {
               setErrors(errors);
               setTouched(errors);
+              scrollToErrorField && scrollToError(formRef, errors);
             } else {
               onSubmit(values, formikBag);
             }
@@ -17838,10 +17838,10 @@ var FormWrapper = /*#__PURE__*/React.forwardRef(function (_ref, formRef) {
     noValidate: true,
     className: className,
     "data-testid": "neeto-ui-form-wrapper",
-    ref: formRef || formRefForScrollToErrorFiled,
+    ref: formRef,
     onKeyDown: handleKeyDown
   }, formProps), scrollToErrorField && /*#__PURE__*/React__default["default"].createElement(ScrollToErrorField, {
-    formRef: formRef || formRefForScrollToErrorFiled
+    formRef: formRef
   }), children);
 });
 FormWrapper.displayName = "FormWrapper";