@tent-official/react-walkthrough 1.4.2 → 1.5.1

package/dist/index.mjs

@@ -965,43 +965,6 @@ var WalkthroughOverlay = ({
       setPopoverPos(null);
       const nextValidStep = validSteps[currentValidPos + 1];
       const nextOrigIdx = hasTrigger && !nextValidStep ? currentOrigIdx + 1 : (_a2 = nextValidStep == null ? void 0 : nextValidStep._originalIdx) != null ? _a2 : currentOrigIdx + 1;
-      const shouldForceRecompute = !!step.forceRecompute;
-      if (shouldForceRecompute) {
-        const nextStepDef = activeTour.steps[nextOrigIdx];
-        if (nextStepDef) {
-          const nextElId = resolveElId(nextStepDef.el);
-          const SETTLE_DELAY = 150;
-          const doAdvance = () => {
-            setGlobalState((s) => ({
-              ...s,
-              activeTour: { ...s.activeTour, currentStep: nextOrigIdx }
-            }));
-          };
-          const alreadyExists = document.getElementById(nextElId);
-          if (alreadyExists) {
-            setTimeout(() => doAdvance(), SETTLE_DELAY);
-          } else {
-            waitingForElsRef.current = true;
-            const observer = new MutationObserver(() => {
-              const found = document.getElementById(nextElId);
-              if (found) {
-                observer.disconnect();
-                waitingForElsRef.current = false;
-                setTimeout(() => doAdvance(), SETTLE_DELAY);
-              }
-            });
-            observer.observe(document.body, { childList: true, subtree: true });
-            setTimeout(() => {
-              observer.disconnect();
-              if (waitingForElsRef.current) {
-                waitingForElsRef.current = false;
-                doAdvance();
-              }
-            }, 3e3);
-          }
-          return;
-        }
-      }
       setGlobalState((s) => ({
         ...s,
         activeTour: { ...s.activeTour, currentStep: nextOrigIdx }
@@ -1017,6 +980,7 @@ var WalkthroughOverlay = ({
     }
     const hasTrigger = !!step.triggerElOnNext;
     const afterNextDelay = (_b2 = step.delayAfterNext) != null ? _b2 : 0;
+    const nextElId = step.nextEl ? resolveElId(step.nextEl) : null;
     const withDelay = (fn) => {
       if (afterNextDelay > 0) {
         setTimeout(fn, afterNextDelay);
@@ -1024,6 +988,43 @@ var WalkthroughOverlay = ({
         fn();
       }
     };
+    const advanceWithNextEl = () => {
+      const SETTLE_DELAY = 150;
+      const targetEl = document.getElementById(nextElId);
+      if (targetEl) {
+        let targetStepIdx = -1;
+        for (let i = currentOrigIdx + 1; i < activeTour.steps.length; i++) {
+          if (resolveElId(activeTour.steps[i].el) === nextElId) {
+            targetStepIdx = i;
+            break;
+          }
+        }
+        if (targetStepIdx !== -1) {
+          const targetStepDef = activeTour.steps[targetStepIdx];
+          const targetStepWithIdx = { ...targetStepDef, _originalIdx: targetStepIdx };
+          const alreadyInValid = validSteps.some((s) => s._originalIdx === targetStepIdx);
+          const newValidSteps = alreadyInValid ? validSteps : [...validSteps, targetStepWithIdx].sort((a, b) => a._originalIdx - b._originalIdx);
+          setValidSteps(newValidSteps);
+          skipNextRecomputeRef.current = true;
+          setTimeout(() => {
+            setGlobalState((s) => ({
+              ...s,
+              activeTour: { ...s.activeTour, currentStep: targetStepIdx }
+            }));
+          }, SETTLE_DELAY);
+          return;
+        }
+      }
+      const nextValid = validSteps.find((s) => s._originalIdx > currentOrigIdx);
+      if (nextValid) {
+        setGlobalState((s) => ({
+          ...s,
+          activeTour: { ...s.activeTour, currentStep: nextValid._originalIdx }
+        }));
+      } else {
+        completeTour();
+      }
+    };
     if (hasTrigger) {
       setPopoverHidden(true);
       setPopoverPos(null);
@@ -1035,11 +1036,14 @@ var WalkthroughOverlay = ({
         triggerTarget.dispatchEvent(new MouseEvent("mouseup", { bubbles: true, cancelable: true, button: 0 }));
         triggerTarget.click();
       }
-      const currentOrigIdx2 = validSteps[currentValidPos]._originalIdx;
-      const nextOrigIdx = currentOrigIdx2 + 1;
+      if (nextElId) {
+        withDelay(() => advanceWithNextEl());
+        return;
+      }
+      const nextOrigIdx = currentOrigIdx + 1;
       const nextStepDef = activeTour.steps[nextOrigIdx];
       if (nextStepDef) {
-        const nextElId = resolveElId(nextStepDef.el);
+        const nextStepElId = resolveElId(nextStepDef.el);
         const injectAndAdvance = () => {
           const nextStepWithIdx = { ...nextStepDef, _originalIdx: nextOrigIdx };
           const alreadyInValid = validSteps.some((s) => s._originalIdx === nextOrigIdx);
@@ -1050,27 +1054,15 @@ var WalkthroughOverlay = ({
             ...s,
             activeTour: { ...s.activeTour, currentStep: nextOrigIdx }
           }));
-          if (step.forceRecompute) {
-            setTimeout(() => {
-              skipNextRecomputeRef.current = false;
-              setGlobalState((s) => {
-                if (!s.activeTour) return s;
-                return {
-                  ...s,
-                  activeTour: { ...s.activeTour, _recompute: Date.now() }
-                };
-              });
-            }, 500);
-          }
         };
         const SETTLE_DELAY = 150;
-        const alreadyExists = document.getElementById(nextElId);
+        const alreadyExists = document.getElementById(nextStepElId);
         if (alreadyExists) {
           withDelay(() => setTimeout(() => injectAndAdvance(), SETTLE_DELAY));
         } else {
           waitingForElsRef.current = true;
           const observer = new MutationObserver(() => {
-            const found = document.getElementById(nextElId);
+            const found = document.getElementById(nextStepElId);
             if (found) {
               observer.disconnect();
               waitingForElsRef.current = false;
@@ -1093,6 +1085,12 @@ var WalkthroughOverlay = ({
       setTimeout(() => completeTour(), 300);
       return;
     }
+    if (nextElId) {
+      setPopoverHidden(true);
+      setPopoverPos(null);
+      withDelay(() => advanceWithNextEl());
+      return;
+    }
     if (afterNextDelay > 0) {
       setPopoverHidden(true);
       setPopoverPos(null);