@webless/agent 0.2.9 → 0.2.11

package/dist/react.cjs

@@ -221,6 +221,54 @@ function clearPersistedAgentSession(visitorSessionId, options) {
 }
 
 // src/runtime/client.ts
+function isTurnBoundary(event) {
+  return event.type === "session.waiting" || event.type === "session.completed" || event.type === "session.failed";
+}
+function applyMessageEvent(event, rendered, handlers) {
+  const step = mapStepLabel(event);
+  if (step) handlers.onStep?.(step.label, step.detail);
+  if (event.type === "session.failed") {
+    throw new Error(event.data.message || event.data.code);
+  }
+  if (event.type === "message.completed") {
+    handlers.onComplete?.();
+  }
+  if (event.type !== "message.appended") return rendered;
+  const { messageDelta, messageSoFar } = event.data;
+  let delta = messageDelta;
+  let next = rendered;
+  if (messageSoFar.startsWith(rendered)) {
+    delta = messageSoFar.slice(rendered.length);
+    next = messageSoFar;
+  } else if (messageDelta) {
+    next += messageDelta;
+  }
+  if (delta) handlers.onDelta(delta);
+  return next;
+}
+function latestTurnEvents(events) {
+  let startIndex = -1;
+  for (let index = events.length - 1; index >= 0; index -= 1) {
+    if (events[index]?.type === "message.received") {
+      startIndex = index;
+      break;
+    }
+  }
+  return startIndex >= 0 ? events.slice(startIndex) : [];
+}
+function renderTurn(events) {
+  let rendered = "";
+  for (const event of events) {
+    if (event.type !== "message.appended") continue;
+    const { messageDelta, messageSoFar } = event.data;
+    if (messageSoFar.startsWith(rendered)) {
+      rendered = messageSoFar;
+    } else if (messageDelta) {
+      rendered += messageDelta;
+    }
+  }
+  return rendered;
+}
 function mapStepLabel(event) {
   if (event.type !== "step.started") return null;
   const stepIndex = event.data.stepIndex;
@@ -256,8 +304,13 @@ var AgentSession = class {
     return this.session?.state.sessionId ?? loadPersistedAgentSession(this.visitorSessionId, this.storeOptions)?.sessionId;
   }
   reset() {
-    void this.activeResponse?.cancel().catch(() => {
-    });
+    if (this.activeResponse) {
+      void this.activeResponse.cancel().catch(() => {
+      });
+    } else {
+      void this.session?.cancel().catch(() => {
+      });
+    }
     this.activeResponse = void 0;
     this.session = void 0;
     clearPersistedAgentSession(this.visitorSessionId, this.storeOptions);
@@ -282,7 +335,8 @@ var AgentSession = class {
     if (this.client && this.clientHost === config.host) {
       return this.client;
     }
-    this.reset();
+    this.activeResponse = void 0;
+    this.session = void 0;
     this.client = new import_client2.Client({
       auth: { bearer: () => this.capability.getAccessToken() },
       host: config.host,
@@ -331,28 +385,20 @@ var AgentSession = class {
       this.persistSessionCursor(session);
     }
     this.activeResponse = response;
+    let streamIndex = session?.state.streamIndex ?? 0;
     let rendered = "";
     try {
       for await (const event of response) {
         if (signal.aborted) break;
-        const step = mapStepLabel(event);
-        if (step) handlers.onStep?.(step.label, step.detail);
-        if (event.type === "message.appended") {
-          const { messageDelta, messageSoFar } = event.data;
-          let delta = messageDelta;
-          if (messageSoFar.startsWith(rendered)) {
-            delta = messageSoFar.slice(rendered.length);
-            rendered = messageSoFar;
-          } else if (messageDelta) {
-            rendered += messageDelta;
-          }
-          if (delta) handlers.onDelta(delta);
-        }
-        if (event.type === "message.completed") {
-          handlers.onComplete?.();
-        }
-        if (event.type === "session.failed") {
-          throw new Error(event.data.message || event.data.code);
+        rendered = applyMessageEvent(event, rendered, handlers);
+        streamIndex += 1;
+        if (session) {
+          savePersistedAgentSession(
+            this.visitorSessionId,
+            session.state.sessionId,
+            streamIndex,
+            this.storeOptions
+          );
         }
       }
     } finally {
@@ -364,15 +410,83 @@ var AgentSession = class {
     if (!rendered.trim() && !signal.aborted) {
       throw new Error("Empty response from runtime");
     }
-    if (signal.aborted) {
-      await response.cancel().catch(() => {
-      });
+    return rendered.trim();
+  }
+  async resumeTurn(message, signal, handlers, initialText = "") {
+    const persisted = loadPersistedAgentSession(this.visitorSessionId, this.storeOptions);
+    if (!persisted) return null;
+    const client = this.ensureClient();
+    const attached = client.sessions.attach(persisted.sessionId, {
+      streamIndex: persisted.streamIndex
+    });
+    const snapshot = await withCapabilityRefresh(
+      this.capability,
+      () => attached.snapshot({ signal })
+    );
+    const turnEvents = latestTurnEvents(snapshot.events);
+    const received = turnEvents[0];
+    if (received?.type !== "message.received" || received.data.message !== message) {
+      return null;
+    }
+    let rendered = renderTurn(turnEvents);
+    if (rendered.startsWith(initialText)) {
+      const missedText = rendered.slice(initialText.length);
+      if (missedText) handlers.onDelta(missedText);
+    } else if (initialText.startsWith(rendered)) {
+      rendered = initialText;
+    } else if (!initialText.startsWith(rendered)) {
+      rendered = initialText + rendered;
+    }
+    let session = client.sessions.attach(snapshot.session.sessionId, {
+      streamIndex: snapshot.session.streamIndex
+    });
+    this.session = session;
+    this.persistSessionCursor(session);
+    let snapshotBoundary;
+    for (let index = turnEvents.length - 1; index >= 0; index -= 1) {
+      const event = turnEvents[index];
+      if (event && isTurnBoundary(event)) {
+        snapshotBoundary = event;
+        break;
+      }
+    }
+    if (snapshotBoundary) {
+      if (snapshotBoundary.type === "session.failed") {
+        throw new Error(snapshotBoundary.data.message || snapshotBoundary.data.code);
+      }
+      handlers.onComplete?.();
+      if (!rendered.trim()) throw new Error("Empty response from runtime");
+      return rendered.trim();
+    }
+    let streamIndex = snapshot.session.streamIndex;
+    for await (const event of session.stream({ signal })) {
+      if (signal.aborted) break;
+      rendered = applyMessageEvent(event, rendered, handlers);
+      streamIndex += 1;
+      savePersistedAgentSession(
+        this.visitorSessionId,
+        session.state.sessionId,
+        streamIndex,
+        this.storeOptions
+      );
+      if (isTurnBoundary(event)) break;
+    }
+    session = client.sessions.attach(session.state.sessionId, { streamIndex });
+    this.session = session;
+    this.persistSessionCursor(session);
+    if (!rendered.trim() && !signal.aborted) {
+      throw new Error("Empty response from runtime");
     }
     return rendered.trim();
   }
   cancelActive() {
-    this.activeResponse?.cancel().catch(() => {
-    });
+    if (this.activeResponse) {
+      this.activeResponse.cancel().catch(() => {
+      });
+    } else {
+      this.session?.cancel().catch(() => {
+      });
+    }
   }
 };
 function createAgentClient(options) {
@@ -406,6 +520,12 @@ function createAgentClient(options) {
       sendOptions.signal ?? new AbortController().signal,
       sendOptions.handlers
     ),
+    resumeTurn: (resumeOptions) => session.resumeTurn(
+      resumeOptions.message,
+      resumeOptions.signal ?? new AbortController().signal,
+      resumeOptions.handlers,
+      resumeOptions.initialText
+    ),
     reset: () => session.reset(),
     cancelActive: () => session.cancelActive(),
     getActiveSessionId: () => session.getActiveSessionId()
@@ -434,6 +554,58 @@ function formatAgentError(error) {
   return "Runtime request failed";
 }
 
+// src/react/persisted-conversation.ts
+var CONVERSATION_VERSION = 1;
+function conversationKey(storageKeyPrefix, visitorSessionId) {
+  return `${storageKeyPrefix}:conversation:${visitorSessionId}`;
+}
+function parseMessage(value) {
+  if (typeof value !== "object" || value === null) return null;
+  const record = value;
+  if (typeof record.id !== "string" || record.role !== "agent" && record.role !== "visitor" || typeof record.text !== "string" || typeof record.createdAt !== "number" || !Number.isFinite(record.createdAt)) {
+    return null;
+  }
+  return {
+    id: record.id,
+    role: record.role,
+    text: record.text,
+    createdAt: record.createdAt
+  };
+}
+function loadPersistedAgentConversation(storageKeyPrefix, visitorSessionId) {
+  if (typeof sessionStorage === "undefined") return null;
+  const raw = sessionStorage.getItem(conversationKey(storageKeyPrefix, visitorSessionId));
+  if (!raw) return null;
+  try {
+    const value = JSON.parse(raw);
+    if (typeof value !== "object" || value === null) return null;
+    const record = value;
+    if (record.version !== CONVERSATION_VERSION || !Array.isArray(record.messages) || typeof record.pending !== "boolean" || typeof record.streamingText !== "string") {
+      return null;
+    }
+    const messages = record.messages.map(parseMessage);
+    if (messages.some((message) => message === null)) return null;
+    return {
+      messages: messages.filter((message) => message !== null),
+      pending: record.pending,
+      streamingText: record.streamingText
+    };
+  } catch {
+    return null;
+  }
+}
+function savePersistedAgentConversation(storageKeyPrefix, visitorSessionId, conversation) {
+  if (typeof sessionStorage === "undefined") return;
+  sessionStorage.setItem(
+    conversationKey(storageKeyPrefix, visitorSessionId),
+    JSON.stringify({ version: CONVERSATION_VERSION, ...conversation })
+  );
+}
+function clearPersistedAgentConversation(storageKeyPrefix, visitorSessionId) {
+  if (typeof sessionStorage === "undefined") return;
+  sessionStorage.removeItem(conversationKey(storageKeyPrefix, visitorSessionId));
+}
+
 // src/react/hooks/useAgentChat.ts
 var GREETING_MESSAGE = {
   id: "greeting",
@@ -450,6 +622,15 @@ var INITIAL_STATE = {
   streamingText: "",
   error: null
 };
+function stateFromConversation(conversation) {
+  if (!conversation || conversation.messages.length === 0) return INITIAL_STATE;
+  return {
+    ...INITIAL_STATE,
+    messages: conversation.messages,
+    phase: conversation.pending ? conversation.streamingText ? "streaming" : "thinking" : "complete",
+    streamingText: conversation.streamingText
+  };
+}
 var STATUS_SEQUENCE = [
   { id: "s1", label: "Starting Eve session", ms: 400 },
   { id: "s2", label: "Connecting to runtime", ms: 500 }
@@ -481,8 +662,6 @@ function useAgentChat({
   visitorSessionId,
   storageKeyPrefix
 }) {
-  const [state, setState] = (0, import_react.useState)(INITIAL_STATE);
-  const runRef = (0, import_react.useRef)(null);
   const resolvedStorageKeyPrefix = (0, import_react.useMemo)(
     () => storageKeyPrefix?.trim() || buildAgentStorageKeyPrefix({ customerId, indexId, version, runtimeOrigin }),
     [customerId, indexId, runtimeOrigin, storageKeyPrefix, version]
@@ -491,6 +670,12 @@ function useAgentChat({
     () => visitorSessionId?.trim() || getOrCreateVisitorSessionId({ storageKeyPrefix: resolvedStorageKeyPrefix }),
     [resolvedStorageKeyPrefix, visitorSessionId]
   );
+  const [state, setState] = (0, import_react.useState)(
+    () => stateFromConversation(
+      loadPersistedAgentConversation(resolvedStorageKeyPrefix, visitorId)
+    )
+  );
+  const runRef = (0, import_react.useRef)(null);
   const clientRef = (0, import_react.useRef)(
     createAgentClient({
       customerId,
@@ -501,20 +686,15 @@ function useAgentChat({
       storageKeyPrefix: resolvedStorageKeyPrefix
     })
   );
-  const identityRef = (0, import_react.useRef)(null);
   const identityKey = `${customerId ?? ""}|${indexId}|${version ?? "published"}|${runtimeOrigin ?? ""}|${resolvedStorageKeyPrefix}|${visitorId}`;
+  const identityRef = (0, import_react.useRef)(identityKey);
   (0, import_react.useEffect)(() => {
-    if (identityRef.current === null) {
-      identityRef.current = identityKey;
-      return;
-    }
     if (identityRef.current === identityKey) {
       return;
     }
     identityRef.current = identityKey;
     runRef.current?.abort();
     runRef.current = null;
-    clientRef.current.reset();
     clientRef.current = createAgentClient({
       customerId,
       indexId,
@@ -523,81 +703,81 @@ function useAgentChat({
       visitorSessionId: visitorId,
       storageKeyPrefix: resolvedStorageKeyPrefix
     });
-    setState(INITIAL_STATE);
+    setState(
+      stateFromConversation(
+        loadPersistedAgentConversation(resolvedStorageKeyPrefix, visitorId)
+      )
+    );
   }, [customerId, identityKey, indexId, runtimeOrigin, resolvedStorageKeyPrefix, version, visitorId]);
+  (0, import_react.useEffect)(() => {
+    if (!hasVisitorMessages(state.messages)) return;
+    savePersistedAgentConversation(resolvedStorageKeyPrefix, visitorId, {
+      messages: state.messages,
+      pending: isAgentBusy(state.phase),
+      streamingText: state.streamingText
+    });
+  }, [resolvedStorageKeyPrefix, state.messages, state.phase, state.streamingText, visitorId]);
   const reset = (0, import_react.useCallback)(() => {
     runRef.current?.abort();
     runRef.current = null;
     clientRef.current.reset();
+    clearPersistedAgentConversation(resolvedStorageKeyPrefix, visitorId);
     setState(INITIAL_STATE);
-  }, []);
-  const submit = (0, import_react.useCallback)(
-    async (visitorText) => {
-      runRef.current?.abort();
-      clientRef.current.cancelActive();
-      const controller = new AbortController();
-      runRef.current = controller;
+  }, [resolvedStorageKeyPrefix, visitorId]);
+  const runTurn = (0, import_react.useCallback)(
+    async (input) => {
+      const { controller, initialText = "", resume, visitorText } = input;
       const { signal } = controller;
       const isActiveRun = () => runRef.current === controller && !signal.aborted;
-      const visitorMessage = {
-        id: `visitor-${Date.now()}`,
-        role: "visitor",
-        text: visitorText,
-        createdAt: Date.now()
-      };
-      setState((prev) => ({
-        ...prev,
-        phase: "thinking",
-        messages: [...prev.messages, visitorMessage],
-        toolSteps: [{ id: "s1", label: "Starting Eve session", state: "active" }],
-        journey: null,
-        followUps: [],
-        streamingText: "",
-        error: null
-      }));
       try {
-        let streamStarted = false;
-        const planningPromise = runStatusSequence(signal, (step) => {
+        let streamStarted = Boolean(initialText);
+        let streamed = initialText;
+        const planningPromise = resume ? Promise.resolve() : runStatusSequence(signal, (step) => {
           if (streamStarted || !isActiveRun()) return;
           setState((prev) => ({ ...prev, phase: "running-tools", toolSteps: [step] }));
         });
-        let streamed = "";
-        const finalText = await clientRef.current.sendTurn(visitorText, {
-          signal,
-          handlers: {
-            onStep: (label, detail) => {
-              if (streamStarted || !isActiveRun()) return;
+        const handlers = {
+          onStep: (label, detail) => {
+            if (streamStarted || !isActiveRun()) return;
+            setState((prev) => ({
+              ...prev,
+              phase: "running-tools",
+              toolSteps: [{ id: `step-${label}`, label, detail, state: "active" }]
+            }));
+          },
+          onDelta: (delta) => {
+            if (!isActiveRun()) return;
+            void planningPromise.catch(() => {
+            });
+            if (!streamStarted) {
+              streamStarted = true;
               setState((prev) => ({
                 ...prev,
-                phase: "running-tools",
-                toolSteps: [{ id: `step-${label}`, label, detail, state: "active" }]
+                phase: "streaming",
+                toolSteps: [],
+                streamingText: ""
               }));
-            },
-            onDelta: (delta) => {
-              if (!isActiveRun()) return;
-              void planningPromise.catch(() => {
-              });
-              if (!streamStarted) {
-                streamStarted = true;
-                setState((prev) => ({
-                  ...prev,
-                  phase: "streaming",
-                  toolSteps: [],
-                  streamingText: ""
-                }));
-              }
-              streamed += delta;
-              setState((prev) => ({ ...prev, phase: "streaming", streamingText: streamed }));
-            },
-            onComplete: () => {
-              if (!isActiveRun()) return;
-              streamStarted = true;
             }
+            streamed += delta;
+            setState((prev) => ({ ...prev, phase: "streaming", streamingText: streamed }));
+          },
+          onComplete: () => {
+            if (!isActiveRun()) return;
+            streamStarted = true;
           }
-        });
+        };
+        let finalText = resume ? await clientRef.current.resumeTurn({
+          handlers,
+          initialText,
+          message: visitorText,
+          signal
+        }) : await clientRef.current.sendTurn(visitorText, { handlers, signal });
+        if (resume && finalText === null) {
+          finalText = await clientRef.current.sendTurn(visitorText, { handlers, signal });
+        }
         await planningPromise.catch(() => {
         });
-        if (!isActiveRun()) return;
+        if (!isActiveRun() || finalText === null) return;
         const agentMessage = {
           id: `agent-${Date.now()}`,
           role: "agent",
@@ -613,6 +793,7 @@ function useAgentChat({
           followUps: [],
           journey: null
         }));
+        runRef.current = null;
       } catch (error) {
         if (error instanceof DOMException && error.name === "AbortError") return;
         if (!isActiveRun()) return;
@@ -625,14 +806,66 @@ function useAgentChat({
           streamingText: "",
           error: message
         }));
+        runRef.current = null;
       }
     },
-    [customerId, indexId, runtimeOrigin, resolvedStorageKeyPrefix, version, visitorId]
+    []
+  );
+  const submit = (0, import_react.useCallback)(
+    async (visitorText) => {
+      if (runRef.current) {
+        runRef.current.abort();
+        clientRef.current.cancelActive();
+      }
+      const controller = new AbortController();
+      runRef.current = controller;
+      const visitorMessage = {
+        id: `visitor-${Date.now()}`,
+        role: "visitor",
+        text: visitorText,
+        createdAt: Date.now()
+      };
+      setState((prev) => ({
+        ...prev,
+        phase: "thinking",
+        messages: [...prev.messages, visitorMessage],
+        toolSteps: [{ id: "s1", label: "Starting Eve session", state: "active" }],
+        journey: null,
+        followUps: [],
+        streamingText: "",
+        error: null
+      }));
+      await runTurn({ controller, resume: false, visitorText });
+    },
+    [runTurn]
   );
+  (0, import_react.useEffect)(() => {
+    const conversation = loadPersistedAgentConversation(
+      resolvedStorageKeyPrefix,
+      visitorId
+    );
+    if (!conversation?.pending) return;
+    const visitorMessage = [...conversation.messages].reverse().find((message) => message.role === "visitor");
+    if (!visitorMessage) return;
+    const controller = new AbortController();
+    runRef.current = controller;
+    void runTurn({
+      controller,
+      initialText: conversation.streamingText,
+      resume: true,
+      visitorText: visitorMessage.text
+    });
+    return () => {
+      if (runRef.current === controller) {
+        runRef.current = null;
+      }
+      controller.abort();
+    };
+  }, [identityKey, resolvedStorageKeyPrefix, runTurn, visitorId]);
   (0, import_react.useEffect)(() => {
     return () => {
       runRef.current?.abort();
-      clientRef.current.cancelActive();
+      runRef.current = null;
     };
   }, []);
   return {
@@ -869,15 +1102,27 @@ function FollowUpChips({
 }
 
 // src/react/components/MessageBubble/MessageBubble.tsx
+var import_streamdown = require("streamdown");
+var import_styles = require("streamdown/styles.css");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function MessageBubble({ message }) {
   if (message.role === "visitor") {
     return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("article", { className: "message-bubble message-bubble--visitor", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "message-bubble__text", children: message.text }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("article", { className: "message-bubble message-bubble--agent", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("p", { className: "message-bubble__text", children: [
-    message.text,
-    message.streaming ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "tool-timeline__cursor", "aria-hidden": "true" }) : null
-  ] }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("article", { className: "message-bubble message-bubble--agent", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "message-bubble__text", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_streamdown.Streamdown,
+    {
+      animated: true,
+      caret: "circle",
+      className: "message-bubble__markdown",
+      controls: false,
+      isAnimating: message.streaming,
+      linkSafety: { enabled: false },
+      mode: message.streaming ? "streaming" : "static",
+      skipHtml: true,
+      children: message.text
+    }
+  ) }) });
 }
 
 // src/react/components/AgentRail/AgentRail.tsx