From 2c5722a6c6d54f9f9feb365512aa4d1cad16bad3 Mon Sep 17 00:00:00 2001
From: Bretislav Wajtr <bretislav@vaadin.com>
Date: Sun, 7 Jan 2024 16:26:35 +0100
Subject: [PATCH] feat: scroll onboarding step target into view when step is
 executed

---
 .../popup/demo/views/OnboardingView.java      | 19 +++++++++++++++++++
 .../onboarding/Onboarding.java                |  3 +++
 2 files changed, 22 insertions(+)

diff --git a/popup-demo/src/main/java/com/vaadin/componentfactory/popup/demo/views/OnboardingView.java b/popup-demo/src/main/java/com/vaadin/componentfactory/popup/demo/views/OnboardingView.java
index 92cfe6f..a175f10 100755
--- a/popup-demo/src/main/java/com/vaadin/componentfactory/popup/demo/views/OnboardingView.java
+++ b/popup-demo/src/main/java/com/vaadin/componentfactory/popup/demo/views/OnboardingView.java
@@ -6,6 +6,7 @@
 import com.vaadin.componentfactory.popup.demo.MainLayout;
 import com.vaadin.flow.component.button.Button;
 import com.vaadin.flow.component.button.ButtonVariant;
+import com.vaadin.flow.component.html.Div;
 import com.vaadin.flow.component.html.H3;
 import com.vaadin.flow.component.html.Image;
 import com.vaadin.flow.component.html.Paragraph;
@@ -17,6 +18,7 @@
 public class OnboardingView extends VerticalLayout {
 
     private Paragraph topParagraph;
+    private Paragraph outOfViewportParagraph;
     private Button actionButton;
     private Button startOnboardingButton;
     private H3 header;
@@ -45,6 +47,13 @@ private void createUI() {
         startOnboardingButton = new Button("Start onboarding");
         startOnboardingButton.addThemeVariants(ButtonVariant.LUMO_PRIMARY);
         add(startOnboardingButton);
+
+        final Div spacer = new Div();
+        spacer.getStyle().set("height", "900px");
+        add(spacer);
+
+        outOfViewportParagraph = new Paragraph("You have to scroll to see this text.");
+        add(outOfViewportParagraph);
     }
 
     private Onboarding createOnboarding() {
@@ -52,12 +61,22 @@ private Onboarding createOnboarding() {
 
         onboarding.addStep(createStepHeader());
         onboarding.addStep(createStepTopParagraph());
+        onboarding.addStep(createStepOutOfViewParagraph());
         onboarding.addStep(createStepActionButton());
         onboarding.addStep(createStepNoTarget());
 
         return onboarding;
     }
 
+    private OnboardingStep createStepOutOfViewParagraph() {
+        final OnboardingStep step = new OnboardingStep(outOfViewportParagraph);
+        step.setHeader("Scroll to popup target");
+        step.setContent("When a target of the onboarding step is not visible, the screen " +
+                "will be scrolled to make it visible before the popup opens.");
+        step.setPosition(PopupPosition.BOTTOM);
+        return step;
+    }
+
     private OnboardingStep createStepNoTarget() {
         final OnboardingStep step = new OnboardingStep(null);
         step.setHeader("No target");
diff --git a/popup/src/main/java/com/vaadin/componentfactory/onboarding/Onboarding.java b/popup/src/main/java/com/vaadin/componentfactory/onboarding/Onboarding.java
index ca77026..87ec8ee 100644
--- a/popup/src/main/java/com/vaadin/componentfactory/onboarding/Onboarding.java
+++ b/popup/src/main/java/com/vaadin/componentfactory/onboarding/Onboarding.java
@@ -111,6 +111,9 @@ protected Popup createPopup(OnboardingStep onboardingStep) {
         popup.setPosition(onboardingStep.getPosition());
         popup.setAlignment(onboardingStep.getAlignment());
         popup.setIgnoreTargetClick(true);
+        popup.setScrollTargetIntoView(true);
+        popup.setCloseOnScroll(false);
+        popup.setRestoreFocusOnClose(false);
         if (onboardingStep.getTargetElement() != null) {
             popup.setTarget(onboardingStep.getTargetElement().getElement());
         }