lisichatbot 1.6.1 → 1.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lisichatbot",
-  "version": "1.6.1",
+  "version": "1.6.3",
   "type": "module",
   "main": "./src/index.js",
   "exports": {

package/src/index.js

@@ -49,9 +49,14 @@ let flowData = null;
 
 function scrollToBottom() {
     if (elements.messages) {
-        setTimeout(() => {
-            elements.messages.scrollTop = elements.messages.scrollHeight;
-        }, 100);
+        // ✅ Use requestAnimationFrame to ensure DOM has updated
+        requestAnimationFrame(() => {
+            requestAnimationFrame(() => {
+                // Double RAF ensures layout is complete
+                elements.messages.scrollTop = elements.messages.scrollHeight;
+                console.log(`  📜 Scrolled to bottom: ${elements.messages.scrollHeight}px`);
+            });
+        });
     }
 }
 
@@ -2006,6 +2011,10 @@ async function handleNext() {
                 console.log('💬 showMessage called:', message);
                 addMessage(message, 'bot', false, null);
                 scrollToBottom();
+                // ✅ Delayed scroll to ensure message is fully rendered
+                setTimeout(() => {
+                    scrollToBottom();
+                }, 100);
             };
             
             // ✅ Pass showMessage as third parameter
@@ -2020,6 +2029,10 @@ async function handleNext() {
                 console.log('💬 onNext displaying message from return:', result.showMessage);
                 addMessage(result.showMessage, 'bot', false, null);
                 scrollToBottom();
+                // ✅ Delayed scroll to ensure message is fully rendered
+                setTimeout(() => {
+                    scrollToBottom();
+                }, 100);
             }
             
             // ✅ NEW: Check if onNext wants to update steps by field name
@@ -2343,7 +2356,8 @@ async function handleNext() {
         }
     }
 
-    chatState.step++;
+    // ✅ NEW: Find next accessible step (skip accessibleViaJumpOnly steps)
+    chatState.step = findNextAccessibleStep(chatState.step);
     
     const allRangeWrappers = document.querySelectorAll('[data-chat-element="range-wrapper"]');
     allRangeWrappers.forEach(wrapper => {
@@ -2359,6 +2373,30 @@ async function handleNext() {
     }
 
     await showNextStep();
+    
+    // ✅ NEW: Extra scroll after step is shown to ensure visibility
+    // This catches cases where showMessage was called in onNext before progressing
+    setTimeout(() => {
+        scrollToBottom();
+    }, 350);
+}
+
+// ✅ NEW: Helper function to find next step that is accessible in normal flow
+function findNextAccessibleStep(currentStep) {
+    let nextStep = currentStep + 1;
+    
+    while (nextStep < flowData.flow.length) {
+        const stepConfig = flowData.flow[nextStep];
+        
+        if (stepConfig.accessibleViaJumpOnly === true) {
+            console.log(`  ⏭️ Skipping step ${nextStep} (accessibleViaJumpOnly)`);
+            nextStep++;
+        } else {
+            return nextStep;
+        }
+    }
+    
+    return nextStep;  // Return even if >= flow.length (will be handled by caller)
 }
 
 async function showNextStep() {
@@ -2407,6 +2445,10 @@ async function showNextStep() {
                 console.log('💬 showMessage called:', message);
                 addMessage(message, 'bot', false, null);
                 scrollToBottom();
+                // ✅ Delayed scroll to ensure message is fully rendered
+                setTimeout(() => {
+                    scrollToBottom();
+                }, 100);
             };
             
             // ✅ Pass showMessage as second parameter
@@ -2417,6 +2459,10 @@ async function showNextStep() {
                 console.log('💬 onStart displaying message from return:', result.showMessage);
                 addMessage(result.showMessage, 'bot', false, null);
                 scrollToBottom();
+                // ✅ Delayed scroll to ensure message is fully rendered
+                setTimeout(() => {
+                    scrollToBottom();
+                }, 100);
             }
             
             // ✅ NEW: Check if onStart wants to update steps by field name
@@ -2637,7 +2683,8 @@ async function showNextStep() {
             // ✅ NEW: Check if onStart wants to block this step and skip to next
             if (result && typeof result === 'object' && result.blockStep === true) {
                 console.log('⏭️ Step blocked by onStart - skipping to next step');
-                chatState.step++;
+                // ✅ NEW: Find next accessible step
+                chatState.step = findNextAccessibleStep(chatState.step);
                 
                 if (chatState.step >= flowData.flow.length) {
                     handleCompletion();
@@ -2785,7 +2832,8 @@ async function showNextStep() {
         console.log(`  ⏱️ Auto-advance delay: ${delay}ms ${nextStep.autoAdvanceDelay !== undefined ? '(step-level)' : '(global)'}`);
         
         setTimeout(() => {
-            chatState.step++;
+            // ✅ NEW: Find next accessible step
+            chatState.step = findNextAccessibleStep(chatState.step);
             updateEditIcons();
             
             if (chatState.step < flowData.flow.length) {
@@ -2843,6 +2891,16 @@ async function showNextStep() {
     setTimeout(() => {
         updateEditIcons();
     }, 10);
+    
+    // ✅ NEW: Delayed scroll to ensure inputs are fully rendered and visible
+    setTimeout(() => {
+        scrollToBottom();
+    }, 150);
+    
+    // ✅ NEW: Extra delayed scroll to catch cases where showMessage was called before this step
+    setTimeout(() => {
+        scrollToBottom();
+    }, 300);
 }
 
 function handleCompletion() {