@agentforge-io/chat-sdk 2.1.0 → 2.1.1

package/dist/react.js

@@ -250,17 +250,36 @@ function ChatWidget(props) {
     const messagesRef = (0, react_1.useRef)(null);
     const inputRef = (0, react_1.useRef)(null);
     const styleId = (0, react_1.useId)();
-    // Auto-focus the composer on desktop (pointer:fine) once the session
-    // is ready. Skipped on touch devices — focusing a textarea on iOS /
-    // Android opens the on-screen keyboard, which is hostile on a public
-    // profile page where the visitor probably wants to read first.
+    // Track whether the user has already engaged with the widget. We
+    // start at false (just landed on the page) and flip to true the
+    // moment `handleSend` fires. The auto-focus effect below uses this
+    // to decide whether the impending `status = 'ready'` is the first
+    // landing (skip focus on touch — opening the keyboard unprompted
+    // is hostile) or a return from a send-streaming cycle (re-focus
+    // ALWAYS — the user is mid-conversation, losing the cursor
+    // breaks the typing-rhythm).
+    const hasInteractedRef = (0, react_1.useRef)(false);
+    // Auto-focus the composer once the session is ready.
+    //
+    //   Landing (hasInteractedRef.current === false):
+    //     • pointer:fine → focus  (desktop user expects ready-to-type)
+    //     • pointer:coarse → skip (iOS/Android opening the keyboard
+    //                              before the visitor reads anything
+    //                              is jarring)
+    //
+    //   Returning from a send (hasInteractedRef.current === true):
+    //     • always focus, including touch — the user just hit Send,
+    //       they're in conversation mode, their next thought is the
+    //       next message, the keyboard should stay alive.
     (0, react_1.useEffect)(() => {
         if (status !== 'ready')
             return;
         if (typeof window === 'undefined')
             return;
-        if (!window.matchMedia('(pointer: fine)').matches)
+        if (!hasInteractedRef.current &&
+            !window.matchMedia('(pointer: fine)').matches) {
             return;
+        }
         inputRef.current?.focus({ preventScroll: true });
     }, [status]);
     // ── Session lifecycle. Recreate when token / apiBaseUrl changes. ──────
@@ -306,11 +325,26 @@ function ChatWidget(props) {
         };
     }, [token, apiBaseUrl, browserSessionId, resumeConversationId, stream]);
     // Auto-scroll on new tokens.
+    //
+    // We defer the scroll into a requestAnimationFrame so the DOM has
+    // actually grown by the time we read `scrollHeight`. Without that
+    // tick, a stream of small text_deltas can leave the scroll lagging
+    // 1–2 chunks behind because the effect runs synchronously after
+    // the React commit but BEFORE the browser paints the new rows.
+    // Result: the user sees the latest sentence half-cut at the bottom.
+    //
+    // `behavior: 'smooth'` doesn't help much during a fast stream (each
+    // rAF queues a new smooth-scroll that cancels the previous one) but
+    // it does make the FINAL settle look fluid — and that's the part
+    // the user notices when the stream stops.
     (0, react_1.useEffect)(() => {
         const el = messagesRef.current;
         if (!el)
             return;
-        el.scrollTop = el.scrollHeight;
+        const raf = requestAnimationFrame(() => {
+            el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' });
+        });
+        return () => cancelAnimationFrame(raf);
     }, [messages]);
     // Inject the widget stylesheet exactly once per page. We key the <style>
     // tag by a fixed id so multiple widget mounts share it.
@@ -331,6 +365,11 @@ function ChatWidget(props) {
         const text = draft.trim();
         if (!text)
             return;
+        // Mark engagement BEFORE the status flip so the auto-focus
+        // effect (which watches `status`) sees the flag when it
+        // re-runs after `ready` returns. Subsequent renders will
+        // refocus the textarea on every send completion.
+        hasInteractedRef.current = true;
         setDraft('');
         void session.send(text);
     }, [session, draft]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agentforge-io/chat-sdk",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Framework-free chat session SDK for AgentForge public chat tokens. Headless — no DOM. Drop into any frontend (React, Vue, Svelte, vanilla) and listen for events.",
   "license": "MIT",
   "main": "dist/index.js",