@iota-uz/sdk 0.4.37 → 0.4.38

package/dist/bichat/index.mjs

@@ -12,7 +12,7 @@ import rehypeKatex from 'rehype-katex';
 import { motion, useMotionValue, useTransform, AnimatePresence, MotionConfig, useReducedMotion } from 'framer-motion';
 import 'react-dom/client';
 import { differenceInMinutes, differenceInHours, differenceInDays, format, isSameDay, startOfDay, isToday, isYesterday } from 'date-fns';
-import { Menu, MenuButton, MenuItems, MenuItem, Popover, PopoverButton, PopoverPanel, Dialog, DialogBackdrop, DialogPanel, Transition } from '@headlessui/react';
+import { Menu, MenuButton, MenuItems, MenuItem, Popover, PopoverButton, PopoverPanel, Transition } from '@headlessui/react';
 import { createPortal } from 'react-dom';
 
 var __defProp = Object.defineProperty;
@@ -2091,6 +2091,14 @@ var ChatMachine = class {
     this.lastSendAttempt = null;
     /** Prevents fetchSession effect from clobbering state while stream is active. */
     this.sendingSessionId = null;
+    /**
+     * Monotonic counter bumped on every real session switch. An async op (send
+     * stream, post-stream sync, queue drain, resume, HITL) captures it at start
+     * and re-checks before writing to the single shared `state.messaging`; a stale
+     * epoch means the user navigated to a different session, so the write is
+     * dropped instead of bleeding into / clobbering the now-visible session.
+     */
+    this.viewEpoch = 0;
     this.fetchCancelled = false;
     this.disposed = false;
     this.reasoningEffortOptions = null;
@@ -2275,6 +2283,20 @@ var ChatMachine = class {
     if (id === prev) {
       return;
     }
+    this.viewEpoch++;
+    this.abortController?.abort();
+    this.sendingSessionId = null;
+    this._stopPassivePolling();
+    this._updateMessaging({
+      streamingContent: "",
+      thinkingContent: "",
+      activeSteps: [],
+      isStreaming: false,
+      loading: false,
+      generationInProgress: false,
+      streamError: null,
+      streamErrorRetryable: false
+    });
     this.state.session.currentSessionId = id;
     this._hydrateDebugModeForSession(id);
     this._notifySession();
@@ -2352,6 +2374,48 @@ var ChatMachine = class {
     }
     saveQueue(sid, this.state.input.messageQueue);
   }
+  /**
+   * True while `epoch` is still the active view — i.e. the machine has not been
+   * disposed and no session switch has happened since `epoch` was captured.
+   * Async ops gate their writes to the shared messaging state on this.
+   */
+  _isCurrentEpoch(epoch) {
+    return !this.disposed && this.viewEpoch === epoch;
+  }
+  /** A send can't start while generating, mid-resume, or with an open question. */
+  _isBlockedForSend() {
+    return this.state.messaging.loading || this.state.messaging.generationInProgress || isOpenQuestionStatus(this.state.messaging.pendingQuestion?.status);
+  }
+  /**
+   * Send the next queued message, but only if we still own the view (`epoch`)
+   * and nothing is blocking (an in-flight generation or an open question). The
+   * item is dequeued optimistically and restored to the front if it turns out we
+   * can't send when the deferred tick fires — so a queued message is never
+   * silently dropped.
+   */
+  _drainQueueIfReady(epoch) {
+    if (!this._isCurrentEpoch(epoch)) {
+      return;
+    }
+    const queue = this.state.input.messageQueue;
+    if (queue.length === 0 || this._isBlockedForSend()) {
+      return;
+    }
+    const next = queue[0];
+    this._updateInput({ messageQueue: queue.slice(1) });
+    setTimeout(() => {
+      if (!this._isCurrentEpoch(epoch)) {
+        return;
+      }
+      if (this._isBlockedForSend()) {
+        this._updateInput({
+          messageQueue: [next, ...this.state.input.messageQueue]
+        });
+        return;
+      }
+      this._sendMessageCore(next.content, next.attachments);
+    }, 0);
+  }
   _setDebugModeForSession(sessionId, enabled) {
     const nextDebugModeBySession = { ...this.state.session.debugModeBySession };
     if (enabled) {
@@ -2566,7 +2630,9 @@ var ChatMachine = class {
       return;
     }
     this.sendingSessionId = sessionId;
-    this.abortController = new AbortController();
+    const controller = new AbortController();
+    this.abortController = controller;
+    const epoch = this.viewEpoch;
     this._updateMessaging({ isStreaming: true });
     try {
       let accumulatedContent = "";
@@ -2574,6 +2640,9 @@ var ChatMachine = class {
         sessionId,
         runId,
         (chunk) => {
+          if (!this._isCurrentEpoch(epoch)) {
+            return;
+          }
           if (chunk.type === "snapshot" && chunk.snapshot?.partialContent !== void 0) {
             accumulatedContent = chunk.snapshot.partialContent;
             this._updateMessaging({ streamingContent: accumulatedContent });
@@ -2589,21 +2658,25 @@ var ChatMachine = class {
           } else if (chunk.type === "done" || chunk.type === "error") {
           }
         },
-        this.abortController.signal
+        controller.signal
       );
       clearRunMarker(sessionId);
-      await this._syncSessionFromServer(sessionId, true);
+      await this._syncSessionFromServer(sessionId, true, epoch);
     } finally {
-      this.sendingSessionId = null;
-      this.abortController = null;
-      this._updateMessaging({
-        isStreaming: false,
-        loading: false,
-        streamingContent: "",
-        thinkingContent: "",
-        activeSteps: [],
-        generationInProgress: false
-      });
+      if (this.abortController === controller) {
+        this.abortController = null;
+      }
+      if (this._isCurrentEpoch(epoch)) {
+        this.sendingSessionId = null;
+        this._updateMessaging({
+          isStreaming: false,
+          loading: false,
+          streamingContent: "",
+          thinkingContent: "",
+          activeSteps: [],
+          generationInProgress: false
+        });
+      }
     }
   }
   async _resumeAcceptedRunOrPoll(sessionId, runId) {
@@ -2846,11 +2919,14 @@ var ChatMachine = class {
     }
     return { activeSessionId, shouldNavigateAfter };
   }
-  async _syncSessionFromServer(sessionId, allowEmptyTurns = false) {
+  async _syncSessionFromServer(sessionId, allowEmptyTurns = false, epoch) {
     const fetchResult = await this.dataSource.fetchSession(sessionId);
     if (!fetchResult) {
       return;
     }
+    if (epoch !== void 0 && !this._isCurrentEpoch(epoch)) {
+      return;
+    }
     this._updateSession({ session: fetchResult.session });
     this._setTurnsFromFetch(
       allowEmptyTurns ? fetchResult.turns ?? [] : fetchResult.turns,
@@ -2866,7 +2942,9 @@ var ChatMachine = class {
       replaceFromMessageID,
       reasoningEffort,
       model,
-      tempTurnId
+      tempTurnId,
+      controller,
+      epoch
     } = params;
     let accumulatedContent = "";
     let createdSessionId;
@@ -2877,7 +2955,7 @@ var ChatMachine = class {
       activeSessionId || "new",
       content,
       attachments,
-      this.abortController?.signal,
+      controller.signal,
       {
         debugMode,
         replaceFromMessageID,
@@ -2885,7 +2963,7 @@ var ChatMachine = class {
         model
       }
     )) {
-      if (this.abortController?.signal.aborted) {
+      if (controller.signal.aborted || !this._isCurrentEpoch(epoch)) {
         break;
       }
       if (chunk.type === "stream_started" && chunk.runId) {
@@ -2926,7 +3004,7 @@ var ChatMachine = class {
           sessionFetched = true;
           const finalSessionId2 = createdSessionId || activeSessionId;
           if (finalSessionId2 && finalSessionId2 !== "new") {
-            await this._syncSessionFromServer(finalSessionId2);
+            await this._syncSessionFromServer(finalSessionId2, false, epoch);
           }
         }
       } else if (chunk.type === "done") {
@@ -2937,7 +3015,7 @@ var ChatMachine = class {
           sessionFetched = true;
           const finalSessionId2 = createdSessionId || activeSessionId;
           if (finalSessionId2 && finalSessionId2 !== "new") {
-            await this._syncSessionFromServer(finalSessionId2);
+            await this._syncSessionFromServer(finalSessionId2, false, epoch);
           }
         }
       } else if (chunk.type === "user_message" && chunk.sessionId) {
@@ -2951,10 +3029,10 @@ var ChatMachine = class {
     if (finalSessionId && finalSessionId !== "new") {
       clearRunMarker(finalSessionId);
     }
-    const stopped = this.abortController?.signal.aborted ?? false;
+    const stopped = controller.signal.aborted;
     return { createdSessionId, sessionFetched, stopped };
   }
-  async _ensureSessionSyncAfterStream(activeSessionId, createdSessionId, sessionFetched) {
+  async _ensureSessionSyncAfterStream(activeSessionId, createdSessionId, sessionFetched, epoch) {
     if (sessionFetched) {
       return;
     }
@@ -2963,7 +3041,7 @@ var ChatMachine = class {
       return;
     }
     try {
-      await this._syncSessionFromServer(finalSessionId, true);
+      await this._syncSessionFromServer(finalSessionId, true, epoch);
     } catch (fetchErr) {
       console.error("Failed to fetch session after stream:", fetchErr);
     }
@@ -2981,32 +3059,36 @@ var ChatMachine = class {
     this._clearStreamError();
     this.lastSendAttempt = null;
   }
-  _handleSendError(err, content, tempTurnId) {
+  _handleSendError(err, content, tempTurn, epoch) {
+    if (!this._isCurrentEpoch(epoch)) {
+      return false;
+    }
     if (err instanceof Error && err.name === "AbortError") {
       this._updateInput({ message: content });
       this._clearStreamError();
       this._updateMessaging({
         turns: this.state.messaging.turns.filter(
-          (turn) => turn.id !== tempTurnId
+          (turn) => turn.id !== tempTurn.id
         )
       });
       const sessionId = this.sendingSessionId ?? this.state.session.currentSessionId;
       if (sessionId && sessionId !== "new") {
-        this._syncSessionFromServer(sessionId, true).catch(() => {
+        this._syncSessionFromServer(sessionId, true, epoch).catch(() => {
         });
       }
       return false;
     }
-    this._updateMessaging({
-      turns: this.state.messaging.turns.filter(
-        (turn) => turn.id !== tempTurnId
-      )
-    });
     const normalized = normalizeRPCError(err, "Failed to send message");
-    this._updateInput({
-      message: content,
-      inputError: normalized.userMessage
-    });
+    if (this.lastSendAttempt) {
+      this.lastSendAttempt = {
+        ...this.lastSendAttempt,
+        options: {
+          ...this.lastSendAttempt.options,
+          replaceFromMessageID: tempTurn.userTurn.id
+        }
+      };
+    }
+    this._updateInput({ message: "", inputError: null });
     this._updateMessaging({
       streamError: normalized.userMessage,
       streamErrorRetryable: normalized.retryable
@@ -3067,7 +3149,9 @@ var ChatMachine = class {
       loading: true,
       streamingContent: ""
     });
-    this.abortController = new AbortController();
+    const controller = new AbortController();
+    this.abortController = controller;
+    const epoch = this.viewEpoch;
     const curSessionId = this.state.session.currentSessionId;
     const curDebugMode = deriveDebugMode(this.state);
     const replaceFromMessageID = options?.replaceFromMessageID;
@@ -3093,9 +3177,12 @@ var ChatMachine = class {
           this.state.session.reasoningEffort
         ),
         model: this.state.session.model,
-        tempTurnId: tempTurn.id
+        tempTurnId: tempTurn.id,
+        controller,
+        epoch
       });
-      if (stopped) {
+      if (!this._isCurrentEpoch(epoch)) {
+      } else if (stopped) {
         this._updateMessaging({
           turns: this.state.messaging.turns.filter(
             (turn) => turn.id !== tempTurn.id
@@ -3105,39 +3192,37 @@ var ChatMachine = class {
         this._clearStreamError();
         const syncId = createdSessionId || activeSessionId;
         if (syncId && syncId !== "new") {
-          await this._syncSessionFromServer(syncId, true).catch(() => {
+          await this._syncSessionFromServer(syncId, true, epoch).catch(() => {
           });
         }
       } else {
         await this._ensureSessionSyncAfterStream(
           activeSessionId,
           createdSessionId,
-          sessionFetched
+          sessionFetched,
+          epoch
         );
         const targetSessionId = createdSessionId || activeSessionId;
         this._finalizeSuccessfulSend(targetSessionId, shouldNavigateAfter);
       }
     } catch (err) {
-      shouldDrainQueue = this._handleSendError(err, content, tempTurn.id);
+      shouldDrainQueue = this._handleSendError(err, content, tempTurn, epoch);
     } finally {
-      this._updateMessaging({
-        loading: false,
-        streamingContent: "",
-        isStreaming: false,
-        thinkingContent: "",
-        activeSteps: []
-      });
-      this.abortController = null;
-      this.sendingSessionId = null;
+      if (this._isCurrentEpoch(epoch)) {
+        this._updateMessaging({
+          loading: false,
+          streamingContent: "",
+          isStreaming: false,
+          thinkingContent: "",
+          activeSteps: []
+        });
+        this.sendingSessionId = null;
+      }
+      if (this.abortController === controller) {
+        this.abortController = null;
+      }
       if (shouldDrainQueue) {
-        const queue = this.state.input.messageQueue;
-        if (queue.length > 0 && !isOpenQuestionStatus(this.state.messaging.pendingQuestion?.status)) {
-          const next = queue[0];
-          this._updateInput({ messageQueue: queue.slice(1) });
-          setTimeout(() => {
-            this._sendMessageCore(next.content, next.attachments);
-          }, 0);
-        }
+        this._drainQueueIfReady(epoch);
       }
     }
   }
@@ -3224,7 +3309,7 @@ var ChatMachine = class {
     );
   }
   // ── Regenerate / Edit ───────────────────────────────────────────────────
-  async _handleRegenerate(turnId) {
+  async _handleRegenerate(turnId, model) {
     const curSessionId = this.state.session.currentSessionId;
     if (!curSessionId || curSessionId === "new") {
       return;
@@ -3233,6 +3318,9 @@ var ChatMachine = class {
     if (!turn) {
       return;
     }
+    if (model && model !== this.state.session.model) {
+      this._setModel(model);
+    }
     this._updateSession({ error: null, errorRetryable: false });
     await this._sendMessageDirect(
       turn.userTurn.content,
@@ -3280,6 +3368,7 @@ var ChatMachine = class {
     if (!curSessionId || !curPendingQuestion) {
       return;
     }
+    const epoch = this.viewEpoch;
     this._updateMessaging({ loading: true });
     this._updateSession({ error: null, errorRetryable: false });
     const previousPendingQuestion = curPendingQuestion;
@@ -3289,7 +3378,7 @@ var ChatMachine = class {
         previousPendingQuestion.id,
         answers
       );
-      if (this.disposed) {
+      if (!this._isCurrentEpoch(epoch)) {
         return;
       }
       if (result.success) {
@@ -3310,7 +3399,7 @@ var ChatMachine = class {
           await this._resumeAcceptedRunOrPoll(curSessionId, result.data.runId);
           if (!this.state.messaging.generationInProgress) {
             const fetchResult = await this.dataSource.fetchSession(curSessionId);
-            if (this.disposed) {
+            if (!this._isCurrentEpoch(epoch)) {
               return;
             }
             if (fetchResult) {
@@ -3328,7 +3417,7 @@ var ChatMachine = class {
           }
         } else if (curSessionId !== "new") {
           const fetchResult = await this.dataSource.fetchSession(curSessionId);
-          if (this.disposed) {
+          if (!this._isCurrentEpoch(epoch)) {
             return;
           }
           if (fetchResult) {
@@ -3351,7 +3440,7 @@ var ChatMachine = class {
         });
       }
     } catch (err) {
-      if (this.disposed) {
+      if (!this._isCurrentEpoch(epoch)) {
         return;
       }
       const normalized = normalizeRPCError(err, "Failed to submit answers");
@@ -3360,8 +3449,11 @@ var ChatMachine = class {
         errorRetryable: normalized.retryable
       });
     } finally {
-      if (!this.disposed) {
+      if (this._isCurrentEpoch(epoch)) {
         this._updateMessaging({ loading: false });
+        if (!this.state.session.error) {
+          this._drainQueueIfReady(epoch);
+        }
       }
     }
   }
@@ -3371,9 +3463,10 @@ var ChatMachine = class {
     if (!curSessionId || !curPendingQuestion) {
       return;
     }
+    const epoch = this.viewEpoch;
     try {
       const result = await this.dataSource.rejectPendingQuestion(curSessionId);
-      if (this.disposed) {
+      if (!this._isCurrentEpoch(epoch)) {
         return;
       }
       if (result.success) {
@@ -3392,7 +3485,7 @@ var ChatMachine = class {
           await this._resumeAcceptedRunOrPoll(curSessionId, result.data.runId);
           if (!this.state.messaging.generationInProgress && curSessionId !== "new") {
             const fetchResult = await this.dataSource.fetchSession(curSessionId);
-            if (this.disposed) {
+            if (!this._isCurrentEpoch(epoch)) {
               return;
             }
             if (fetchResult) {
@@ -3410,7 +3503,7 @@ var ChatMachine = class {
           }
         } else if (curSessionId !== "new") {
           const fetchResult = await this.dataSource.fetchSession(curSessionId);
-          if (this.disposed) {
+          if (!this._isCurrentEpoch(epoch)) {
             return;
           }
           if (fetchResult) {
@@ -3428,7 +3521,7 @@ var ChatMachine = class {
         });
       }
     } catch (err) {
-      if (this.disposed) {
+      if (!this._isCurrentEpoch(epoch)) {
         return;
       }
       const normalized = normalizeRPCError(err, "Failed to reject question");
@@ -3436,6 +3529,10 @@ var ChatMachine = class {
         error: normalized.userMessage,
         errorRetryable: normalized.retryable
       });
+    } finally {
+      if (this._isCurrentEpoch(epoch) && !this.state.session.error) {
+        this._drainQueueIfReady(epoch);
+      }
     }
   }
   // ── Input / queue ───────────────────────────────────────────────────────
@@ -4292,6 +4389,167 @@ function AttachmentGrid({
 var MemoizedAttachmentGrid = React.memo(AttachmentGrid);
 MemoizedAttachmentGrid.displayName = "AttachmentGrid";
 var AttachmentGrid_default = MemoizedAttachmentGrid;
+function deepActiveElement(root) {
+  let active = root.activeElement;
+  while (active?.shadowRoot?.activeElement) {
+    active = active.shadowRoot.activeElement;
+  }
+  return active instanceof HTMLElement ? active : null;
+}
+function useFocusTrap(containerRef, isActive, restoreFocusOnDeactivate) {
+  useEffect(() => {
+    if (!isActive || !containerRef.current) {
+      return;
+    }
+    const container = containerRef.current;
+    const root = container.getRootNode();
+    const previouslyFocused = deepActiveElement(root);
+    const getFocusableElements = () => {
+      const selector = [
+        "button:not([disabled])",
+        "[href]",
+        "input:not([disabled])",
+        "select:not([disabled])",
+        "textarea:not([disabled])",
+        '[tabindex]:not([tabindex="-1"])'
+      ].join(", ");
+      return Array.from(container.querySelectorAll(selector));
+    };
+    const focusableElements = getFocusableElements();
+    const initialTarget = container.querySelector("[data-autofocus]") ?? focusableElements[0];
+    initialTarget?.focus();
+    const handleTabKey = (e) => {
+      if (e.key !== "Tab") {
+        return;
+      }
+      const focusableElements2 = getFocusableElements();
+      if (focusableElements2.length === 0) {
+        return;
+      }
+      const firstElement = focusableElements2[0];
+      const lastElement = focusableElements2[focusableElements2.length - 1];
+      const active = deepActiveElement(root);
+      if (e.shiftKey) {
+        if (active === firstElement) {
+          e.preventDefault();
+          lastElement.focus();
+        }
+      } else {
+        if (active === lastElement) {
+          e.preventDefault();
+          firstElement.focus();
+        }
+      }
+    };
+    container.addEventListener("keydown", handleTabKey);
+    return () => {
+      container.removeEventListener("keydown", handleTabKey);
+      if (restoreFocusOnDeactivate) {
+        restoreFocusOnDeactivate.focus();
+      } else if (previouslyFocused) {
+        previouslyFocused.focus();
+      }
+    };
+  }, [containerRef, isActive, restoreFocusOnDeactivate]);
+}
+var lockCount = 0;
+var restorePreviousStyles = null;
+function applyBodyLock() {
+  const body = document.body;
+  const previousOverflow = body.style.overflow;
+  const previousPaddingRight = body.style.paddingRight;
+  const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
+  body.style.overflow = "hidden";
+  if (scrollbarWidth > 0) {
+    const currentPadding = parseFloat(window.getComputedStyle(body).paddingRight) || 0;
+    body.style.paddingRight = `${currentPadding + scrollbarWidth}px`;
+  }
+  restorePreviousStyles = () => {
+    body.style.overflow = previousOverflow;
+    body.style.paddingRight = previousPaddingRight;
+  };
+}
+function useModalLock(isOpen) {
+  useEffect(() => {
+    if (!isOpen) {
+      return;
+    }
+    if (lockCount === 0) {
+      applyBodyLock();
+    }
+    lockCount += 1;
+    return () => {
+      lockCount -= 1;
+      if (lockCount === 0 && restorePreviousStyles) {
+        restorePreviousStyles();
+        restorePreviousStyles = null;
+      }
+    };
+  }, [isOpen]);
+}
+var DialogContext = createContext(null);
+function InlineDialog({ open, onClose, className, children }) {
+  const containerRef = useRef(null);
+  useModalLock(open);
+  useFocusTrap(containerRef, open);
+  useEffect(() => {
+    if (!open) {
+      return;
+    }
+    const container = containerRef.current;
+    if (!container) {
+      return;
+    }
+    const handler = (e) => {
+      if (e.key === "Escape") {
+        onClose();
+      }
+    };
+    container.addEventListener("keydown", handler);
+    return () => container.removeEventListener("keydown", handler);
+  }, [open, onClose]);
+  if (!open) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(DialogContext.Provider, { value: onClose, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: containerRef,
+      className,
+      onClick: onClose,
+      tabIndex: -1,
+      children
+    }
+  ) });
+}
+function InlineDialogBackdrop(props) {
+  return /* @__PURE__ */ jsx("div", { "aria-hidden": "true", ...props });
+}
+function InlineDialogPanel({
+  children,
+  onClick,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "dialog",
+      "aria-modal": "true",
+      onClick: (e) => {
+        e.stopPropagation();
+        onClick?.(e);
+      },
+      ...rest,
+      children
+    }
+  );
+}
+function InlineDialogTitle(props) {
+  return /* @__PURE__ */ jsx("h2", { ...props });
+}
+function InlineDialogDescription(props) {
+  return /* @__PURE__ */ jsx("p", { ...props });
+}
 init_useTranslation();
 function ToolbarButton({
   onClick,
@@ -4494,16 +4752,16 @@ function ImageModal({
   }, [isZoomed, onClose]);
   const previewUrl = attachment.preview || createDataUrl(attachment.base64Data, attachment.mimeType);
   const zoomPercent = Math.round(scale * 100);
-  return /* @__PURE__ */ jsxs(Dialog, { open: isOpen, onClose, className: "relative", style: { zIndex: 99999 }, children: [
+  return /* @__PURE__ */ jsxs(InlineDialog, { open: isOpen, onClose, className: "relative z-[99999]", children: [
     /* @__PURE__ */ jsx(
-      DialogBackdrop,
+      InlineDialogBackdrop,
       {
         className: "fixed inset-0 bg-black/90 backdrop-blur-sm",
         style: { zIndex: 99999 }
       }
     ),
     /* @__PURE__ */ jsxs(
-      DialogPanel,
+      InlineDialogPanel,
       {
         className: "fixed inset-0 flex flex-col",
         style: { zIndex: 1e5 },
@@ -4652,7 +4910,7 @@ var defaultClassNames = {
   bubble: "bg-primary-600 text-white rounded-2xl rounded-br-sm px-4 py-3 shadow-sm",
   content: "text-sm whitespace-pre-wrap break-words leading-relaxed",
   attachments: "mb-2 w-full",
-  actions: "flex items-center gap-1 mt-2 transition-opacity duration-150 group-focus-within:opacity-100 [@media(hover:hover)]:opacity-0 [@media(hover:hover)]:group-hover:opacity-100",
+  actions: "flex items-center gap-1 mt-2",
   actionButton: "cursor-pointer p-2 min-h-[44px] min-w-[44px] flex items-center justify-center text-gray-500 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 active:bg-gray-200 dark:active:bg-gray-700 rounded-md transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50",
   timestamp: "text-xs text-gray-400 dark:text-gray-500 mr-1"
 };
@@ -5051,6 +5309,7 @@ function UserTurnView({
     }
   );
 }
+init_IotaContext();
 init_useTranslation();
 function toBase64(str) {
   const bytes = new TextEncoder().encode(str);
@@ -6165,6 +6424,8 @@ function FullscreenOverlay({ title, onClose, closeLabel, children }) {
   const panelRef = useRef(null);
   const onCloseRef = useRef(onClose);
   onCloseRef.current = onClose;
+  useModalLock(true);
+  useFocusTrap(panelRef, true);
   useEffect(() => {
     const onKeyDown = (e) => {
       if (e.key === "Escape") {
@@ -6173,7 +6434,6 @@ function FullscreenOverlay({ title, onClose, closeLabel, children }) {
       }
     };
     document.addEventListener("keydown", onKeyDown);
-    panelRef.current?.focus();
     return () => document.removeEventListener("keydown", onKeyDown);
   }, []);
   return /* @__PURE__ */ jsxs("div", { className: "fixed inset-0", style: { zIndex: 99999 }, children: [
@@ -7742,7 +8002,7 @@ var defaultClassNames2 = {
   artifacts: "mb-1 flex flex-wrap gap-2",
   sources: "",
   explanation: "mt-4 border-t border-gray-100 dark:border-gray-700 pt-4",
-  actions: "flex items-center gap-1 transition-opacity duration-150 group-focus-within:opacity-100 [@media(hover:hover)]:opacity-0 [@media(hover:hover)]:group-hover:opacity-100",
+  actions: "flex items-center gap-1",
   actionButton: "cursor-pointer p-2 min-h-[44px] min-w-[44px] flex items-center justify-center text-gray-500 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 active:bg-gray-200 dark:active:bg-gray-700 rounded-md transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50",
   timestamp: "text-xs text-gray-400 dark:text-gray-500 mr-1"
 };
@@ -7776,6 +8036,7 @@ function AssistantMessage({
   classNames: classNameOverrides,
   onCopy,
   onRegenerate,
+  regenerateModels,
   onSendMessage,
   sendDisabled = false,
   hideAvatar = false,
@@ -7786,6 +8047,8 @@ function AssistantMessage({
   const { t } = useTranslation();
   const [explanationExpanded, setExplanationExpanded] = useState(false);
   const [isCopied, setIsCopied] = useState(false);
+  const [showRegenPicker, setShowRegenPicker] = useState(false);
+  const regenPickerRef = useRef(null);
   const copyFeedbackTimeoutRef = useRef(
     null
   );
@@ -7838,11 +8101,56 @@ function AssistantMessage({
       console.error("Failed to copy:", err);
     }
   }, [onCopy, turn.content]);
+  const hasRegenChoices = (regenerateModels?.length ?? 0) >= 2;
   const handleRegenerateClick = useCallback(async () => {
-    if (onRegenerate && turnId) {
-      await onRegenerate(turnId);
+    if (!onRegenerate || !turnId) {
+      return;
     }
-  }, [onRegenerate, turnId]);
+    if (hasRegenChoices) {
+      setShowRegenPicker((prev) => !prev);
+      return;
+    }
+    await onRegenerate(turnId);
+  }, [onRegenerate, turnId, hasRegenChoices]);
+  const handleRegenerateWithModel = useCallback(
+    async (modelId) => {
+      setShowRegenPicker(false);
+      if (onRegenerate && turnId) {
+        await onRegenerate(turnId, modelId);
+      }
+    },
+    [onRegenerate, turnId]
+  );
+  useEffect(() => {
+    if (!showRegenPicker) {
+      return;
+    }
+    const handlePointer = (e) => {
+      const root = regenPickerRef.current;
+      if (!root) {
+        return;
+      }
+      const path = typeof e.composedPath === "function" ? e.composedPath() : [];
+      const insideViaPath = path.includes(root);
+      const insideViaContains = root.contains(e.target);
+      if (!insideViaPath && !insideViaContains) {
+        setShowRegenPicker(false);
+      }
+    };
+    const handleKey = (e) => {
+      if (e.key === "Escape") {
+        setShowRegenPicker(false);
+      }
+    };
+    document.addEventListener("mousedown", handlePointer);
+    document.addEventListener("touchstart", handlePointer);
+    document.addEventListener("keydown", handleKey);
+    return () => {
+      document.removeEventListener("mousedown", handlePointer);
+      document.removeEventListener("touchstart", handlePointer);
+      document.removeEventListener("keydown", handleKey);
+    };
+  }, [showRegenPicker]);
   const timestamp = formatRelativeTime(turn.createdAt, t);
   const avatarSlotProps = {
     text: isSystemMessage ? "SYS" : "AI"
@@ -7869,7 +8177,17 @@ function AssistantMessage({
   };
   const actionsSlotProps = {
     onCopy: handleCopyClick,
-    onRegenerate: canRegenerate ? handleRegenerateClick : void 0,
+    onRegenerate: canRegenerate ? (model) => {
+      if (!onRegenerate || !turnId) {
+        return;
+      }
+      if (model) {
+        void handleRegenerateWithModel(model);
+      } else {
+        void handleRegenerateClick();
+      }
+    } : void 0,
+    regenerateModels,
     timestamp,
     canCopy: hasContent,
     canRegenerate
@@ -8060,16 +8378,56 @@ function AssistantMessage({
                   children: isCopied ? /* @__PURE__ */ jsx(Check, { size: 14, weight: "bold" }) : /* @__PURE__ */ jsx(Copy, { size: 14, weight: "regular" })
                 }
               ),
-              canRegenerate && /* @__PURE__ */ jsx(
-                "button",
-                {
-                  onClick: handleRegenerateClick,
-                  className: `cursor-pointer ${classes.actionButton}`,
-                  "aria-label": t("BiChat.Message.Regenerate"),
-                  title: t("BiChat.Message.Regenerate"),
-                  children: /* @__PURE__ */ jsx(ArrowsClockwise, { size: 14, weight: "regular" })
-                }
-              )
+              canRegenerate && /* @__PURE__ */ jsxs("div", { ref: regenPickerRef, className: "relative inline-flex", children: [
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    onClick: handleRegenerateClick,
+                    className: `cursor-pointer ${classes.actionButton} ${showRegenPicker ? "bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-200" : ""}`,
+                    "aria-label": t("BiChat.Message.Regenerate"),
+                    title: t("BiChat.Message.Regenerate"),
+                    "aria-haspopup": hasRegenChoices ? "menu" : void 0,
+                    "aria-expanded": hasRegenChoices ? showRegenPicker : void 0,
+                    children: /* @__PURE__ */ jsx(ArrowsClockwise, { size: 14, weight: "regular" })
+                  }
+                ),
+                hasRegenChoices && showRegenPicker && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    role: "menu",
+                    "aria-label": t("BiChat.Message.Regenerate"),
+                    className: "animate-slide-up absolute left-0 top-full z-20 mt-1 flex flex-col gap-0.5 rounded-lg border border-gray-200 bg-white p-1 shadow-lg dark:border-gray-700 dark:bg-gray-800",
+                    children: regenerateModels.map((m, i) => {
+                      const isFast = i === 0;
+                      const Icon = isFast ? Lightning : Brain;
+                      const accent = isFast ? "text-amber-600 dark:text-amber-400" : "text-blue-600 dark:text-blue-400";
+                      return /* @__PURE__ */ jsxs(
+                        "button",
+                        {
+                          role: "menuitem",
+                          type: "button",
+                          onClick: () => {
+                            void handleRegenerateWithModel(m.id);
+                          },
+                          className: "flex items-center gap-2 whitespace-nowrap rounded-md px-2.5 py-1.5 text-xs font-medium text-gray-700 transition-colors duration-150 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-700",
+                          children: [
+                            /* @__PURE__ */ jsx(
+                              Icon,
+                              {
+                                size: 14,
+                                weight: "fill",
+                                className: accent
+                              }
+                            ),
+                            /* @__PURE__ */ jsx("span", { children: t(m.label) })
+                          ]
+                        },
+                        m.id
+                      );
+                    })
+                  }
+                )
+              ] })
             ] })
           )
         }
@@ -8229,6 +8587,14 @@ function AssistantTurnView({
 }) {
   const { debugMode } = useChatSession();
   const { handleCopy, handleRegenerate, pendingQuestion, sendMessage: sendMessage2, loading } = useChatMessaging();
+  const iotaContext = useIotaContext();
+  const regenerateModels = useMemo(() => {
+    const models = iotaContext.extensions?.llm?.models;
+    if (!models || models.length < 2) {
+      return void 0;
+    }
+    return models.map((m) => ({ id: m.id, label: m.label }));
+  }, [iotaContext.extensions?.llm?.models]);
   const assistantTurn = turn.assistantTurn;
   if (!assistantTurn) {
     return null;
@@ -8257,6 +8623,7 @@ function AssistantTurnView({
       classNames,
       onCopy: handleCopy,
       onRegenerate: allowRegenerate ? handleRegenerate : void 0,
+      regenerateModels: allowRegenerate ? regenerateModels : void 0,
       onSendMessage: sendMessage2,
       sendDisabled: loading || isStreaming,
       hideAvatar,
@@ -10557,8 +10924,6 @@ function SessionArtifactList({
     }) })
   ] }, group.type)) });
 }
-
-// ui/src/bichat/components/SessionArtifactPreviewModal.tsx
 init_useTranslation();
 
 // ui/src/bichat/components/SessionArtifactPreview.tsx
@@ -10948,9 +11313,9 @@ function SessionArtifactPreviewModal({
   if (!artifact) {
     return null;
   }
-  return /* @__PURE__ */ jsxs(Dialog, { open: isOpen, onClose: handleClose, className: "relative z-50", children: [
-    /* @__PURE__ */ jsx(DialogBackdrop, { className: "fixed inset-0 bg-black/50 backdrop-blur-sm" }),
-    /* @__PURE__ */ jsx("div", { className: "fixed inset-0 overflow-y-auto p-4 lg:p-6", children: /* @__PURE__ */ jsx("div", { className: "mx-auto flex min-h-full w-full max-w-6xl items-center justify-center", children: /* @__PURE__ */ jsxs(DialogPanel, { className: "flex max-h-[92vh] w-full flex-col overflow-hidden rounded-2xl border border-gray-200 bg-white shadow-xl dark:border-gray-700 dark:bg-gray-900", children: [
+  return /* @__PURE__ */ jsxs(InlineDialog, { open: isOpen, onClose: handleClose, className: "relative z-50", children: [
+    /* @__PURE__ */ jsx(InlineDialogBackdrop, { className: "fixed inset-0 bg-black/50 backdrop-blur-sm" }),
+    /* @__PURE__ */ jsx("div", { className: "fixed inset-0 overflow-y-auto p-4 lg:p-6", children: /* @__PURE__ */ jsx("div", { className: "mx-auto flex min-h-full w-full max-w-6xl items-center justify-center", children: /* @__PURE__ */ jsxs(InlineDialogPanel, { className: "flex max-h-[92vh] w-full flex-col overflow-hidden rounded-2xl border border-gray-200 bg-white shadow-xl dark:border-gray-700 dark:bg-gray-900", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3 border-b border-gray-200 px-4 py-3 dark:border-gray-700", children: [
         /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
           isEditingName ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
@@ -11450,109 +11815,6 @@ function SessionArtifactsPanel({
     }
   );
 }
-var DialogContext = createContext(null);
-var FOCUSABLE_SELECTOR = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
-function InlineDialog({ open, onClose, className, children }) {
-  const containerRef = useRef(null);
-  const previousFocusRef = useRef(null);
-  useEffect(() => {
-    if (!open) {
-      return;
-    }
-    previousFocusRef.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
-    const container = containerRef.current;
-    if (!container) {
-      return;
-    }
-    const getFocusable = () => Array.from(
-      container.querySelectorAll(FOCUSABLE_SELECTOR)
-    );
-    const handler = (e) => {
-      if (e.key === "Escape") {
-        onClose();
-        return;
-      }
-      if (e.key !== "Tab") {
-        return;
-      }
-      const focusable = getFocusable();
-      if (focusable.length === 0) {
-        e.preventDefault();
-        container.focus();
-        return;
-      }
-      const first = focusable[0];
-      const last = focusable[focusable.length - 1];
-      if (e.shiftKey && document.activeElement === first) {
-        e.preventDefault();
-        last.focus();
-      } else if (!e.shiftKey && document.activeElement === last) {
-        e.preventDefault();
-        first.focus();
-      }
-    };
-    (getFocusable()[0] ?? container)?.focus();
-    container.addEventListener("keydown", handler);
-    return () => {
-      container.removeEventListener("keydown", handler);
-      previousFocusRef.current?.focus();
-    };
-  }, [open, onClose]);
-  if (!open) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(DialogContext.Provider, { value: onClose, children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: containerRef,
-      className,
-      onClick: onClose,
-      tabIndex: -1,
-      children
-    }
-  ) });
-}
-function InlineDialogBackdrop(props) {
-  return /* @__PURE__ */ jsx("div", { "aria-hidden": "true", ...props });
-}
-function InlineDialogPanel({
-  children,
-  onClick,
-  ...rest
-}) {
-  const ref = useRef(null);
-  useEffect(() => {
-    if (!ref.current) {
-      return;
-    }
-    const target = ref.current.querySelector("[data-autofocus]") ?? ref.current.querySelector(
-      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-    );
-    target?.focus();
-  }, []);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      role: "dialog",
-      "aria-modal": "true",
-      onClick: (e) => {
-        e.stopPropagation();
-        onClick?.(e);
-      },
-      ...rest,
-      children
-    }
-  );
-}
-function InlineDialogTitle(props) {
-  return /* @__PURE__ */ jsx("h2", { ...props });
-}
-function InlineDialogDescription(props) {
-  return /* @__PURE__ */ jsx("p", { ...props });
-}
-
-// ui/src/bichat/components/SessionMembersModal.tsx
 init_useTranslation();
 init_useTranslation();
 function ConfirmModalBase({
@@ -12439,7 +12701,7 @@ function ChatSessionCore({
           "div",
           {
             ref: layoutContainerRef,
-            className: "relative flex min-h-0 flex-1 overflow-hidden",
+            className: "relative flex min-h-0 flex-1 overflow-clip",
             children: [
               /* @__PURE__ */ jsx("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: showWelcome ? /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col overflow-auto", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center px-4 py-8", children: /* @__PURE__ */ jsxs("div", { className: "w-full max-w-5xl", children: [
                 welcomeSlot || /* @__PURE__ */ jsx(WelcomeContent_default, { onPromptSelect: handlePromptSelect, disabled: loading || composerDisabled }),
@@ -15891,61 +16153,6 @@ function useSidebarState() {
   const toggleMobile = useCallback(() => setIsMobileOpen((v) => !v), []);
   return { isMobile, isMobileOpen, openMobile, closeMobile, toggleMobile };
 }
-function useFocusTrap(containerRef, isActive, restoreFocusOnDeactivate) {
-  useEffect(() => {
-    if (!isActive || !containerRef.current) {
-      return;
-    }
-    const container = containerRef.current;
-    const previouslyFocused = document.activeElement;
-    const getFocusableElements = () => {
-      const selector = [
-        "button:not([disabled])",
-        "[href]",
-        "input:not([disabled])",
-        "select:not([disabled])",
-        "textarea:not([disabled])",
-        '[tabindex]:not([tabindex="-1"])'
-      ].join(", ");
-      return Array.from(container.querySelectorAll(selector));
-    };
-    const focusableElements = getFocusableElements();
-    if (focusableElements.length > 0) {
-      focusableElements[0].focus();
-    }
-    const handleTabKey = (e) => {
-      if (e.key !== "Tab") {
-        return;
-      }
-      const focusableElements2 = getFocusableElements();
-      if (focusableElements2.length === 0) {
-        return;
-      }
-      const firstElement = focusableElements2[0];
-      const lastElement = focusableElements2[focusableElements2.length - 1];
-      if (e.shiftKey) {
-        if (document.activeElement === firstElement) {
-          e.preventDefault();
-          lastElement.focus();
-        }
-      } else {
-        if (document.activeElement === lastElement) {
-          e.preventDefault();
-          firstElement.focus();
-        }
-      }
-    };
-    container.addEventListener("keydown", handleTabKey);
-    return () => {
-      container.removeEventListener("keydown", handleTabKey);
-      if (restoreFocusOnDeactivate) {
-        restoreFocusOnDeactivate.focus();
-      } else if (previouslyFocused instanceof HTMLElement) {
-        previouslyFocused.focus();
-      }
-    };
-  }, [containerRef, isActive, restoreFocusOnDeactivate]);
-}
 
 // ui/src/bichat/components/BiChatLayout.tsx
 init_useTranslation();
@@ -17195,18 +17402,6 @@ function useActiveRuns(dataSource, options = {}) {
 
 // ui/src/bichat/index.ts
 init_useTranslation();
-function useModalLock(isOpen) {
-  useEffect(() => {
-    if (!isOpen) {
-      return;
-    }
-    const originalOverflow = document.body.style.overflow;
-    document.body.style.overflow = "hidden";
-    return () => {
-      document.body.style.overflow = originalOverflow;
-    };
-  }, [isOpen]);
-}
 function useImageGallery(options = {}) {
   const { images: initialImages = [], wrap = false, onOpen, onClose, onNavigate } = options;
   const [isOpen, setIsOpen] = useState(false);