From 9193511d5fde1a15ffee1303d06b690b975f396c Mon Sep 17 00:00:00 2001
From: Pete Matsyburka <pete.matsy@gmail.com>
Date: Mon, 22 Jul 2024 17:42:29 +0300
Subject: [PATCH] adjust auto scroll

---
 app/javascript/submission_form/areas.vue | 14 ++++++++++++--
 app/javascript/submission_form/form.vue  |  6 ++++++
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/app/javascript/submission_form/areas.vue b/app/javascript/submission_form/areas.vue
index 2c4ae3ea..9a945361 100644
--- a/app/javascript/submission_form/areas.vue
+++ b/app/javascript/submission_form/areas.vue
@@ -75,6 +75,11 @@ export default {
       required: false,
       default: true
     },
+    scrollEl: {
+      type: Object,
+      required: false,
+      default: null
+    },
     currentStep: {
       type: Array,
       required: false,
@@ -109,7 +114,12 @@ export default {
         if (container.style.overflow === 'hidden') {
           this.scrollInContainer(areaRef.$el)
         } else {
-          areaRef.$refs.scrollToElem.scrollIntoView({ behavior: 'smooth', block: 'start' })
+          const targetRect = areaRef.$refs.scrollToElem.getBoundingClientRect()
+          const root = this.$root.$el?.parentNode?.classList?.contains('ds') ? this.$root.$el : document.body
+          const rootRect = root.getBoundingClientRect()
+          const scrollEl = this.scrollEl || window
+
+          scrollEl.scrollTo({ top: targetRect.top - rootRect.top, behavior: 'smooth' })
         }
 
         return true
@@ -128,7 +138,7 @@ export default {
 
       const targetTopRelativeToBox = targetRect.top - boxRect.top
 
-      scrollbox.scrollTop = targetTopRelativeToBox - container.offsetHeight + formContainer.offsetHeight + target.offsetHeight + padding
+      scrollbox.scrollTo({ top: targetTopRelativeToBox - container.offsetHeight + formContainer.offsetHeight + target.offsetHeight + padding, behavior: 'smooth' })
     },
     setAreaRef (el) {
       if (el) {
diff --git a/app/javascript/submission_form/form.vue b/app/javascript/submission_form/form.vue
index 4fc6a947..bc11a963 100644
--- a/app/javascript/submission_form/form.vue
+++ b/app/javascript/submission_form/form.vue
@@ -4,6 +4,7 @@
     :steps="stepFields"
     :values="values"
     :with-field-placeholder="withFieldPlaceholder"
+    :scroll-el="scrollEl"
     :attachments-index="attachmentsIndex"
     :with-label="!isAnonymousChecboxes && showFieldNames"
     :current-step="currentStepFields"
@@ -554,6 +555,11 @@ export default {
       required: false,
       default: false
     },
+    scrollEl: {
+      type: Object,
+      required: false,
+      default: null
+    },
     onComplete: {
       type: Function,
       required: false,