@opengeni/react 3.7.0-canary.0 → 3.7.0-canary.1

package/dist/{chunk-DOK4KZF2.js → chunk-5IXTJTK3.js}

@@ -8,21 +8,52 @@ import {
   tableElementToTsv
 } from "./chunk-JVYQRRC4.js";
 import {
+  Actions,
+  AttachButton,
+  Attachments,
+  CommandPalette2 as CommandPalette,
+  ComposerTranscriptionControl,
+  Confirmation,
+  Controls,
+  Footer,
+  Frame,
+  Help,
+  Hint,
+  Input,
   LightboxProvider,
+  ModelPicker2 as ModelPicker,
+  PauseButton,
+  PausedState,
+  RestoredResources,
+  Root,
+  SendButton,
+  Status,
+  Surface,
   Tooltip,
   TooltipContent,
   TooltipProvider,
   TooltipTrigger,
+  useChatComposerController,
   useLightboxOptional
-} from "./chunk-7EAFGICR.js";
+} from "./chunk-INGB2N5R.js";
+import {
+  ModelPolicyPicker
+} from "./chunk-4JFUT22W.js";
 import {
   buildTimeline,
   groupTimeline,
   invokeOlderHistoryLoaderWithReceiptCapture,
   isActionableHumanInputRequest,
   mcpToolLeaf,
-  toolDisplayName
-} from "./chunk-FJBOU2TH.js";
+  toolDisplayName,
+  useHumanInputRequests,
+  useSession,
+  useSessionEvents,
+  useTurnQueue
+} from "./chunk-MOWYEBCQ.js";
+import {
+  useComposer
+} from "./chunk-IOLVN74D.js";
 import {
   formatBytes,
   formatClockTime,
@@ -30,7 +61,18 @@ import {
   stringifyPayload,
   truncate,
   tryParseJson
-} from "./chunk-VTOREEXF.js";
+} from "./chunk-PLYRL5ER.js";
+import {
+  usePolledValue
+} from "./chunk-KZ73RL76.js";
+import {
+  useOpenGeni,
+  useOpenGeniClient
+} from "./chunk-NEXLLTP4.js";
+import {
+  projectPickerRows,
+  sortPickerRows
+} from "./chunk-WMGF4Z7X.js";
 import {
   cn
 } from "./chunk-22KP6LR5.js";
@@ -5735,7 +5777,7 @@ import {
 import { AnimatePresence, motion } from "motion/react";
 import { Collapsible as Collapsible2 } from "radix-ui";
 import {
-  Component as Component2,
+  Component as Component3,
   Suspense as Suspense3,
   lazy as lazy3,
   memo as memo2,
@@ -5747,6 +5789,73 @@ import {
   useState as useState12
 } from "react";
 
+// src/components/timeline-anchor.tsx
+import { Component as Component2 } from "react";
+var TimelineBeforeLayout = class extends Component2 {
+  getSnapshotBeforeUpdate() {
+    this.props.capture();
+    return null;
+  }
+  componentDidUpdate() {
+  }
+  render() {
+    return this.props.children;
+  }
+};
+function captureTimelineAnchor(scroller) {
+  const viewport = scroller.getBoundingClientRect();
+  if (viewport.height <= 0) return null;
+  const groups = Array.from(scroller.querySelectorAll("[data-og-group-key]")).filter(
+    (group) => group.getBoundingClientRect().height > 0
+  );
+  const anchors = [];
+  const focused = scroller.ownerDocument.activeElement;
+  if (focused instanceof HTMLElement && scroller.contains(focused) && focused.matches("button[aria-expanded]")) {
+    const box = focused.getBoundingClientRect();
+    if (box.bottom > viewport.top && box.top < viewport.bottom) {
+      anchors.push({ element: focused, key: null, text: null, top: box.top });
+    }
+  }
+  for (const group of groups) {
+    const rect = group.getBoundingClientRect();
+    if (rect.bottom <= viewport.top || rect.top >= viewport.bottom) continue;
+    for (const element of group.querySelectorAll("p, li, pre, h1, h2, h3, h4")) {
+      const box = element.getBoundingClientRect();
+      const text = element.textContent;
+      if (box.bottom > viewport.top && box.top < viewport.bottom && text && text.length >= 12) {
+        anchors.push({ element, key: null, text, top: box.top });
+      }
+    }
+  }
+  const rows = groups.map((element) => ({
+    element,
+    key: element.getAttribute("data-og-group-key"),
+    text: null,
+    top: element.getBoundingClientRect().top
+  }));
+  anchors.push(...rows.filter((row) => row.top >= viewport.top));
+  anchors.push(...rows.filter((row) => row.top < viewport.top).reverse());
+  return anchors;
+}
+function timelineAnchorCorrection(scroller, anchors) {
+  let blocks;
+  const groups = Array.from(scroller.querySelectorAll("[data-og-group-key]"));
+  for (const anchor of anchors) {
+    let element;
+    if (scroller.contains(anchor.element) && (!anchor.text || anchor.element.textContent === anchor.text)) {
+      element = anchor.element;
+    } else if (anchor.key) {
+      element = groups.find((group) => group.getAttribute("data-og-group-key") === anchor.key);
+    } else if (anchor.text) {
+      blocks ??= Array.from(scroller.querySelectorAll("p, li, pre, h1, h2, h3, h4"));
+      const matches = blocks.filter((block) => block.textContent === anchor.text);
+      if (matches.length === 1) element = matches[0];
+    }
+    if (element) return element.getBoundingClientRect().top - anchor.top;
+  }
+  return null;
+}
+
 // src/components/tip-follow.ts
 var _t = (ms) => ms * MOTION_INSPECT_SCALE;
 var _s = (pxPerSec) => pxPerSec / MOTION_INSPECT_SCALE;
@@ -6046,6 +6155,8 @@ function tipFollowStep(state, input) {
 var MACHINE_INPUT_META = {
   scheduled_occurrence: "Scheduled update",
   goal_continuation: "Goal continued",
+  background_command_result: "Command result received",
+  session_wait_timeout: "Wait ended",
   agent_message: "Agent update",
   agent_steer_instruction: "Agent direction",
   child_terminal_result: "Agent finished",
@@ -6066,6 +6177,10 @@ function machineInputBatchLabel(members) {
     const kind = members[0].kind;
     const n = members.length;
     switch (kind) {
+      case "background_command_result":
+        return n === 1 ? "Command result received" : `${n} command results received`;
+      case "session_wait_timeout":
+        return n === 1 ? "Wait ended" : `${n} waits ended`;
       case "child_terminal_result":
         return n === 1 ? "Agent finished" : `${n} agents finished`;
       case "goal_continuation":
@@ -6230,8 +6345,13 @@ function MessageTimeline({
       (item) => item.kind !== "auth-needed" || shouldRenderAuthNeeded(item)
     );
   }, [items, events, shouldRenderAuthNeeded]);
-  const sourceItems = items || events;
+  const sourceItems = events ?? items;
   const olderBoundaryKey = sourceItems?.[0]?.id;
+  const previousSourceIdsRef = useRef10(/* @__PURE__ */ new Set());
+  const previousSourceBoundaryRef = useRef10(void 0);
+  const readingAnchorRef = useRef10(null);
+  const olderPageBudgetRef = useRef10(0);
+  const [olderDemand, setOlderDemand] = useState12(0);
   const allGroups = useMemo4(() => groupTimeline(resolvedItems), [resolvedItems]);
   const annotationSources = useMemo4(() => {
     const sources = /* @__PURE__ */ new Map();
@@ -6360,28 +6480,22 @@ function MessageTimeline({
       followFrameRef.current = null;
     }
   }, []);
-  const releasePinFromReader = useCallback2(
-    (node) => {
-      if (!autoFollow || !pinnedRef.current || hasNewerRef.current) {
-        return;
-      }
-      if (node && maxScrollOf(node) <= 1) {
-        return;
-      }
-      clearReaderIntent();
-      clearPendingReaderLeave();
-      stopFollow();
-      applyPinned(false);
-      if (wantPinRef.current) {
-        wantPinRef.current = false;
-      }
-      if (!olderPrefetchArmedRef.current) {
-        olderPrefetchArmedRef.current = true;
-        setOlderPrefetchArmed(true);
-      }
-    },
-    [autoFollow, applyPinned, clearPendingReaderLeave, clearReaderIntent, stopFollow]
-  );
+  const releasePinFromReader = useCallback2(() => {
+    if (!autoFollow || !pinnedRef.current || hasNewerRef.current) {
+      return;
+    }
+    clearReaderIntent();
+    clearPendingReaderLeave();
+    stopFollow();
+    applyPinned(false);
+    if (wantPinRef.current) {
+      wantPinRef.current = false;
+    }
+    if (!olderPrefetchArmedRef.current) {
+      olderPrefetchArmedRef.current = true;
+      setOlderPrefetchArmed(true);
+    }
+  }, [autoFollow, applyPinned, clearPendingReaderLeave, clearReaderIntent, stopFollow]);
   const releasePinAfterScrollSettled = useCallback2(
     (node) => {
       if (!autoFollow || !pinnedRef.current || hasNewerRef.current) {
@@ -6397,7 +6511,7 @@ function MessageTimeline({
         clearPendingReaderLeave();
         return;
       }
-      releasePinFromReader(node);
+      releasePinFromReader();
       rearmOlderPrefetchAfterLeavingTop(node);
     },
     [autoFollow, clearPendingReaderLeave, rearmOlderPrefetchAfterLeavingTop, releasePinFromReader]
@@ -6415,6 +6529,16 @@ function MessageTimeline({
       }
     });
   }, [cancelLeaveFallback, releasePinAfterScrollSettled]);
+  const requestEarlierFromReader = () => {
+    releasePinFromReader();
+    wantPinRef.current = false;
+    olderPageBudgetRef.current = 8;
+    if (olderLoadAttemptRef.current?.[1] === 2) {
+      olderLoadAttemptRef.current = null;
+      setOlderDemand((value) => value + 1);
+    }
+  };
+  const touchPositionRef = useRef10(null);
   const onWheel = (event) => {
     if (Math.abs(event.deltaY) <= Math.abs(event.deltaX)) {
       return;
@@ -6423,11 +6547,11 @@ function MessageTimeline({
       return;
     }
     disclosureKeepsUnpinnedRef.current = false;
+    programmaticScrollRef.current = 0;
     if (event.deltaY >= 0) {
       return;
     }
-    const node = event.currentTarget instanceof HTMLElement ? event.currentTarget : scrollRef.current;
-    releasePinFromReader(node);
+    requestEarlierFromReader();
   };
   const onPointerDown = (event) => {
     if (event.button && event.pointerType === "mouse") {
@@ -6448,8 +6572,8 @@ function MessageTimeline({
     if (event.key !== "ArrowUp" && event.key !== "PageUp" && event.key !== "Home") {
       return;
     }
-    const node = event.currentTarget instanceof HTMLElement ? event.currentTarget : scrollRef.current;
-    releasePinFromReader(node);
+    programmaticScrollRef.current = 0;
+    requestEarlierFromReader();
   };
   const snapToBottom = useCallback2(
     (node) => {
@@ -6697,10 +6821,21 @@ function MessageTimeline({
     const previousMaxScroll = lastMaxScrollRef.current;
     const wasAtLiveTailBeforeCommit = previousMaxScroll <= 1 || previousMaxScroll - previousScrollTop < Math.min(PIN_THRESHOLD_PX, previousMaxScroll);
     const firstItemChanged = !!previousFirstItemId && firstItemId !== previousFirstItemId;
-    const prepended = firstItemChanged && resolvedItems.some((item) => item.id === previousFirstItemId);
+    const sourceChanged = olderBoundaryKey !== previousSourceBoundaryRef.current;
+    const retainedSource = sourceItems?.some((item) => previousSourceIdsRef.current.has(item.id)) ?? false;
+    const prepended = sourceChanged && retainedSource;
+    previousSourceBoundaryRef.current = olderBoundaryKey;
+    previousSourceIdsRef.current = new Set(sourceItems?.map((item) => item.id));
+    const readingAnchor = readingAnchorRef.current;
+    readingAnchorRef.current = null;
     const attempt = olderLoadAttemptRef.current;
-    const committedZeroOverlapOlderReplacement = !!(attempt?.[2]?.committed && firstItemChanged && !prepended);
+    const committedZeroOverlapOlderReplacement = !!(attempt?.[2]?.committed && sourceChanged && !retainedSource);
     const restorePrependAnchor = () => {
+      const correction = readingAnchor && timelineAnchorCorrection(node, readingAnchor);
+      if (correction != null) {
+        if (Math.abs(correction) > 1) writeScrollTop(node, node.scrollTop + correction);
+        return;
+      }
       let delta = null;
       if (previousFirstItemId && previousItemContentTop != null) {
         const itemEl = node.querySelector(
@@ -6806,6 +6941,11 @@ function MessageTimeline({
       return;
     }
     olderLoadAttemptRef.current = [olderBoundaryKey, 2];
+    if (attempt[2]?.committed && !pinnedRef.current && hasOlder && node.scrollTop <= OLDER_PREFETCH_MARGIN_PX && olderPageBudgetRef.current > 0) {
+      olderPageBudgetRef.current -= 1;
+      olderLoadAttemptRef.current = null;
+      setOlderDemand((value) => value + 1);
+    }
     rearmOlderPrefetchAfterLeavingTop(node);
     requestOlderIfUnderfilled(node);
   });
@@ -6935,6 +7075,7 @@ function MessageTimeline({
     loadingOlder,
     olderBoundaryKey,
     olderPrefetchArmed,
+    olderDemand,
     onLoadOlder,
     requestOlderIfUnderfilled
   ]);
@@ -7072,7 +7213,7 @@ function MessageTimeline({
       }
       if (readerArmed && cumulativeReaderUp > TIP_FOLLOW_READER_UP_EPS_PX && !nearBottomPinned) {
         clearReaderIntent();
-        releasePinFromReader(node);
+        requestEarlierFromReader();
         rearmOlderPrefetchAfterLeavingTop(node);
         return;
       }
@@ -7087,10 +7228,13 @@ function MessageTimeline({
       return;
     }
     syncScrollBaseline(node);
+    if (programmatic) {
+      return;
+    }
     const nearBottom = isNearBottom(node);
     const inserted = Math.max(0, nextMaxScroll - previousMaxScroll);
     const towardTip = nextTop - previousTop - inserted;
-    const nextPinned = !hasNewer && nearBottom && towardTip >= -TIP_FOLLOW_READER_UP_EPS_PX && inserted <= 1;
+    const nextPinned = !hasNewer && nearBottom && towardTip > 0.5 && inserted <= 1;
     if (!nextPinned) {
       stopFollow();
     }
@@ -7146,118 +7290,163 @@ function MessageTimeline({
         onScroll,
         onScrollEnd,
         onWheel,
+        onTouchStart: (event) => {
+          const touch = event.touches.length === 1 ? event.touches[0] : void 0;
+          touchPositionRef.current = touch ? { x: touch.clientX, y: touch.clientY } : null;
+        },
+        onTouchMove: (event) => {
+          const touch = event.touches[0];
+          const previous = touchPositionRef.current;
+          if (!touch || !previous || event.touches.length !== 1) {
+            touchPositionRef.current = null;
+            return;
+          }
+          const deltaX = previous.x - touch.clientX;
+          const deltaY = previous.y - touch.clientY;
+          if (Math.max(Math.abs(deltaX), Math.abs(deltaY)) < 4) return;
+          touchPositionRef.current = { x: touch.clientX, y: touch.clientY };
+          onWheel({
+            deltaX,
+            deltaY,
+            target: event.target,
+            currentTarget: event.currentTarget
+          });
+        },
+        onTouchEnd: () => {
+          touchPositionRef.current = null;
+        },
+        onTouchCancel: () => {
+          touchPositionRef.current = null;
+        },
+        onClickCapture: (event) => {
+          const target = event.target instanceof Element ? event.target.closest("button[aria-expanded]") : null;
+          if (target) {
+            releasePinFromReader();
+            disclosureKeepsUnpinnedRef.current = true;
+          }
+        },
         onPointerDown,
         onKeyDown,
         style: groups.length > 0 && !revealed ? { visibility: "hidden" } : void 0,
         className: cn(
           // tabIndex=-1 is programmatic only — never paint a focus ring on
           // the whole scroller (click + Shift used to flash a blue outline).
-          "min-h-0 flex-1 overflow-y-auto overscroll-contain px-4 py-6 sm:px-6 outline-hidden",
+          "min-h-0 flex-1 overflow-y-auto overscroll-contain px-4 pt-16 pb-6 sm:px-6 outline-hidden",
           autoFollow && pinned && !hasNewer ? "[overflow-anchor:none]" : "[overflow-anchor:auto]"
         ),
-        children: /* @__PURE__ */ jsxs11("div", { className: "relative mx-auto flex w-full max-w-3xl flex-col gap-5", children: [
-          !groups.length ? emptyState ?? /* @__PURE__ */ jsx16("p", { className: "py-10 text-center text-og-menu text-og-fg-subtle", children: "No activity yet." }) : null,
-          hasOlder && olderPrefetchArmed ? (
-            // Overlaid, not a layout row: mounting/unmounting the sentinel
-            // must never shift content (that shift was itself a wobble).
-            /* @__PURE__ */ jsx16(
-              "div",
-              {
-                ref: topSentinelRef,
-                "data-og-top-sentinel": "",
-                "data-og-timeline-chrome": "",
-                "aria-hidden": "true",
-                className: "pointer-events-none absolute inset-x-0 top-0 h-px"
-              }
-            )
-          ) : null,
-          groups.map(({ group, key, entranceEnabled }, index) => {
-            return /* @__PURE__ */ jsx16(
-              TimelineGroupEntry,
-              {
-                groupKey: key,
-                group,
-                nextGroup: groups[index + 1]?.group,
-                entranceEnabled,
-                liveEntranceEnabled: group.kind === "activity" ? !bulkRender : void 0,
-                context: timelineGroupEntryContext
-              },
-              key
-            );
-          }),
-          groups.length > 0 && trailingState ? /* @__PURE__ */ jsx16("div", { "data-og-timeline-trailing-state": "", children: trailingState }) : null,
-          hasNewer ? /* @__PURE__ */ jsx16(
-            "div",
-            {
-              ref: bottomSentinelRef,
-              "data-og-bottom-sentinel": "",
-              "data-og-timeline-chrome": "",
-              "aria-hidden": "true",
-              className: "h-px w-full"
-            }
-          ) : null
-        ] })
+        children: /* @__PURE__ */ jsx16(
+          TimelineBeforeLayout,
+          {
+            capture: () => {
+              readingAnchorRef.current = !pinnedRef.current && scrollRef.current ? captureTimelineAnchor(scrollRef.current) : null;
+            },
+            children: /* @__PURE__ */ jsxs11("div", { className: "relative mx-auto flex w-full max-w-3xl flex-col gap-5", children: [
+              /* @__PURE__ */ jsx16(AnimatePresence, { children: loadingOlder || loadingOldest || hasOlder && onJumpToStart && olderPrefetchArmed || underfillRetryReady ? (
+                // Reserved top gutter: controls scroll with history and cannot
+                // cover a disclosure. Visibility never changes content height.
+                /* @__PURE__ */ jsxs11(
+                  motion.div,
+                  {
+                    initial: { opacity: 0, y: -6 },
+                    animate: { opacity: 1, y: 0 },
+                    exit: { opacity: 0, y: -6 },
+                    transition: { duration: 0.15, ease: "easeOut" },
+                    "data-og-loading-older": "",
+                    "aria-live": "polite",
+                    className: "pointer-events-none absolute inset-x-0 -top-11 z-10 flex justify-center",
+                    children: [
+                      loadingOlder || loadingOldest ? /* @__PURE__ */ jsx16("span", { className: LOADING_CHIP_CLASS, children: /* @__PURE__ */ jsx16("span", { className: "og-shimmer-text", children: loadingOldest ? "Jumping to start\u2026" : "Loading earlier activity\u2026" }) }) : null,
+                      hasOlder && !loadingOlder && !loadingOldest && (underfillRetryReady || onJumpToStart) ? /* @__PURE__ */ jsx16(
+                        "button",
+                        {
+                          type: "button",
+                          "data-og-retry": underfillRetryReady || void 0,
+                          "data-og-jump-to-start": !underfillRetryReady || void 0,
+                          onClick: () => {
+                            const node = scrollRef.current;
+                            if (underfillRetryReady) {
+                              if (node && underfillRetryReadyRef.current) {
+                                requestOlderIfUnderfilled(node, underfillSettledAttempt);
+                              }
+                              return;
+                            }
+                            applyPinned(false);
+                            pendingJumpToStartRef.current = true;
+                            const seq = ++jumpToStartSeqRef.current;
+                            void Promise.resolve(onJumpToStart()).then(
+                              () => {
+                                const scroller = scrollRef.current ?? node;
+                                if (scroller) {
+                                  scroller.scrollTop = 0;
+                                }
+                                requestFrame(() => {
+                                  if (jumpToStartSeqRef.current === seq) {
+                                    pendingJumpToStartRef.current = false;
+                                  }
+                                });
+                              },
+                              () => {
+                                if (jumpToStartSeqRef.current === seq) {
+                                  pendingJumpToStartRef.current = false;
+                                }
+                              }
+                            );
+                          },
+                          className: "pointer-events-auto rounded-full border border-og-border px-3 py-1.5 text-og-control",
+                          children: underfillRetryReady ? "Retry earlier activity" : "Jump to start"
+                        }
+                      ) : null
+                    ]
+                  }
+                )
+              ) : null }),
+              !groups.length ? emptyState ?? /* @__PURE__ */ jsx16("p", { className: "py-10 text-center text-og-menu text-og-fg-subtle", children: "No activity yet." }) : null,
+              hasOlder && olderPrefetchArmed ? (
+                // Overlaid, not a layout row: mounting/unmounting the sentinel
+                // must never shift content (that shift was itself a wobble).
+                // End at the scroll origin above the pt-16 gutter so the
+                // observer and scrollTop cooldown share the same 400px band.
+                /* @__PURE__ */ jsx16(
+                  "div",
+                  {
+                    ref: topSentinelRef,
+                    "data-og-top-sentinel": "",
+                    "data-og-timeline-chrome": "",
+                    "aria-hidden": "true",
+                    className: "pointer-events-none absolute inset-x-0 -top-16 h-px -translate-y-full"
+                  }
+                )
+              ) : null,
+              groups.map(({ group, key, entranceEnabled }, index) => {
+                return /* @__PURE__ */ jsx16(
+                  TimelineGroupEntry,
+                  {
+                    groupKey: key,
+                    group,
+                    nextGroup: groups[index + 1]?.group,
+                    entranceEnabled,
+                    liveEntranceEnabled: group.kind === "activity" ? !bulkRender : void 0,
+                    context: timelineGroupEntryContext
+                  },
+                  key
+                );
+              }),
+              groups.length > 0 && trailingState ? /* @__PURE__ */ jsx16("div", { "data-og-timeline-trailing-state": "", children: trailingState }) : null,
+              hasNewer ? /* @__PURE__ */ jsx16(
+                "div",
+                {
+                  ref: bottomSentinelRef,
+                  "data-og-bottom-sentinel": "",
+                  "data-og-timeline-chrome": "",
+                  "aria-hidden": "true",
+                  className: "h-px w-full"
+                }
+              ) : null
+            ] })
+          }
+        )
       }
     ),
-    /* @__PURE__ */ jsx16(AnimatePresence, { children: loadingOlder || loadingOldest || hasOlder && onJumpToStart && olderPrefetchArmed || underfillRetryReady ? (
-      // Floating over the scroller (not a timeline row) so showing and
-      // hiding it never reflows history under the reader.
-      /* @__PURE__ */ jsxs11(
-        motion.div,
-        {
-          initial: { opacity: 0, y: -6 },
-          animate: { opacity: 1, y: 0 },
-          exit: { opacity: 0, y: -6 },
-          transition: { duration: 0.15, ease: "easeOut" },
-          "data-og-loading-older": "",
-          "aria-live": "polite",
-          className: "absolute inset-x-0 top-3 z-10 flex justify-center",
-          children: [
-            loadingOlder || loadingOldest ? /* @__PURE__ */ jsx16("span", { className: LOADING_CHIP_CLASS, children: /* @__PURE__ */ jsx16("span", { className: "og-shimmer-text", children: loadingOldest ? "Jumping to start\u2026" : "Loading earlier activity\u2026" }) }) : null,
-            hasOlder && !loadingOlder && !loadingOldest && (underfillRetryReady || onJumpToStart) ? /* @__PURE__ */ jsx16(
-              "button",
-              {
-                type: "button",
-                "data-og-retry": underfillRetryReady || void 0,
-                "data-og-jump-to-start": !underfillRetryReady || void 0,
-                onClick: () => {
-                  const node = scrollRef.current;
-                  if (underfillRetryReady) {
-                    if (node && underfillRetryReadyRef.current) {
-                      requestOlderIfUnderfilled(node, underfillSettledAttempt);
-                    }
-                    return;
-                  }
-                  applyPinned(false);
-                  pendingJumpToStartRef.current = true;
-                  const seq = ++jumpToStartSeqRef.current;
-                  void Promise.resolve(onJumpToStart()).then(
-                    () => {
-                      const scroller = scrollRef.current ?? node;
-                      if (scroller) {
-                        scroller.scrollTop = 0;
-                      }
-                      requestFrame(() => {
-                        if (jumpToStartSeqRef.current === seq) {
-                          pendingJumpToStartRef.current = false;
-                        }
-                      });
-                    },
-                    () => {
-                      if (jumpToStartSeqRef.current === seq) {
-                        pendingJumpToStartRef.current = false;
-                      }
-                    }
-                  );
-                },
-                className: "rounded-full border border-og-border px-3 py-1.5 text-og-control",
-                children: underfillRetryReady ? "Retry earlier activity" : "Jump to start"
-              }
-            ) : null
-          ]
-        }
-      )
-    ) : null }),
     /* @__PURE__ */ jsx16(AnimatePresence, { children: loadingNewer ? /* @__PURE__ */ jsx16(
       motion.div,
       {
@@ -7387,7 +7576,7 @@ function cancelFrame(id) {
 function timelineRenderResetKeysChanged(previous, next) {
   return previous.length !== next.length || previous.some((key, index) => !Object.is(key, next[index]));
 }
-var TimelineGroupRenderBoundary = class extends Component2 {
+var TimelineGroupRenderBoundary = class extends Component3 {
   state = {
     failed: false,
     resetKeys: this.props.resetKeys
@@ -7848,7 +8037,7 @@ function CompactionRow({ item }) {
   const after = item.estimatedTokensAfter != null ? Math.round(item.estimatedTokensAfter).toLocaleString("en-US") : null;
   const title = item.phase === "started" ? "Compacting conversation history\u2026" : item.phase === "compacted" ? before && after ? `Conversation history compacted \xB7 ~${before} \u2192 ~${after} estimated history tokens` : "Conversation history compacted" : "Couldn\u2019t compact conversation history";
   const subtitle = item.phase === "compacted" ? "Chat history above is unchanged" : item.phase === "skipped" ? compactionSkipSubtitle(item.skipReason) : null;
-  const pill = item.phase === "skipped" && item.skipReason === "summarization_failed" ? "border-og-status-failed/35 bg-og-status-failed/10 text-og-status-failed" : item.phase === "started" ? WAITING_PILL_CLASS : "border-og-border bg-og-surface-1 text-og-fg-muted";
+  const pill = item.phase === "skipped" && item.skipReason === "summarization_failed" ? "border-og-status-failed/35 bg-og-status-failed/10 text-og-status-failed" : item.phase === "started" ? WAITING_PILL_CLASS : NEUTRAL_PILL;
   return /* @__PURE__ */ jsx16("div", { className: cn(enter && "animate-og-enter", "flex justify-center"), children: /* @__PURE__ */ jsxs11(
     "div",
     {
@@ -8194,35 +8383,38 @@ function SessionStatusRow({ item }) {
   );
 }
 var NEUTRAL_PILL = "border-og-border bg-og-surface-1 text-og-fg-muted";
-var GOAL_META = {
-  set: {
-    label: "Goal set",
-    pill: "border-og-accent/30 bg-og-accent/10 text-og-accent",
-    icon: TargetIcon2
-  },
-  updated: { label: "Goal updated", pill: NEUTRAL_PILL, icon: PencilLineIcon },
-  completed: {
-    label: "Goal completed",
-    pill: "border-og-status-idle/30 bg-og-status-idle/10 text-og-status-idle",
-    icon: CheckIcon2
-  },
-  paused: {
-    label: "Goal paused",
-    pill: WAITING_PILL_CLASS,
-    icon: PauseIcon
-  },
-  resumed: { label: "Goal resumed", pill: NEUTRAL_PILL, icon: PlayIcon },
-  cleared: { label: "Goal cleared", pill: NEUTRAL_PILL, icon: Trash2Icon },
-  held: {
-    label: "Goal held",
-    pill: WAITING_PILL_CLASS,
-    icon: PauseCircleIcon
-  },
-  continuation: { label: "Continuing toward the goal", pill: NEUTRAL_PILL, icon: ArrowRightIcon2 }
-};
+function goalMeta(action) {
+  const metadata = {
+    set: {
+      label: "Goal set",
+      pill: "border-og-accent/30 bg-og-accent/10 text-og-accent",
+      icon: TargetIcon2
+    },
+    updated: { label: "Goal updated", pill: NEUTRAL_PILL, icon: PencilLineIcon },
+    completed: {
+      label: "Goal completed",
+      pill: "border-og-status-idle/30 bg-og-status-idle/10 text-og-status-idle",
+      icon: CheckIcon2
+    },
+    paused: {
+      label: "Goal paused",
+      pill: WAITING_PILL_CLASS,
+      icon: PauseIcon
+    },
+    resumed: { label: "Goal resumed", pill: NEUTRAL_PILL, icon: PlayIcon },
+    cleared: { label: "Goal cleared", pill: NEUTRAL_PILL, icon: Trash2Icon },
+    held: {
+      label: "Goal held",
+      pill: WAITING_PILL_CLASS,
+      icon: PauseCircleIcon
+    },
+    continuation: { label: "Continuing toward the goal", pill: NEUTRAL_PILL, icon: ArrowRightIcon2 }
+  };
+  return metadata[action];
+}
 function GoalRow({ item }) {
   const enter = useEntranceAnimation();
-  const { label, pill, icon: Icon } = GOAL_META[item.action];
+  const { label, pill, icon: Icon } = goalMeta(item.action);
   return /* @__PURE__ */ jsx16("div", { className: cn(enter && "animate-og-enter", "flex justify-center"), children: /* @__PURE__ */ jsxs11(
     "span",
     {
@@ -8259,35 +8451,49 @@ function MachineInputBatchRow({
   const singleSummary = single ? cleanMachineInputSummary(single.summary) : "";
   const showCollapsedSummary = single != null && machineInputSummaryIsUseful(single.kind, singleSummary);
   return /* @__PURE__ */ jsxs11("div", { className: cn(enter && "animate-og-enter", "flex flex-col items-center gap-1.5"), children: [
-    /* @__PURE__ */ jsxs11("details", { className: "group w-full max-w-full", "data-og-machine-input-batch": "", children: [
-      /* @__PURE__ */ jsx16("summary", { className: "flex cursor-pointer list-none justify-center [&::-webkit-details-marker]:hidden", children: /* @__PURE__ */ jsxs11(
-        "span",
-        {
-          className: cn(
-            "inline-flex max-w-full items-center gap-1.5 rounded-full border px-3 py-1 text-og-sm",
-            NEUTRAL_PILL
-          ),
-          children: [
-            /* @__PURE__ */ jsx16(
-              ChevronRightIcon3,
+    /* @__PURE__ */ jsxs11(
+      "details",
+      {
+        className: "group w-full max-w-full",
+        "data-og-machine-input-batch": "",
+        title: `Received ${formatClockTime(item.occurredAt)}`,
+        children: [
+          /* @__PURE__ */ jsx16("summary", { className: "flex cursor-pointer list-none justify-center [&::-webkit-details-marker]:hidden", children: /* @__PURE__ */ jsxs11(
+            "span",
+            {
+              className: cn(
+                "inline-flex max-w-full items-center gap-1.5 rounded-full border px-3 py-1 text-og-sm",
+                NEUTRAL_PILL
+              ),
+              children: [
+                /* @__PURE__ */ jsx16(
+                  ChevronRightIcon3,
+                  {
+                    "aria-hidden": true,
+                    className: "size-3.5 shrink-0 transition-transform group-open:rotate-90"
+                  }
+                ),
+                /* @__PURE__ */ jsx16("span", { className: "truncate", children: label })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ jsxs11("div", { className: "mx-auto mt-2 w-full max-w-lg space-y-2 border-t border-og-border/50 pt-2", children: [
+            /* @__PURE__ */ jsxs11("p", { className: "text-og-xs text-og-fg-subtle", children: [
+              "Received ",
+              /* @__PURE__ */ jsx16("time", { dateTime: item.occurredAt, children: formatClockTime(item.occurredAt) })
+            ] }),
+            item.members.map((member) => /* @__PURE__ */ jsx16(
+              MachineInputRow,
               {
-                "aria-hidden": true,
-                className: "size-3.5 shrink-0 transition-transform group-open:rotate-90"
-              }
-            ),
-            /* @__PURE__ */ jsx16("span", { className: "truncate", children: label })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsx16("div", { className: "mx-auto mt-2 w-full max-w-lg space-y-2 border-t border-og-border/50 pt-2", children: item.members.map((member) => /* @__PURE__ */ jsx16(
-        MachineInputRow,
-        {
-          member,
-          loadVideoArtifactPlayback
-        },
-        member.id
-      )) })
-    ] }),
+                member,
+                loadVideoArtifactPlayback
+              },
+              member.id
+            ))
+          ] })
+        ]
+      }
+    ),
     showCollapsedSummary ? /* @__PURE__ */ jsx16("p", { className: "max-w-lg px-3 text-center text-og-xs leading-4 text-og-fg-subtle", children: truncate(singleSummary, 160) }) : null
   ] });
 }
@@ -8386,7 +8592,7 @@ function formatVideoDuration(seconds) {
 }
 function NoticeRow({ item }) {
   const enter = useEntranceAnimation();
-  const tone = item.tone === "failed" ? "border-og-status-failed/35 bg-og-status-failed/10 text-og-status-failed" : item.tone === "waiting" ? WAITING_PILL_CLASS : "border-og-border bg-og-surface-1 text-og-fg-muted";
+  const tone = item.tone === "failed" ? "border-og-status-failed/35 bg-og-status-failed/10 text-og-status-failed" : item.tone === "waiting" ? WAITING_PILL_CLASS : NEUTRAL_PILL;
   return /* @__PURE__ */ jsxs11(
     "div",
     {
@@ -8395,7 +8601,8 @@ function NoticeRow({ item }) {
         "flex items-start gap-2.5 rounded-og-md border px-3.5 py-2.5 text-og-menu",
         tone
       ),
-      role: "status",
+      role: item.recordedOutcome ? "note" : "status",
+      "data-og-recorded-outcome": item.recordedOutcome ? "wait" : void 0,
       children: [
         /* @__PURE__ */ jsx16(
           TriangleAlertIcon2,
@@ -8404,6 +8611,14 @@ function NoticeRow({ item }) {
           }
         ),
         /* @__PURE__ */ jsxs11("div", { className: "min-w-0 flex-1", children: [
+          item.recordedOutcome ? /* @__PURE__ */ jsxs11("p", { className: "mb-1 text-og-control font-medium", children: [
+            "Wait recorded",
+            " ",
+            /* @__PURE__ */ jsx16("time", { dateTime: item.occurredAt, children: new Date(item.occurredAt).toLocaleString(void 0, {
+              dateStyle: "medium",
+              timeStyle: "short"
+            }) })
+          ] }) : null,
           /* @__PURE__ */ jsx16("span", { className: "whitespace-pre-wrap break-words", children: item.text }),
           item.details ? /* @__PURE__ */ jsxs11("details", { className: "mt-2 text-og-control", children: [
             /* @__PURE__ */ jsx16("summary", { className: "cursor-pointer font-medium", children: item.details.label }),
@@ -8636,8 +8851,377 @@ function QueueSurfaceFallback() {
   );
 }
 
+// src/hooks/use-available-models.ts
+import { useCallback as useCallback3 } from "react";
+function useAvailableModels(options = {}) {
+  const client = useOpenGeniClient(options);
+  const load = useCallback3(
+    async (signal) => await client.getClientConfig({ signal }),
+    [client]
+  );
+  const state = usePolledValue(load, {
+    pollIntervalMs: options.pollIntervalMs,
+    enabled: options.enabled
+  });
+  return {
+    models: state.data?.models ?? [],
+    defaultModel: state.data?.defaultModel ?? null,
+    loading: state.loading,
+    error: state.error,
+    refresh: state.refresh
+  };
+}
+function useWorkspaceModelCatalog(options) {
+  const client = useOpenGeniClient(options);
+  const load = useCallback3(
+    async (signal) => {
+      if (!options.workspaceId) {
+        return { models: [], defaultModel: null };
+      }
+      const [catalog, config] = await Promise.all([
+        client.getWorkspaceModelCatalog(options.workspaceId, { signal }),
+        client.getClientConfig({ signal })
+      ]);
+      return {
+        models: catalog.models,
+        defaultModel: config.defaultModel
+      };
+    },
+    [client, options.workspaceId]
+  );
+  const state = usePolledValue(load, {
+    pollIntervalMs: options.pollIntervalMs,
+    enabled: options.enabled !== false && Boolean(options.workspaceId)
+  });
+  const rows = sortPickerRows(projectPickerRows(state.data?.models ?? []));
+  return {
+    models: state.data?.models ?? [],
+    rows,
+    defaultModel: state.data?.defaultModel ?? null,
+    loading: state.loading,
+    error: state.error,
+    refresh: state.refresh
+  };
+}
+
+// src/components/chat-composer.tsx
+import { LayoutGroup, motion as motion2 } from "motion/react";
+import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+function ChatComposer({
+  composer,
+  responsiveBasis,
+  effectiveControl,
+  queuedAheadCount,
+  canControlWorkspace,
+  controlLinks,
+  placeholder,
+  disabled,
+  autoFocus,
+  hint,
+  controlsLeading,
+  controlsStart,
+  actionsStart,
+  attachButtonClassName,
+  transcription,
+  transcriptionClassName,
+  transcriptionSuppressed = false,
+  header,
+  onPaste,
+  attachments,
+  models,
+  selectedModel,
+  onSelectModel,
+  className,
+  commands,
+  commandContext,
+  onClearView,
+  messages
+}) {
+  const controller = useChatComposerController({
+    delivery: composer,
+    draft: composer,
+    control: composer,
+    effectiveControl,
+    queuedAheadCount,
+    canControlWorkspace,
+    controlLinks,
+    disabled,
+    attachments,
+    commands,
+    commandContext,
+    onClearView,
+    onPaste,
+    messages
+  });
+  const hasControls = Boolean(
+    attachments || models || controlsLeading || controlsStart || transcription
+  );
+  const stackActions = hasControls && Boolean(actionsStart);
+  return /* @__PURE__ */ jsx18(Fragment6, { children: /* @__PURE__ */ jsxs13(Root, { controller, responsiveBasis, className, children: [
+    /* @__PURE__ */ jsxs13(Frame, { children: [
+      /* @__PURE__ */ jsx18(CommandPalette, {}),
+      /* @__PURE__ */ jsxs13(Surface, { children: [
+        /* @__PURE__ */ jsx18(PausedState, {}),
+        /* @__PURE__ */ jsx18(RestoredResources, {}),
+        /* @__PURE__ */ jsx18(Attachments, {}),
+        header,
+        composer.annotations && composer.annotations.length > 0 ? /* @__PURE__ */ jsx18("div", { className: "px-3 pt-2 sm:px-4", children: /* @__PURE__ */ jsx18(
+          TimelineAnnotationsChip,
+          {
+            annotations: composer.annotations,
+            editable: true,
+            focusAnnotationId: composer.annotationReviewTargetId,
+            onFocusConsumed: composer.clearAnnotationReviewTarget,
+            onUpdate: composer.updateAnnotation,
+            onRemove: composer.removeAnnotation
+          }
+        ) }) : null,
+        /* @__PURE__ */ jsx18(Input, { placeholder, autoFocus }),
+        controller.confirmState ? /* @__PURE__ */ jsx18(Confirmation, {}) : /* @__PURE__ */ jsx18(
+          Footer,
+          {
+            "data-og-stack-actions": stackActions ? "" : void 0,
+            className: stackActions ? "max-sm:flex-nowrap sm:flex-wrap" : void 0,
+            children: /* @__PURE__ */ jsxs13(LayoutGroup, { id: "og-composer-footer", children: [
+              hasControls ? /* @__PURE__ */ jsxs13(
+                Controls,
+                {
+                  className: stackActions ? "min-w-0 max-sm:flex-1 sm:w-auto" : void 0,
+                  children: [
+                    controlsLeading,
+                    /* @__PURE__ */ jsx18(AttachButton, { className: attachButtonClassName }),
+                    transcription ? /* @__PURE__ */ jsx18(
+                      ComposerTranscriptionControl,
+                      {
+                        ...transcription,
+                        suppressed: transcriptionSuppressed,
+                        className: [transcription.className, transcriptionClassName].filter(Boolean).join(" ")
+                      }
+                    ) : null,
+                    models ? /* @__PURE__ */ jsx18(
+                      motion2.span,
+                      {
+                        layout: true,
+                        transition: { duration: 0.36, ease: [0.22, 1, 0.36, 1] },
+                        className: "inline-flex min-w-0",
+                        children: /* @__PURE__ */ jsx18(
+                          ModelPicker,
+                          {
+                            models,
+                            value: selectedModel,
+                            onChange: onSelectModel
+                          }
+                        )
+                      }
+                    ) : null,
+                    controlsStart ? /* @__PURE__ */ jsx18(
+                      motion2.span,
+                      {
+                        layout: true,
+                        transition: { duration: 0.36, ease: [0.22, 1, 0.36, 1] },
+                        className: "inline-flex min-w-0 flex-1 items-center gap-1.5",
+                        children: controlsStart
+                      }
+                    ) : null
+                  ]
+                }
+              ) : /* @__PURE__ */ jsx18(Hint, { children: hint }),
+              /* @__PURE__ */ jsxs13(
+                Actions,
+                {
+                  className: stackActions ? "max-sm:shrink-0 sm:w-auto sm:justify-end" : void 0,
+                  children: [
+                    actionsStart,
+                    /* @__PURE__ */ jsx18(PauseButton, {}),
+                    /* @__PURE__ */ jsx18(SendButton, {})
+                  ]
+                }
+              )
+            ] })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx18(Help, {}),
+    /* @__PURE__ */ jsx18(Status, {})
+  ] }) });
+}
+
+// src/components/session-conversation.tsx
+import { useRef as useRef11 } from "react";
+
+// src/conversation-timeline.ts
+function conversationTimeline(items, queue, composer) {
+  const queued = new Set(
+    queue.queue.filter((turn) => turn.metadata.delivery !== "steer").map((turn) => turn.triggerEventId)
+  );
+  const pending = composer.optimisticMessages ?? [];
+  const pendingQueue = new Set(
+    pending.filter(
+      (message) => message.destination === "queue" && !(message.turnId && message.appliedQueueVersion != null && queue.snapshot && queue.snapshot.version >= message.appliedQueueVersion && !queue.queue.some((turn) => turn.id === message.turnId))
+    ).map((message) => `user-message:${message.clientEventId}`)
+  );
+  const visible = items.filter(
+    (item) => item.kind !== "user-message" || !queued.has(item.id) && !pendingQueue.has(item.reconciliationKey ?? "")
+  );
+  const keys = new Set(
+    visible.flatMap((item) => item.kind === "user-message" ? [item.reconciliationKey] : [])
+  );
+  const optimistic = pending.filter(
+    (message) => !keys.has(`user-message:${message.clientEventId}`) && !queue.queue.some((turn) => turn.id === message.turnId)
+  ).map((message) => ({
+    kind: "user-message",
+    id: `optimistic:${message.clientEventId}`,
+    reconciliationKey: `user-message:${message.clientEventId}`,
+    text: message.text,
+    annotations: message.annotations.map((annotation, ordinal) => ({ ...annotation, ordinal })),
+    resources: message.resources,
+    tools: [],
+    occurredAt: message.occurredAt,
+    delivery: {
+      state: message.state,
+      ...message.error ? { error: message.error } : {},
+      ...message.state === "failed" ? {
+        onRetry: () => composer.retryOptimisticMessage?.(message.clientEventId),
+        onRemove: () => composer.removeOptimisticMessage?.(message.clientEventId)
+      } : {}
+    }
+  }));
+  const ids = new Set(visible.map((item) => item.id));
+  const steers = (queue.acceptedSteers ?? []).filter((steer) => !ids.has(steer.triggerEventId)).map((steer) => ({
+    kind: "user-message",
+    id: steer.triggerEventId,
+    text: steer.text,
+    annotations: steer.annotations,
+    resources: steer.resources,
+    tools: steer.tools,
+    occurredAt: steer.occurredAt,
+    delivery: { state: steer.state }
+  }));
+  return [...visible, ...optimistic, ...steers];
+}
+
+// src/components/session-conversation.tsx
+import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
+function SessionConversation(props) {
+  return /* @__PURE__ */ jsx19(Conversation, { ...props }, `${props.workspaceId ?? ""}:${props.sessionId}`);
+}
+function Conversation({
+  sessionId,
+  client,
+  workspaceId,
+  className,
+  height = "100%",
+  composerProps
+}) {
+  const scope = { client, workspaceId };
+  const context = useOpenGeni(scope);
+  const catalog = useWorkspaceModelCatalog({
+    client: context.client,
+    workspaceId: context.workspaceId
+  });
+  const feed = useSessionEvents(sessionId, scope);
+  const options = { ...scope, events: feed.events };
+  const detail = useSession(sessionId, options);
+  const queue = useTurnQueue(sessionId, options);
+  const human = useHumanInputRequests(sessionId, options);
+  const status = feed.sessionStatus ?? detail.session?.status;
+  const terminal = status === "cancelled";
+  const composer = useComposer(sessionId, {
+    ...options,
+    effectiveControl: queue.effectiveControl ?? detail.session?.effectiveControl,
+    sendDestination: () => queue.queue.length > 0 || status === "running" ? "queue" : "chat"
+  });
+  const region = useRef11(null);
+  const error = detail.error ?? feed.error ?? human.error;
+  return /* @__PURE__ */ jsxs14(
+    "div",
+    {
+      className: cn("og-root flex min-h-0 min-w-0 flex-col gap-2 overflow-hidden", className),
+      ref: region,
+      style: { height },
+      "data-og-conversation": "",
+      children: [
+        error && /* @__PURE__ */ jsx19("p", { role: "alert", children: error.message }),
+        /* @__PURE__ */ jsx19(
+          MessageTimeline,
+          {
+            className: "min-h-0 flex-1",
+            items: conversationTimeline(feed.timeline, queue, composer),
+            status,
+            hasOlder: feed.hasOlder,
+            loadingOlder: feed.loadingOlder,
+            onLoadOlder: feed.loadOlder,
+            hasNewer: feed.hasNewer,
+            loadingNewer: feed.loadingNewer,
+            onLoadNewer: () => {
+              void feed.loadNewer();
+            },
+            onJumpToStart: async () => {
+              await feed.loadOldest();
+            },
+            loadingOldest: feed.loadingOldest,
+            onJumpToLatest: feed.jumpToLatest,
+            onAnnotate: composer.addAnnotation
+          }
+        ),
+        /* @__PURE__ */ jsxs14("div", { className: "min-h-0 max-h-[40%] shrink-0 overflow-y-auto", "data-og-conversation-inputs": "", children: [
+          /* @__PURE__ */ jsx19(
+            HumanInputSurface,
+            {
+              requests: human.requests,
+              onSubmit: async (id, response) => {
+                await human.respond(id, response);
+              },
+              respondingRequestId: human.respondingRequestId,
+              error: human.mutationError?.message,
+              autoFocus: false
+            }
+          ),
+          terminal ? /* @__PURE__ */ jsx19(QueueSurface, { queue, readOnly: true }) : /* @__PURE__ */ jsx19(
+            QueueSurface,
+            {
+              queue,
+              composer,
+              onRequestComposerFocus: () => region.current?.querySelector("textarea")?.focus()
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx19("div", { className: "shrink-0", "data-og-conversation-composer": "", children: /* @__PURE__ */ jsx19(
+          ChatComposer,
+          {
+            ...composerProps,
+            composer,
+            disabled: terminal || composerProps?.disabled,
+            controlsStart: composerProps?.controlsStart ?? (composer.policy && /* @__PURE__ */ jsx19(
+              ModelPolicyPicker,
+              {
+                rows: catalog.rows,
+                model: composer.policy.model,
+                effort: composer.policy.reasoningEffort,
+                latencyMode: composer.policy.latencyMode,
+                loading: catalog.loading,
+                error: catalog.error?.message,
+                disabled: terminal,
+                sessionKey: sessionId,
+                onModelChange: (model) => composer.setModel?.(model),
+                onEffortChange: (effort) => composer.setReasoningEffort?.(effort),
+                onLatencyModeChange: (mode) => composer.setLatencyMode?.(mode)
+              }
+            )),
+            responsiveBasis: composerProps?.responsiveBasis ?? "container",
+            effectiveControl: composer.effectiveControl ?? queue.effectiveControl ?? detail.session?.effectiveControl,
+            queuedAheadCount: queue.queue.length
+          }
+        ) })
+      ]
+    }
+  );
+}
+
 // src/components/session-chrome.tsx
 import {
+  ActivityIcon,
   AudioLinesIcon,
   ArrowDownIcon as ArrowDownIcon2,
   ArrowUpIcon,
@@ -8650,17 +9234,19 @@ import {
   PencilIcon,
   PlayIcon as PlayIcon2,
   Trash2Icon as Trash2Icon2,
+  TerminalIcon as TerminalIcon2,
   TriangleAlertIcon as TriangleAlertIcon3,
   XIcon,
-  ZapIcon
+  CornerDownRightIcon,
+  TargetIcon as TargetIcon3
 } from "lucide-react";
-import { AnimatePresence as AnimatePresence2, motion as motion2, useReducedMotion } from "motion/react";
-import { useEffect as useEffect11, useId as useId3, useMemo as useMemo5, useRef as useRef11, useState as useState13 } from "react";
-import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+import { AnimatePresence as AnimatePresence2, motion as motion3, useReducedMotion } from "motion/react";
+import { useEffect as useEffect11, useId as useId3, useMemo as useMemo5, useRef as useRef12, useState as useState13 } from "react";
+import { Fragment as Fragment7, jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
 var GOAL_LABEL = {
   pursuing: "Pursuing",
   waiting: "Waiting",
-  scheduled: "Scheduled",
+  scheduled: "Waiting",
   blocked: "Blocked",
   held: "Held",
   paused: "Paused",
@@ -8691,8 +9277,8 @@ function sessionChromeGoalPillExplanation(state, record) {
   if (state === "paused") {
     return record?.pausedReason ? GOAL_PAUSED_REASON_EXPLANATION[record.pausedReason] ?? null : null;
   }
-  if (state === "scheduled" && continuation?.reason === "backoff_pending") {
-    return continuation.nextAttemptAt ? `Next goal check at ${formatClockTime(continuation.nextAttemptAt)}.` : "Next goal check is scheduled.";
+  if (state === "scheduled") {
+    return continuation?.nextAttemptAt ? `Continues at ${formatClockTime(continuation.nextAttemptAt)}.` : "Waiting to continue automatically.";
   }
   if (state === "held" && continuation?.reason === "held_for_input") {
     const reason = continuation.holdReason?.trim();
@@ -8715,6 +9301,27 @@ function queuedTurnPresentation(turn) {
 function isSteeringTurn(turn) {
   return turn.metadata.delivery === "steer";
 }
+function isAuthoritativeQueuedTurn(turn, mutationFor) {
+  return !isSteeringTurn(turn) && mutationFor(turn.id) !== "steer";
+}
+function countAuthoritativeQueuedTurns(turns, mutationFor) {
+  return turns.filter((turn) => isAuthoritativeQueuedTurn(turn, mutationFor)).length;
+}
+function isOptimisticQueuedMessage(message, queuedTurnIds, snapshot) {
+  return message.delivery === "send" && message.destination === "queue" && (!message.turnId || !queuedTurnIds.has(message.turnId)) && !(message.turnId && message.appliedQueueVersion !== null && message.appliedQueueVersion !== void 0 && snapshot && snapshot.version >= message.appliedQueueVersion);
+}
+function countOptimisticQueuedMessages(messages, queuedTurnIds, snapshot) {
+  return (messages ?? []).filter(
+    (message) => isOptimisticQueuedMessage(message, queuedTurnIds, snapshot)
+  ).length;
+}
+function sessionChromeInitialActive(input) {
+  if (input.defaultActive != null) return input.defaultActive;
+  return input.authoritativeQueuedCount >= 1 ? "queue" : null;
+}
+function sessionChromeShouldOfferQueue(input) {
+  return !input.controlled && input.active === null && !input.activityOpen && input.authoritativeQueuedCount >= 1 && !input.suppressed;
+}
 function objectValue(value) {
   return value !== null && typeof value === "object" && !Array.isArray(value) ? value : null;
 }
@@ -8727,6 +9334,7 @@ function sessionChromeGoalPillState(goalStatus, continuation) {
   }
   if (continuation.state === "scheduled") return "scheduled";
   if (continuation.state === "blocked") {
+    if (continuation.reason === "human_turn_running") return "waiting";
     return continuation.reason === "workstream_paused" || continuation.reason === "held_for_input" ? "held" : "blocked";
   }
   return "invariant_broken";
@@ -8776,6 +9384,12 @@ function pendingKindLabel(kind) {
       return "Goal wake";
     case "agent_message":
       return "Update";
+    case "background_command_result":
+      return "Command result";
+    case "session_wait_timeout":
+      return "Wait ended";
+    case "media_generation_result":
+      return "Video result";
     default:
       return "Incoming";
   }
@@ -8793,10 +9407,13 @@ function toneClass(tone, selected) {
   }
 }
 function SessionChrome({
+  compact = false,
   queue,
   composer,
   goal,
   agentsPanel,
+  commandsPanel,
+  commandsCount = 0,
   agentsSignal,
   onDismissIncoming,
   readOnly = false,
@@ -8805,6 +9422,9 @@ function SessionChrome({
   defaultActive = null,
   onActiveChange
 }) {
+  const [activityRequested, setActivityOpen] = useState13(
+    Boolean(compact && defaultActive && ["incoming", "agents", "commands"].includes(defaultActive))
+  );
   const reactId = useId3();
   const panelId = `og-session-chrome-panel-${reactId}`;
   const reduceMotion = useReducedMotion();
@@ -8813,26 +9433,52 @@ function SessionChrome({
   const turns = queue.queue;
   const queueMutationFor = queue.mutationFor;
   const queuedTurns = useMemo5(
-    () => turns.filter((turn) => !isSteeringTurn(turn) && queueMutationFor(turn.id) !== "steer"),
+    () => turns.filter((turn) => isAuthoritativeQueuedTurn(turn, queueMutationFor)),
     [queueMutationFor, turns]
   );
   const queuedTurnIds = useMemo5(() => new Set(queuedTurns.map((turn) => turn.id)), [queuedTurns]);
   const optimisticQueued = useMemo5(
     () => (composer?.optimisticMessages ?? []).filter(
-      (message) => message.delivery === "send" && message.destination === "queue" && (!message.turnId || !queuedTurnIds.has(message.turnId)) && !(message.turnId && message.appliedQueueVersion !== null && message.appliedQueueVersion !== void 0 && queue.snapshot && queue.snapshot.version >= message.appliedQueueVersion)
+      (message) => isOptimisticQueuedMessage(message, queuedTurnIds, queue.snapshot)
     ),
     [composer?.optimisticMessages, queue.snapshot, queuedTurnIds]
   );
   const stoppingKind = composer?.stoppingAttempt ?? (queue.stoppingPreviousAttempt ? queue.effectiveControl?.state === "paused" ? "current" : "previous" : null);
   const stopping = stoppingKind !== null;
   const canMutateQueue = !readOnly && composer !== void 0;
-  const liveGoal = record?.status === "active";
-  const elapsed = useLiveElapsed(
-    record?.createdAt,
-    Boolean(liveGoal),
-    !liveGoal ? record?.updatedAt : null
-  );
+  const elapsed = useLiveElapsed(record?.createdAt, Boolean(record));
   const goalState = record ? sessionChromeGoalPillState(record.status, record.continuation) : null;
+  const initialAuthoritativeQueuedCount = countAuthoritativeQueuedTurns(
+    queue.queue,
+    queue.mutationFor
+  );
+  const [activeUncontrolled, setActiveUncontrolled] = useState13(
+    () => sessionChromeInitialActive({
+      defaultActive,
+      authoritativeQueuedCount: initialAuthoritativeQueuedCount
+    })
+  );
+  const active = activeControlled !== void 0 ? activeControlled : activeUncontrolled;
+  const activityOpen = activityRequested || Boolean(compact && active && ["incoming", "agents", "commands"].includes(active));
+  const activityVisibleRef = useRef12(activityOpen);
+  activityVisibleRef.current = activityOpen;
+  const queueOfferAdmissionSuppressedRef = useRef12(
+    defaultActive == null && initialAuthoritativeQueuedCount === 0 && countOptimisticQueuedMessages(composer?.optimisticMessages, queuedTurnIds, queue.snapshot) > 0
+  );
+  const queueOfferDismissedSessionIdsRef = useRef12(/* @__PURE__ */ new Set());
+  const occupancySessionId = queuedTurns[0]?.sessionId ?? null;
+  const setActive = (next) => {
+    if (active === "queue" && next === null) {
+      if (occupancySessionId) {
+        queueOfferDismissedSessionIdsRef.current.add(occupancySessionId);
+      } else {
+        queueOfferAdmissionSuppressedRef.current = true;
+      }
+    }
+    if (activeControlled === void 0) setActiveUncontrolled(next);
+    onActiveChange?.(next);
+  };
+  const hasCommandsPanel = commandsPanel != null;
   const signals = useMemo5(() => {
     const rows = [];
     if (incoming.length > 0) {
@@ -8844,7 +9490,7 @@ function SessionChrome({
         tone: incoming.some(
           (item) => item.classification === "action_required" || item.classification === "failure"
         ) ? "waiting" : "neutral",
-        icon: /* @__PURE__ */ jsx18(InboxIcon, { className: "size-3" })
+        icon: /* @__PURE__ */ jsx20(InboxIcon, { className: "size-3" })
       });
     }
     const queuedCount = queuedTurns.length + optimisticQueued.length;
@@ -8861,7 +9507,7 @@ function SessionChrome({
         label: queueProblem ? queuedCount > 0 ? `${queuedCount} queued \xB7 needs attention` : "Queue needs attention" : allVoiceRequests ? queuedCount === 1 ? "Voice request queued" : `${queuedCount} voice requests queued` : onlyVoiceHandoff ? "Voice handoff queued" : `${queuedCount} queued prompt${queuedCount === 1 ? "" : "s"}`,
         ...detail ? { detail } : {},
         tone: queueProblem ? "waiting" : "neutral",
-        icon: queueProblem ? /* @__PURE__ */ jsx18(TriangleAlertIcon3, { className: "size-3" }) : voiceOnly ? /* @__PURE__ */ jsx18(AudioLinesIcon, { className: "size-3" }) : /* @__PURE__ */ jsx18(ListOrderedIcon, { className: "size-3" })
+        icon: queueProblem ? /* @__PURE__ */ jsx20(TriangleAlertIcon3, { className: "size-3" }) : voiceOnly ? /* @__PURE__ */ jsx20(AudioLinesIcon, { className: "size-3" }) : /* @__PURE__ */ jsx20(ListOrderedIcon, { className: "size-3" })
       });
     }
     if (record && goalState) {
@@ -8873,7 +9519,7 @@ function SessionChrome({
         detail: elapsed ? `${elapsed} \xB7 ${record.text}` : record.text,
         ...explanation ? { title: explanation } : {},
         tone: waiting ? "waiting" : goalState === "pursuing" || goalState === "scheduled" ? "accent" : "neutral",
-        icon: goalState === "blocked" || goalState === "invariant_broken" ? /* @__PURE__ */ jsx18(TriangleAlertIcon3, { className: "size-3" }) : goalState === "waiting" ? /* @__PURE__ */ jsx18(Loader2Icon2, { className: "size-3 animate-og-spin" }) : goalState === "paused" || goalState === "held" ? /* @__PURE__ */ jsx18(PauseIcon2, { className: "size-3" }) : /* @__PURE__ */ jsx18(ZapIcon, { className: "size-3" })
+        icon: /* @__PURE__ */ jsx20(TargetIcon3, { className: "size-3" })
       });
     }
     if (agentsSignal && agentsSignal.count > 0) {
@@ -8883,11 +9529,22 @@ function SessionChrome({
         label: `${agentsSignal.count} agent${agentsSignal.count === 1 ? "" : "s"}`,
         ...detail ? { detail } : {},
         tone: agentsSignal.tone ?? "neutral",
-        icon: /* @__PURE__ */ jsx18(BotIcon3, { className: "size-3" })
+        icon: /* @__PURE__ */ jsx20(BotIcon3, { className: "size-3" })
+      });
+    }
+    if (commandsCount > 0 || active === "commands" && hasCommandsPanel) {
+      rows.push({
+        id: "commands",
+        label: commandsCount > 0 ? `${commandsCount} command${commandsCount === 1 ? "" : "s"}` : "Commands",
+        tone: commandsCount > 0 ? "running" : "neutral",
+        icon: /* @__PURE__ */ jsx20(TerminalIcon2, { className: "size-3" })
       });
     }
     return rows;
   }, [
+    commandsCount,
+    hasCommandsPanel,
+    active,
     agentsSignal,
     elapsed,
     goalState,
@@ -8898,16 +9555,8 @@ function SessionChrome({
     queuedTurns,
     record
   ]);
-  const [activeUncontrolled, setActiveUncontrolled] = useState13(
-    defaultActive
-  );
-  const active = activeControlled !== void 0 ? activeControlled : activeUncontrolled;
-  const setActive = (next) => {
-    if (activeControlled === void 0) setActiveUncontrolled(next);
-    onActiveChange?.(next);
-  };
   const optimisticQueueKeys = optimisticQueued.map((message) => message.clientEventId).join(",");
-  const previousOptimisticQueueKeys = useRef11(optimisticQueueKeys);
+  const previousOptimisticQueueKeys = useRef12(optimisticQueueKeys);
   const [queueArrivalNonce, setQueueArrivalNonce] = useState13(0);
   useEffect11(() => {
     const previous = new Set(previousOptimisticQueueKeys.current.split(",").filter(Boolean));
@@ -8915,12 +9564,47 @@ function SessionChrome({
     previousOptimisticQueueKeys.current = optimisticQueueKeys;
     if (!arrived) return;
     setQueueArrivalNonce((current) => current + 1);
-  }, [optimisticQueueKeys, optimisticQueued]);
+    if (activeControlled === void 0 && active === null) {
+      queueOfferAdmissionSuppressedRef.current = true;
+    }
+  }, [active, activeControlled, optimisticQueueKeys, optimisticQueued]);
+  const queueOccupied = queuedTurns.length > 0 || optimisticQueued.length > 0;
+  useEffect11(() => {
+    if (queueOccupied) return;
+    queueOfferAdmissionSuppressedRef.current = false;
+    queueOfferDismissedSessionIdsRef.current.clear();
+  }, [queueOccupied]);
+  const queueOfferSuppressed = queueOfferAdmissionSuppressedRef.current || occupancySessionId != null && queueOfferDismissedSessionIdsRef.current.has(occupancySessionId);
+  useEffect11(() => {
+    if (!sessionChromeShouldOfferQueue({
+      controlled: activeControlled !== void 0,
+      active,
+      activityOpen,
+      authoritativeQueuedCount: queuedTurns.length,
+      suppressed: queueOfferSuppressed
+    })) {
+      return;
+    }
+    if (activeControlled === void 0) setActiveUncontrolled("queue");
+    onActiveChange?.("queue");
+  }, [
+    active,
+    activeControlled,
+    activityOpen,
+    occupancySessionId,
+    onActiveChange,
+    queueOfferSuppressed,
+    queuedTurns.length
+  ]);
   const [replaceDraftFor, setReplaceDraftFor] = useState13(null);
-  const chipRefs = useRef11({});
-  const railRef = useRef11(null);
+  const chipRefs = useRef12({});
+  const railRef = useRef12(null);
   const [pill, setPill] = useState13({ left: 0, top: 0, width: 0, height: 0, opacity: 0 });
   const signalIds = signals.map((signal) => signal.id).join(",");
+  useEffect11(() => {
+    if (compact && !signals.some((signal) => ["incoming", "agents", "commands"].includes(signal.id)))
+      setActivityOpen(false);
+  }, [compact, signals]);
   useEffect11(() => {
     if (active && !signalIds.split(",").includes(active)) {
       if (activeControlled === void 0) setActiveUncontrolled(null);
@@ -8941,7 +9625,10 @@ function SessionChrome({
         return;
       }
       const chip = chipRefs.current[active];
-      if (!chip) return;
+      if (!chip) {
+        setPill((prev) => ({ ...prev, opacity: 0 }));
+        return;
+      }
       const railBox = rail.getBoundingClientRect();
       const chipBox = chip.getBoundingClientRect();
       setPill({
@@ -8970,7 +9657,7 @@ function SessionChrome({
   const shellDuration = reduceMotion ? 0 : 0.22;
   const crossfadeDuration = reduceMotion ? 0 : 0.18;
   const ease = [0.22, 1, 0.36, 1];
-  const panelBody = active === "incoming" ? /* @__PURE__ */ jsx18(IncomingPanel, { inputs: incoming, onDismiss: onDismissIncoming }) : active === "queue" ? /* @__PURE__ */ jsx18(
+  const panelBody = active === "incoming" ? /* @__PURE__ */ jsx20(IncomingPanel, { inputs: incoming, onDismiss: onDismissIncoming }) : active === "queue" ? /* @__PURE__ */ jsx20(
     QueuePanel,
     {
       turns: queuedTurns,
@@ -9021,15 +9708,15 @@ function SessionChrome({
         void queue.moveTurn(turnId, beforeTurnId);
       } : void 0
     }
-  ) : active === "goal" && record && goalState && goal ? /* @__PURE__ */ jsx18(GoalPanel, { goal, state: goalState, elapsed, readOnly }) : active === "agents" ? /* @__PURE__ */ jsx18("div", { "data-og-session-chrome-panel": "agents", children: agentsPanel ?? /* @__PURE__ */ jsx18("p", { className: "text-og-xs text-og-fg-muted", children: "No agent details." }) }) : null;
-  return /* @__PURE__ */ jsx18(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsx18(
+  ) : active === "goal" && record && goalState && goal ? /* @__PURE__ */ jsx20(GoalPanel, { goal, state: goalState, elapsed, readOnly }) : active === "commands" ? /* @__PURE__ */ jsx20("div", { "data-og-session-chrome-panel": "commands", children: commandsPanel }) : active === "agents" ? /* @__PURE__ */ jsx20("div", { "data-og-session-chrome-panel": "agents", children: agentsPanel ?? /* @__PURE__ */ jsx20("p", { className: "text-og-xs text-og-fg-muted", children: "No agent details." }) }) : null;
+  return /* @__PURE__ */ jsx20(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsx20(
     "div",
     {
       className: cn("og-session-chrome og-root w-full", className),
       "data-testid": "session-chrome",
       "data-og-session-chrome": "",
       "data-og-session-chrome-open": open ? "true" : "false",
-      children: /* @__PURE__ */ jsxs13(
+      children: /* @__PURE__ */ jsxs15(
         "div",
         {
           className: cn(
@@ -9038,14 +9725,14 @@ function SessionChrome({
           ),
           style: {
             borderRadius: "var(--_og-session-chrome-radius)",
-            background: open ? "var(--_og-session-chrome-surface-open)" : "var(--_og-session-chrome-surface)",
-            borderColor: open ? "var(--_og-session-chrome-border-open)" : "var(--_og-session-chrome-border)",
-            boxShadow: open ? "var(--og-session-chrome-shadow-open)" : "var(--og-session-chrome-shadow)",
+            background: compact ? "transparent" : open ? "var(--_og-session-chrome-surface-open)" : "var(--_og-session-chrome-surface)",
+            borderColor: compact ? "transparent" : open ? "var(--_og-session-chrome-border-open)" : "var(--_og-session-chrome-border)",
+            boxShadow: compact ? "none" : open ? "var(--og-session-chrome-shadow-open)" : "var(--og-session-chrome-shadow)",
             transitionDuration: "var(--og-session-chrome-duration)",
             transitionTimingFunction: "var(--_og-session-chrome-ease)"
           },
           children: [
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(
               "div",
               {
                 className: "relative",
@@ -9055,17 +9742,17 @@ function SessionChrome({
                   paddingLeft: "var(--og-session-chrome-rail-pad)",
                   paddingRight: "var(--og-session-chrome-rail-pad)"
                 },
-                children: /* @__PURE__ */ jsxs13(
+                children: /* @__PURE__ */ jsxs15(
                   "div",
                   {
                     ref: railRef,
-                    className: "relative flex flex-wrap items-center",
+                    className: cn("relative flex items-center", compact ? "flex-nowrap" : "flex-wrap"),
                     style: {
-                      gap: "var(--og-session-chrome-chip-gap)"
+                      gap: compact ? "10px" : "var(--og-session-chrome-chip-gap)"
                     },
                     children: [
-                      /* @__PURE__ */ jsx18(
-                        motion2.div,
+                      /* @__PURE__ */ jsx20(
+                        motion3.div,
                         {
                           "aria-hidden": true,
                           className: "pointer-events-none absolute left-0 top-0 rounded-og-md",
@@ -9084,67 +9771,158 @@ function SessionChrome({
                           transition: { duration: shellDuration, ease }
                         }
                       ),
-                      signals.map((signal) => {
+                      signals.filter(
+                        (signal) => !compact || !["incoming", "agents", "commands"].includes(signal.id)
+                      ).map((signal) => {
                         const selected = active === signal.id;
-                        return /* @__PURE__ */ jsxs13(
-                          "button",
+                        return /* @__PURE__ */ jsxs15(
+                          "div",
                           {
-                            type: "button",
-                            ref: (node) => {
-                              chipRefs.current[signal.id] = node;
-                            },
-                            "aria-expanded": selected,
-                            "aria-controls": panelId,
-                            "aria-label": selected ? `Close ${signal.label}` : void 0,
-                            "data-testid": `session-chrome-${signal.id}`,
-                            "data-og-session-chrome-signal": signal.id,
-                            title: signal.title,
-                            onClick: () => setActive(selected ? null : signal.id),
+                            role: "group",
+                            "aria-label": signal.id === "queue" ? "Queued messages and actions" : signal.id === "goal" ? "Goal and actions" : signal.label,
                             className: cn(
-                              "group relative z-[1] inline-flex min-h-[var(--og-session-chrome-chip-min-height)] max-w-full items-center gap-1 rounded-og-md py-1 text-left text-og-xs outline-hidden",
-                              // Coarse pointers keep a 44px target (session-pins acceptance).
-                              "pointer-coarse:min-h-11",
-                              "transition-colors duration-150 motion-reduce:transition-none",
-                              "hover:text-og-fg focus-visible:bg-og-surface-3/50",
-                              selected ? "text-og-fg" : "text-og-fg-muted"
+                              "group/signal relative z-[1] inline-flex min-w-0 max-w-full items-center rounded-og-md",
+                              compact && "bg-og-surface-2/60 px-0.5",
+                              compact && selected && "bg-og-surface-3"
                             ),
-                            style: {
-                              paddingInline: "var(--og-session-chrome-chip-pad-x)"
-                            },
                             children: [
-                              signal.id === "queue" && queueArrivalNonce > 0 && !reduceMotion ? /* @__PURE__ */ jsx18(
-                                motion2.span,
+                              /* @__PURE__ */ jsxs15(
+                                "button",
                                 {
-                                  "aria-hidden": "true",
-                                  "data-testid": "session-chrome-queue-arrival",
-                                  className: "pointer-events-none absolute inset-0 rounded-og-md bg-og-accent-soft",
-                                  initial: { opacity: 0 },
-                                  animate: { opacity: [0, 0.38, 0] },
-                                  transition: { duration: 0.72, times: [0, 0.18, 1], ease }
-                                },
-                                queueArrivalNonce
-                              ) : null,
-                              /* @__PURE__ */ jsx18("span", { className: cn("shrink-0", toneClass(signal.tone, selected)), children: signal.icon }),
-                              /* @__PURE__ */ jsx18("span", { className: "shrink-0 font-medium text-og-fg", children: signal.label }),
-                              signal.detail ? /* @__PURE__ */ jsxs13(Fragment6, { children: [
-                                /* @__PURE__ */ jsx18("span", { "aria-hidden": true, className: "shrink-0 text-og-fg-subtle/60", children: "\xB7" }),
-                                /* @__PURE__ */ jsx18("span", { className: "min-w-0 max-w-[8.5rem] truncate text-og-fg sm:max-w-[12rem]", children: signal.detail })
-                              ] }) : null,
-                              selected ? /* @__PURE__ */ jsx18(
-                                "span",
+                                  type: "button",
+                                  ref: (node) => {
+                                    chipRefs.current[signal.id] = node;
+                                  },
+                                  "aria-expanded": selected,
+                                  "aria-controls": panelId,
+                                  "aria-label": compact && signal.id === "goal" ? `Goal \xB7 ${goalState === "pursuing" ? "Running" : signal.label}` : selected ? `Close ${signal.label}` : void 0,
+                                  "data-testid": `session-chrome-${signal.id}`,
+                                  "data-og-session-chrome-signal": signal.id,
+                                  title: signal.title ?? (compact ? signal.label : void 0),
+                                  onClick: () => {
+                                    if (compact) setActivityOpen(false);
+                                    setActive(selected ? null : signal.id);
+                                  },
+                                  className: cn(
+                                    "group relative z-[1] inline-flex min-w-0 min-h-[var(--og-session-chrome-chip-min-height)] max-w-full items-center gap-1 rounded-og-md py-1 text-left text-og-xs outline-hidden",
+                                    // Coarse pointers keep a 44px target (session-pins acceptance).
+                                    "pointer-coarse:min-h-11",
+                                    "transition-colors duration-150 motion-reduce:transition-none",
+                                    "hover:text-og-fg focus-visible:bg-og-surface-3/50",
+                                    selected ? "text-og-fg" : "text-og-fg-muted"
+                                  ),
+                                  style: {
+                                    paddingInline: "var(--og-session-chrome-chip-pad-x)"
+                                  },
+                                  children: [
+                                    signal.id === "queue" && queueArrivalNonce > 0 && !reduceMotion ? /* @__PURE__ */ jsx20(
+                                      motion3.span,
+                                      {
+                                        "aria-hidden": "true",
+                                        "data-testid": "session-chrome-queue-arrival",
+                                        className: "pointer-events-none absolute inset-0 rounded-og-md bg-og-accent-soft",
+                                        initial: { opacity: 0 },
+                                        animate: { opacity: [0, 0.38, 0] },
+                                        transition: { duration: 0.72, times: [0, 0.18, 1], ease }
+                                      },
+                                      queueArrivalNonce
+                                    ) : null,
+                                    /* @__PURE__ */ jsx20("span", { className: cn("shrink-0", toneClass(signal.tone, selected)), children: signal.icon }),
+                                    /* @__PURE__ */ jsxs15(
+                                      "span",
+                                      {
+                                        className: cn(
+                                          "font-medium text-og-fg",
+                                          compact ? "min-w-0 truncate" : "shrink-0"
+                                        ),
+                                        children: [
+                                          compact && signal.id === "goal" ? "Goal \xB7 " : null,
+                                          compact && signal.id === "goal" ? goalState === "pursuing" ? "Running" : signal.label : compact && signal.id === "queue" ? `${queuedTurns.length + optimisticQueued.length} queued` : signal.label
+                                        ]
+                                      }
+                                    ),
+                                    signal.detail && !compact ? /* @__PURE__ */ jsxs15(Fragment7, { children: [
+                                      /* @__PURE__ */ jsx20("span", { "aria-hidden": true, className: "shrink-0 text-og-fg-subtle/60", children: "\xB7" }),
+                                      /* @__PURE__ */ jsx20("span", { className: "min-w-0 max-w-[8.5rem] truncate text-og-fg sm:max-w-[12rem]", children: signal.detail })
+                                    ] }) : null,
+                                    selected && !compact ? /* @__PURE__ */ jsx20(
+                                      "span",
+                                      {
+                                        "data-testid": "session-chrome-close",
+                                        className: "ml-0.5 inline-flex size-4 shrink-0 items-center justify-center rounded-og-sm text-og-fg-subtle transition-colors group-hover:text-og-fg pointer-coarse:size-5",
+                                        "aria-hidden": true,
+                                        children: /* @__PURE__ */ jsx20(XIcon, { className: "size-3" })
+                                      }
+                                    ) : null
+                                  ]
+                                }
+                              ),
+                              signal.id === "goal" && goal && record && !readOnly ? /* @__PURE__ */ jsxs15("div", { className: cn("flex shrink-0 items-center pr-1", compact && "pl-0.5"), children: [
+                                record.status === "active" || record.status === "paused" ? /* @__PURE__ */ jsx20(
+                                  IconAction,
+                                  {
+                                    label: record.status === "paused" ? "Resume goal" : "Pause goal",
+                                    tip: record.status === "paused" ? "Resume goal" : "Pause goal",
+                                    disabled: goal.updating,
+                                    onClick: () => void (record.status === "paused" ? goal.resume() : goal.pause("Paused from session chrome")),
+                                    children: goal.updating ? /* @__PURE__ */ jsx20(Loader2Icon2, { className: "size-3 animate-og-spin" }) : record.status === "paused" ? /* @__PURE__ */ jsx20(PlayIcon2, { className: "size-3" }) : /* @__PURE__ */ jsx20(PauseIcon2, { className: "size-3" })
+                                  }
+                                ) : null,
+                                /* @__PURE__ */ jsx20(
+                                  IconAction,
+                                  {
+                                    label: "Clear goal",
+                                    tip: "Clear goal",
+                                    danger: true,
+                                    disabled: goal.updating,
+                                    onClick: () => void goal.deleteGoal(),
+                                    children: /* @__PURE__ */ jsx20(Trash2Icon2, { className: "size-3" })
+                                  }
+                                )
+                              ] }) : signal.id === "queue" && canMutateQueue && queuedTurns[0] ? /* @__PURE__ */ jsx20("div", { className: cn("flex shrink-0 items-center pr-1", compact && "pl-0.5"), children: /* @__PURE__ */ jsx20(
+                                IconAction,
                                 {
-                                  "data-testid": "session-chrome-close",
-                                  className: "ml-0.5 inline-flex size-4 shrink-0 items-center justify-center rounded-og-sm text-og-fg-subtle transition-colors group-hover:text-og-fg pointer-coarse:size-5",
-                                  "aria-hidden": true,
-                                  children: /* @__PURE__ */ jsx18(XIcon, { className: "size-3" })
+                                  label: "Steer first queued message",
+                                  text: "Steer",
+                                  tip: QUEUE_STEER_TIP,
+                                  disabled: queue.mutating || Boolean(queue.mutationFor(queuedTurns[0].id)),
+                                  onClick: () => void queue.steerTurn(queuedTurns[0].id),
+                                  children: /* @__PURE__ */ jsx20(CornerDownRightIcon, { className: "size-3" })
                                 }
-                              ) : null
+                              ) }) : null
                             ]
                           },
                           signal.id
                         );
                       }),
-                      stopping ? /* @__PURE__ */ jsxs13(
+                      compact && signals.some((signal) => ["incoming", "agents", "commands"].includes(signal.id)) ? /* @__PURE__ */ jsxs15(
+                        "button",
+                        {
+                          type: "button",
+                          "aria-label": "Session activity",
+                          title: activityOpen ? "Close activity" : "Inbox, agents and commands",
+                          "aria-controls": panelId,
+                          "aria-expanded": activityOpen,
+                          onClick: () => {
+                            setActivityOpen(!activityOpen);
+                            setActive(
+                              activityOpen ? null : signals.find(
+                                (signal) => ["incoming", "agents", "commands"].includes(signal.id)
+                              )?.id ?? null
+                            );
+                          },
+                          className: cn(
+                            "ml-auto inline-flex min-h-8 shrink-0 items-center justify-center gap-1.5 rounded-og-md px-2 text-og-xs transition-colors outline-hidden focus-visible:ring-2 focus-visible:ring-og-accent/40 pointer-coarse:min-h-11 pointer-coarse:min-w-11",
+                            activityOpen ? "bg-og-surface-3 text-og-fg" : "text-og-fg-muted hover:bg-og-surface-2 hover:text-og-fg"
+                          ),
+                          children: [
+                            /* @__PURE__ */ jsx20(ActivityIcon, { className: "size-3.5" }),
+                            /* @__PURE__ */ jsx20("span", { className: "sr-only", children: "Activity" }),
+                            incoming.length > 0 ? /* @__PURE__ */ jsx20("span", { className: "size-1.5 rounded-full bg-og-accent" }) : null
+                          ]
+                        }
+                      ) : null,
+                      stopping ? /* @__PURE__ */ jsxs15(
                         "span",
                         {
                           role: "status",
@@ -9152,7 +9930,7 @@ function SessionChrome({
                           className: "inline-flex min-h-[var(--og-session-chrome-chip-min-height)] items-center gap-1.5 px-1.5 text-og-xs text-og-fg-muted",
                           "data-testid": "session-chrome-stopping",
                           children: [
-                            /* @__PURE__ */ jsx18(
+                            /* @__PURE__ */ jsx20(
                               Loader2Icon2,
                               {
                                 "aria-hidden": "true",
@@ -9168,7 +9946,41 @@ function SessionChrome({
                 )
               }
             ),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(AnimatePresence2, { initial: false, children: compact && activityOpen ? /* @__PURE__ */ jsx20(
+              motion3.div,
+              {
+                initial: { height: 0, opacity: 0 },
+                animate: { height: "auto", opacity: 1 },
+                exit: { height: 0, opacity: 0 },
+                transition: { duration: shellDuration, ease },
+                style: { overflow: "hidden" },
+                children: /* @__PURE__ */ jsx20("div", { className: "mt-1 flex items-center gap-1 rounded-t-og-lg bg-og-surface-2/50 px-2 py-1", children: signals.filter((signal) => ["incoming", "agents", "commands"].includes(signal.id)).map((signal) => /* @__PURE__ */ jsxs15(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-expanded": active === signal.id,
+                    onClick: () => {
+                      if (activityVisibleRef.current) setActive(signal.id);
+                    },
+                    className: cn(
+                      "inline-flex min-h-9 items-center gap-1.5 rounded-og-md px-2 text-og-xs pointer-coarse:min-h-11",
+                      active === signal.id ? "bg-og-surface-3 text-og-fg" : "text-og-fg-muted hover:text-og-fg"
+                    ),
+                    children: [
+                      signal.icon,
+                      signal.id === "incoming" ? `${incoming.length} incoming` : signal.label
+                    ]
+                  },
+                  signal.id
+                )) })
+              },
+              "activity-tabs"
+            ) : null }),
+            goal?.mutationError ? /* @__PURE__ */ jsxs15("p", { role: "alert", className: "px-3 pb-2 text-og-xs text-og-danger", children: [
+              "Goal action not confirmed. ",
+              goal.mutationError.message
+            ] }) : null,
+            /* @__PURE__ */ jsx20(
               "div",
               {
                 id: panelId,
@@ -9184,33 +9996,48 @@ function SessionChrome({
                   transitionDuration: "var(--og-session-chrome-duration)",
                   transitionTimingFunction: "var(--_og-session-chrome-ease)"
                 },
-                children: /* @__PURE__ */ jsx18("div", { className: "min-h-0 overflow-hidden", children: /* @__PURE__ */ jsx18(
+                children: /* @__PURE__ */ jsx20("div", { className: "min-h-0 overflow-hidden", children: /* @__PURE__ */ jsxs15(
                   "div",
                   {
-                    className: "relative overflow-y-auto overscroll-contain border-t border-og-border/50",
+                    className: cn(
+                      "relative overflow-y-auto overscroll-contain",
+                      compact ? activityOpen ? "rounded-b-og-lg bg-og-surface-2/50" : "mt-1 rounded-og-lg bg-og-surface-2/50" : "border-t border-og-border/50"
+                    ),
                     style: {
                       maxHeight: "var(--og-session-chrome-panel-max-height)",
                       paddingInline: "var(--og-session-chrome-panel-pad-x)",
                       paddingBlock: "var(--og-session-chrome-panel-pad-y)"
                     },
-                    children: /* @__PURE__ */ jsx18(AnimatePresence2, { initial: false, children: active && panelBody ? /* @__PURE__ */ jsx18(
-                      motion2.div,
-                      {
-                        "data-og-session-chrome-panel-frame": active,
-                        initial: reduceMotion ? false : { opacity: 0 },
-                        animate: { opacity: 1, position: "relative" },
-                        exit: reduceMotion ? { opacity: 1, position: "relative" } : {
-                          opacity: 0,
-                          position: "absolute",
-                          top: 0,
-                          left: 0,
-                          right: 0
+                    children: [
+                      /* @__PURE__ */ jsx20(AnimatePresence2, { initial: false, children: active && active !== "commands" && panelBody ? /* @__PURE__ */ jsx20(
+                        motion3.div,
+                        {
+                          "data-og-session-chrome-panel-frame": active,
+                          initial: reduceMotion ? false : { opacity: 0 },
+                          animate: { opacity: 1, position: "relative" },
+                          exit: reduceMotion ? { opacity: 1, position: "relative" } : {
+                            opacity: 0,
+                            position: "absolute",
+                            top: 0,
+                            left: 0,
+                            right: 0
+                          },
+                          transition: { duration: crossfadeDuration, ease },
+                          children: panelBody
                         },
-                        transition: { duration: crossfadeDuration, ease },
-                        children: panelBody
-                      },
-                      active
-                    ) : null })
+                        active
+                      ) : null }),
+                      active === "commands" ? /* @__PURE__ */ jsx20(
+                        motion3.div,
+                        {
+                          initial: reduceMotion ? false : { opacity: 0 },
+                          animate: { opacity: 1 },
+                          transition: { duration: crossfadeDuration, ease },
+                          children: panelBody
+                        },
+                        "commands"
+                      ) : null
+                    ]
                   }
                 ) })
               }
@@ -9225,18 +10052,18 @@ function IncomingPanel({
   inputs,
   onDismiss
 }) {
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx20(
     "ul",
     {
       className: "flex flex-col gap-0.5",
       "aria-label": "Incoming updates",
       "data-og-session-chrome-panel": "incoming",
-      children: inputs.map((input) => /* @__PURE__ */ jsxs13(
+      children: inputs.map((input) => /* @__PURE__ */ jsxs15(
         "li",
         {
           className: "group flex items-start gap-1.5 rounded-og-sm px-1.5 py-1 transition-colors hover:bg-[var(--_og-session-chrome-row-hover)]",
           children: [
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(
               "span",
               {
                 className: cn(
@@ -9246,15 +10073,15 @@ function IncomingPanel({
                 children: pendingKindLabel(input.kind)
               }
             ),
-            /* @__PURE__ */ jsx18("p", { className: "min-w-0 flex-1 text-og-xs leading-4 text-og-fg", children: input.summary }),
-            onDismiss ? /* @__PURE__ */ jsx18("div", { className: "flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100 max-sm:opacity-100", children: /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20("p", { className: "min-w-0 flex-1 text-og-xs leading-4 text-og-fg", children: input.summary }),
+            onDismiss ? /* @__PURE__ */ jsx20("div", { className: "flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100 max-sm:opacity-100", children: /* @__PURE__ */ jsx20(
               IconAction,
               {
                 label: `Dismiss incoming ${pendingKindLabel(input.kind)}`,
                 tip: "Dismiss",
                 onClick: () => onDismiss(input.id),
                 danger: true,
-                children: /* @__PURE__ */ jsx18(Trash2Icon2, { className: "size-3" })
+                children: /* @__PURE__ */ jsx20(Trash2Icon2, { className: "size-3" })
               }
             ) }) : null
           ]
@@ -9301,7 +10128,7 @@ function QueuePanel({
     );
     return () => clearTimeout(timer);
   }, [reduceMotion, turnIdsKey]);
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs15(
     "ol",
     {
       className: "flex flex-col gap-0.5",
@@ -9317,65 +10144,66 @@ function QueuePanel({
           const beforeDown = index < turns.length - 1 ? turns[index + 2]?.id ?? null : null;
           const showActions = !readOnly && (onEdit || onSteer || onRemove || onMove);
           const confirmingReplace = replaceDraftFor === turn.id;
-          return /* @__PURE__ */ jsxs13(
+          return /* @__PURE__ */ jsxs15(
             "li",
             {
               "data-queue-turn-id": turn.id,
               className: "group flex flex-col gap-1 rounded-og-sm px-1.5 py-1 transition-colors hover:bg-[var(--_og-session-chrome-row-hover)]",
               children: [
-                /* @__PURE__ */ jsxs13("div", { className: "flex items-start gap-1.5", children: [
-                  voice ? /* @__PURE__ */ jsx18(
+                /* @__PURE__ */ jsxs15("div", { className: "flex items-start gap-1.5", children: [
+                  voice ? /* @__PURE__ */ jsx20(
                     AudioLinesIcon,
                     {
                       "aria-hidden": "true",
                       className: "mt-0.5 size-3 shrink-0 text-og-accent"
                     }
-                  ) : /* @__PURE__ */ jsx18("span", { className: "mt-px shrink-0 font-og-mono text-[10px] leading-4 text-og-fg-subtle", children: index + 1 }),
-                  /* @__PURE__ */ jsx18("p", { className: "min-w-0 flex-1 truncate text-og-xs leading-4 text-og-fg", children: presentation.text }),
-                  showActions ? /* @__PURE__ */ jsxs13("div", { className: "flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100 max-sm:opacity-100", children: [
-                    onMove && turns.length > 1 ? /* @__PURE__ */ jsxs13(Fragment6, { children: [
-                      /* @__PURE__ */ jsx18(
+                  ) : /* @__PURE__ */ jsx20("span", { className: "mt-px shrink-0 font-og-mono text-[10px] leading-4 text-og-fg-subtle", children: index + 1 }),
+                  /* @__PURE__ */ jsx20("p", { className: "min-w-0 flex-1 truncate text-og-xs leading-4 text-og-fg", children: presentation.text }),
+                  showActions ? /* @__PURE__ */ jsxs15("div", { className: "flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100 max-sm:opacity-100", children: [
+                    onMove && turns.length > 1 ? /* @__PURE__ */ jsxs15(Fragment7, { children: [
+                      /* @__PURE__ */ jsx20(
                         IconAction,
                         {
                           label: `Move queued prompt ${index + 1} up`,
                           tip: "Move up",
                           disabled: settling || pending !== null || index === 0,
                           onClick: () => onMove(turn.id, beforeUp),
-                          children: /* @__PURE__ */ jsx18(ArrowUpIcon, { className: "size-3" })
+                          children: /* @__PURE__ */ jsx20(ArrowUpIcon, { className: "size-3" })
                         }
                       ),
-                      /* @__PURE__ */ jsx18(
+                      /* @__PURE__ */ jsx20(
                         IconAction,
                         {
                           label: `Move queued prompt ${index + 1} down`,
                           tip: "Move down",
                           disabled: settling || pending !== null || index >= turns.length - 1,
                           onClick: () => onMove(turn.id, beforeDown),
-                          children: /* @__PURE__ */ jsx18(ArrowDownIcon2, { className: "size-3" })
+                          children: /* @__PURE__ */ jsx20(ArrowDownIcon2, { className: "size-3" })
                         }
                       )
                     ] }) : null,
-                    onSteer ? /* @__PURE__ */ jsx18(
+                    onSteer ? /* @__PURE__ */ jsx20(
                       IconAction,
                       {
                         label: `Steer queued prompt ${index + 1}`,
+                        text: "Steer",
                         tip: QUEUE_STEER_TIP,
                         disabled: settling || pending !== null,
                         onClick: () => onSteer(turn.id),
-                        children: pending === "steer" ? /* @__PURE__ */ jsx18(Loader2Icon2, { className: "size-3 animate-og-spin" }) : /* @__PURE__ */ jsx18(ZapIcon, { className: "size-3" })
+                        children: pending === "steer" ? /* @__PURE__ */ jsx20(Loader2Icon2, { className: "size-3 animate-og-spin" }) : /* @__PURE__ */ jsx20(CornerDownRightIcon, { className: "size-3" })
                       }
                     ) : null,
-                    onEdit ? /* @__PURE__ */ jsx18(
+                    onEdit ? /* @__PURE__ */ jsx20(
                       IconAction,
                       {
                         label: `Edit queued prompt ${index + 1}`,
                         tip: QUEUE_EDIT_TIP,
                         disabled: settling || pending !== null,
                         onClick: () => onEdit(turn),
-                        children: pending === "edit" ? /* @__PURE__ */ jsx18(Loader2Icon2, { className: "size-3 animate-og-spin" }) : /* @__PURE__ */ jsx18(PencilIcon, { className: "size-3" })
+                        children: pending === "edit" ? /* @__PURE__ */ jsx20(Loader2Icon2, { className: "size-3 animate-og-spin" }) : /* @__PURE__ */ jsx20(PencilIcon, { className: "size-3" })
                       }
                     ) : null,
-                    onRemove ? /* @__PURE__ */ jsx18(
+                    onRemove ? /* @__PURE__ */ jsx20(
                       IconAction,
                       {
                         label: `Remove queued prompt ${index + 1}`,
@@ -9383,16 +10211,16 @@ function QueuePanel({
                         disabled: settling || pending !== null,
                         onClick: () => onRemove(turn.id),
                         danger: true,
-                        children: pending === "delete" ? /* @__PURE__ */ jsx18(Loader2Icon2, { className: "size-3 animate-og-spin" }) : /* @__PURE__ */ jsx18(Trash2Icon2, { className: "size-3" })
+                        children: pending === "delete" ? /* @__PURE__ */ jsx20(Loader2Icon2, { className: "size-3 animate-og-spin" }) : /* @__PURE__ */ jsx20(Trash2Icon2, { className: "size-3" })
                       }
                     ) : null
                   ] }) : null
                 ] }),
-                confirmingReplace ? /* @__PURE__ */ jsxs13("div", { className: "rounded-og-sm border border-og-status-waiting/30 bg-og-status-waiting/10 p-2 text-og-xs text-og-fg", children: [
-                  /* @__PURE__ */ jsx18("p", { children: "Your composer already has a draft. Replace it with this queued prompt?" }),
-                  /* @__PURE__ */ jsx18("p", { className: "mt-0.5 text-og-fg-muted", children: "The current draft will be permanently discarded; this queued prompt is preserved until you confirm." }),
-                  /* @__PURE__ */ jsxs13("div", { className: "mt-2 flex justify-end gap-1.5", children: [
-                    /* @__PURE__ */ jsx18(
+                confirmingReplace ? /* @__PURE__ */ jsxs15("div", { className: "rounded-og-sm border border-og-status-waiting/30 bg-og-status-waiting/10 p-2 text-og-xs text-og-fg", children: [
+                  /* @__PURE__ */ jsx20("p", { children: "Your composer already has a draft. Replace it with this queued prompt?" }),
+                  /* @__PURE__ */ jsx20("p", { className: "mt-0.5 text-og-fg-muted", children: "The current draft will be permanently discarded; this queued prompt is preserved until you confirm." }),
+                  /* @__PURE__ */ jsxs15("div", { className: "mt-2 flex justify-end gap-1.5", children: [
+                    /* @__PURE__ */ jsx20(
                       "button",
                       {
                         type: "button",
@@ -9401,7 +10229,7 @@ function QueuePanel({
                         children: "Keep current draft"
                       }
                     ),
-                    /* @__PURE__ */ jsx18(
+                    /* @__PURE__ */ jsx20(
                       "button",
                       {
                         type: "button",
@@ -9417,8 +10245,8 @@ function QueuePanel({
             turn.id
           );
         }),
-        /* @__PURE__ */ jsx18(AnimatePresence2, { initial: false, children: optimistic.map((message, index) => /* @__PURE__ */ jsxs13(
-          motion2.li,
+        /* @__PURE__ */ jsx20(AnimatePresence2, { initial: false, children: optimistic.map((message, index) => /* @__PURE__ */ jsxs15(
+          motion3.li,
           {
             "aria-live": "polite",
             "data-optimistic-queue-message": message.clientEventId,
@@ -9430,11 +10258,11 @@ function QueuePanel({
               message.state === "failed" ? "bg-og-danger/8 text-og-danger" : "bg-og-accent-soft/45"
             ),
             children: [
-              /* @__PURE__ */ jsx18("span", { className: "shrink-0 font-og-mono text-[10px] leading-4 text-og-fg-subtle", children: turns.length + index + 1 }),
-              /* @__PURE__ */ jsx18("p", { className: "min-w-0 flex-1 truncate text-og-xs leading-4 text-og-fg", children: message.text }),
-              /* @__PURE__ */ jsx18("span", { className: "sr-only", children: message.state === "failed" ? "Not confirmed" : message.state === "sending" ? "Placing in queue" : "Queued" }),
-              message.state === "failed" ? /* @__PURE__ */ jsxs13("div", { className: "flex shrink-0 items-center gap-1 text-[10px]", children: [
-                onRetryOptimistic ? /* @__PURE__ */ jsx18(
+              /* @__PURE__ */ jsx20("span", { className: "shrink-0 font-og-mono text-[10px] leading-4 text-og-fg-subtle", children: turns.length + index + 1 }),
+              /* @__PURE__ */ jsx20("p", { className: "min-w-0 flex-1 truncate text-og-xs leading-4 text-og-fg", children: message.text }),
+              /* @__PURE__ */ jsx20("span", { className: "sr-only", children: message.state === "failed" ? "Not confirmed" : message.state === "sending" ? "Placing in queue" : "Queued" }),
+              message.state === "failed" ? /* @__PURE__ */ jsxs15("div", { className: "flex shrink-0 items-center gap-1 text-[10px]", children: [
+                onRetryOptimistic ? /* @__PURE__ */ jsx20(
                   "button",
                   {
                     type: "button",
@@ -9443,36 +10271,36 @@ function QueuePanel({
                     children: "Retry"
                   }
                 ) : null,
-                onRemoveOptimistic ? /* @__PURE__ */ jsx18(
+                onRemoveOptimistic ? /* @__PURE__ */ jsx20(
                   "button",
                   {
                     type: "button",
                     "aria-label": "Dismiss unconfirmed queued prompt",
                     className: "rounded-og-sm p-1 text-og-fg-muted hover:bg-og-surface-2 hover:text-og-fg pointer-coarse:min-h-11 pointer-coarse:min-w-11",
                     onClick: () => onRemoveOptimistic(message.clientEventId),
-                    children: /* @__PURE__ */ jsx18(XIcon, { className: "size-3" })
+                    children: /* @__PURE__ */ jsx20(XIcon, { className: "size-3" })
                   }
                 ) : null
-              ] }) : message.state === "sending" ? /* @__PURE__ */ jsx18(
+              ] }) : message.state === "sending" ? /* @__PURE__ */ jsx20(
                 Loader2Icon2,
                 {
                   "aria-hidden": "true",
                   className: "size-3 shrink-0 animate-og-spin text-og-accent motion-reduce:animate-none"
                 }
-              ) : /* @__PURE__ */ jsx18(CheckIcon3, { "aria-hidden": "true", className: "size-3 shrink-0 text-og-accent" })
+              ) : /* @__PURE__ */ jsx20(CheckIcon3, { "aria-hidden": "true", className: "size-3 shrink-0 text-og-accent" })
             ]
           },
           message.clientEventId
         )) }),
-        loadError ? /* @__PURE__ */ jsxs13(
+        loadError ? /* @__PURE__ */ jsxs15(
           "li",
           {
             role: "alert",
             className: "flex items-center gap-1.5 rounded-og-sm bg-og-danger/8 px-1.5 py-1 text-og-xs text-og-danger",
             children: [
-              /* @__PURE__ */ jsx18(TriangleAlertIcon3, { className: "size-3 shrink-0" }),
-              /* @__PURE__ */ jsx18("span", { className: "min-w-0 flex-1", children: "Queue unavailable." }),
-              /* @__PURE__ */ jsx18(
+              /* @__PURE__ */ jsx20(TriangleAlertIcon3, { className: "size-3 shrink-0" }),
+              /* @__PURE__ */ jsx20("span", { className: "min-w-0 flex-1", children: "Queue unavailable." }),
+              /* @__PURE__ */ jsx20(
                 "button",
                 {
                   type: "button",
@@ -9484,15 +10312,15 @@ function QueuePanel({
             ]
           }
         ) : null,
-        mutationError ? /* @__PURE__ */ jsxs13(
+        mutationError ? /* @__PURE__ */ jsxs15(
           "li",
           {
             role: "alert",
             className: "flex items-center gap-1.5 rounded-og-sm bg-og-danger/8 px-1.5 py-1 text-og-xs text-og-danger",
             children: [
-              /* @__PURE__ */ jsx18(TriangleAlertIcon3, { className: "size-3 shrink-0" }),
-              /* @__PURE__ */ jsx18("span", { className: "min-w-0 flex-1", children: "Not confirmed. Check the queue before retrying." }),
-              /* @__PURE__ */ jsx18(
+              /* @__PURE__ */ jsx20(TriangleAlertIcon3, { className: "size-3 shrink-0" }),
+              /* @__PURE__ */ jsx20("span", { className: "min-w-0 flex-1", children: "Not confirmed. Check the queue before retrying." }),
+              /* @__PURE__ */ jsx20(
                 "button",
                 {
                   type: "button",
@@ -9518,25 +10346,26 @@ function GoalPanel({
   if (!record) return null;
   const canToggle = !readOnly && (record.status === "active" || record.status === "paused");
   const explanation = sessionChromeGoalPillExplanation(state, record);
-  return /* @__PURE__ */ jsxs13("div", { className: "space-y-1.5", "data-og-session-chrome-panel": "goal", children: [
-    /* @__PURE__ */ jsxs13("div", { className: "flex flex-wrap items-center gap-1.5 text-[10px] font-medium uppercase tracking-wider text-og-fg-subtle", children: [
-      /* @__PURE__ */ jsx18("span", { children: sessionChromeGoalPillLabel(state, record) }),
-      elapsed ? /* @__PURE__ */ jsxs13("span", { className: "tabular-nums normal-case tracking-normal text-og-fg-muted", children: [
-        "\xB7 ",
-        elapsed
+  return /* @__PURE__ */ jsxs15("div", { className: "space-y-1.5", "data-og-session-chrome-panel": "goal", children: [
+    /* @__PURE__ */ jsxs15("div", { className: "flex flex-wrap items-center gap-1.5 text-[10px] font-medium uppercase tracking-wider text-og-fg-subtle", children: [
+      /* @__PURE__ */ jsx20("span", { children: sessionChromeGoalPillLabel(state, record) }),
+      elapsed ? /* @__PURE__ */ jsxs15("span", { className: "tabular-nums normal-case tracking-normal text-og-fg-muted", children: [
+        "\xB7 Created ",
+        elapsed,
+        " ago"
       ] }) : null,
-      /* @__PURE__ */ jsxs13("span", { className: "normal-case tracking-normal text-og-fg-muted", children: [
+      /* @__PURE__ */ jsxs15("span", { className: "normal-case tracking-normal text-og-fg-muted", children: [
         "\xB7 v",
         record.version
       ] })
     ] }),
-    /* @__PURE__ */ jsx18("p", { className: "text-og-sm leading-5 text-og-fg", children: record.text }),
-    record.successCriteria ? /* @__PURE__ */ jsxs13("p", { className: "text-og-xs leading-4 text-og-fg-muted", children: [
-      /* @__PURE__ */ jsx18("span", { className: "font-medium text-og-fg", children: "Done when" }),
+    /* @__PURE__ */ jsx20("p", { className: "text-og-sm leading-5 text-og-fg", children: record.text }),
+    record.successCriteria ? /* @__PURE__ */ jsxs15("p", { className: "text-og-xs leading-4 text-og-fg-muted", children: [
+      /* @__PURE__ */ jsx20("span", { className: "font-medium text-og-fg", children: "Done when" }),
       " ",
       record.successCriteria
     ] }) : null,
-    explanation ? /* @__PURE__ */ jsx18(
+    explanation ? /* @__PURE__ */ jsx20(
       "p",
       {
         "data-og-session-chrome-goal-explanation": true,
@@ -9544,20 +10373,20 @@ function GoalPanel({
         children: explanation
       }
     ) : null,
-    record.continuation?.lastError ? /* @__PURE__ */ jsx18("p", { className: "rounded-og-sm bg-og-status-waiting/10 px-1.5 py-1 text-og-xs leading-4 text-og-status-waiting", children: record.continuation.lastError }) : null,
-    /* @__PURE__ */ jsxs13("div", { className: "flex flex-wrap items-center justify-between gap-1.5 pt-0.5", children: [
-      /* @__PURE__ */ jsxs13("div", { className: "flex flex-wrap gap-1 text-[10px] text-og-fg-muted", children: [
-        /* @__PURE__ */ jsxs13("span", { className: "rounded bg-og-surface-3/70 px-1 py-px", children: [
+    record.continuation?.lastError ? /* @__PURE__ */ jsx20("p", { className: "rounded-og-sm bg-og-status-waiting/10 px-1.5 py-1 text-og-xs leading-4 text-og-status-waiting", children: record.continuation.lastError }) : null,
+    /* @__PURE__ */ jsxs15("div", { className: "flex flex-wrap items-center justify-between gap-1.5 pt-0.5", children: [
+      /* @__PURE__ */ jsxs15("div", { className: "flex flex-wrap gap-1 text-[10px] text-og-fg-muted", children: [
+        /* @__PURE__ */ jsxs15("span", { className: "rounded bg-og-surface-3/70 px-1 py-px", children: [
           record.autoContinuations,
           " consecutive unattended continues"
         ] }),
-        /* @__PURE__ */ jsxs13("span", { className: "rounded bg-og-surface-3/70 px-1 py-px", children: [
+        /* @__PURE__ */ jsxs15("span", { className: "rounded bg-og-surface-3/70 px-1 py-px", children: [
           record.noProgressStreak,
           " stalled"
         ] })
       ] }),
-      !readOnly ? /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-0.5", children: [
-        canToggle ? /* @__PURE__ */ jsxs13(
+      !readOnly ? /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-0.5", children: [
+        canToggle ? /* @__PURE__ */ jsxs15(
           "button",
           {
             type: "button",
@@ -9565,12 +10394,12 @@ function GoalPanel({
             onClick: () => void (record.status === "paused" ? goal.resume() : goal.pause("Paused from session chrome")),
             className: "inline-flex h-6 items-center gap-1 rounded-og-sm px-1.5 text-og-xs font-medium text-og-fg-muted outline-hidden transition-colors hover:bg-og-surface-3/70 hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent/40 disabled:opacity-50",
             children: [
-              goal.updating ? /* @__PURE__ */ jsx18(Loader2Icon2, { className: "size-3 animate-og-spin" }) : record.status === "paused" ? /* @__PURE__ */ jsx18(PlayIcon2, { className: "size-3" }) : /* @__PURE__ */ jsx18(PauseIcon2, { className: "size-3" }),
+              goal.updating ? /* @__PURE__ */ jsx20(Loader2Icon2, { className: "size-3 animate-og-spin" }) : record.status === "paused" ? /* @__PURE__ */ jsx20(PlayIcon2, { className: "size-3" }) : /* @__PURE__ */ jsx20(PauseIcon2, { className: "size-3" }),
               record.status === "paused" ? "Resume" : "Pause"
             ]
           }
         ) : null,
-        /* @__PURE__ */ jsxs13(
+        /* @__PURE__ */ jsxs15(
           "button",
           {
             type: "button",
@@ -9578,7 +10407,7 @@ function GoalPanel({
             onClick: () => void goal.deleteGoal(),
             className: "inline-flex h-6 items-center gap-1 rounded-og-sm px-1.5 text-og-xs font-medium text-og-fg-subtle outline-hidden transition-colors hover:bg-og-surface-3/70 hover:text-og-danger focus-visible:ring-2 focus-visible:ring-og-accent/40 disabled:opacity-50",
             children: [
-              /* @__PURE__ */ jsx18(Trash2Icon2, { className: "size-3" }),
+              /* @__PURE__ */ jsx20(Trash2Icon2, { className: "size-3" }),
               "Clear"
             ]
           }
@@ -9587,13 +10416,14 @@ function GoalPanel({
     ] })
   ] });
 }
-var QUEUE_STEER_TIP = /* @__PURE__ */ jsxs13("span", { className: "flex flex-col gap-0.5 text-left", children: [
-  /* @__PURE__ */ jsx18("span", { className: "font-medium", children: "Steer" }),
-  /* @__PURE__ */ jsx18("span", { className: "opacity-80", children: "Interrupt the current turn and send this message now" })
+var QUEUE_STEER_TIP = /* @__PURE__ */ jsxs15("span", { className: "flex flex-col gap-0.5 text-left", children: [
+  /* @__PURE__ */ jsx20("span", { className: "font-medium", children: "Steer" }),
+  /* @__PURE__ */ jsx20("span", { className: "opacity-80", children: "Interrupt the current turn and send this message now" })
 ] });
 var QUEUE_EDIT_TIP = "Edit in composer";
 var QUEUE_DELETE_TIP = "Delete this queued prompt";
 function IconAction({
+  text,
   label,
   tip,
   onClick,
@@ -9601,8 +10431,8 @@ function IconAction({
   danger,
   children
 }) {
-  return /* @__PURE__ */ jsxs13(Tooltip, { children: [
-    /* @__PURE__ */ jsx18(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsxs15(Tooltip, { children: [
+    /* @__PURE__ */ jsx20(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs15(
       "button",
       {
         type: "button",
@@ -9610,15 +10440,110 @@ function IconAction({
         disabled,
         onClick,
         className: cn(
-          "inline-flex size-6 items-center justify-center rounded-og-sm text-og-fg-subtle outline-hidden transition-colors",
+          "inline-flex size-6 items-center justify-center rounded-og-sm outline-hidden transition-colors",
           "hover:bg-og-surface-2 hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent/40",
           "disabled:pointer-events-none disabled:opacity-40 pointer-coarse:size-9",
+          text ? "text-og-fg" : "text-og-fg-subtle",
+          text && "w-auto gap-1 px-1.5 text-og-xs pointer-coarse:w-auto",
           danger && "hover:text-og-danger"
         ),
-        children
+        children: [
+          children,
+          text
+        ]
       }
     ) }),
-    /* @__PURE__ */ jsx18(TooltipContent, { side: "top", children: tip })
+    /* @__PURE__ */ jsx20(TooltipContent, { side: "top", children: tip })
+  ] });
+}
+
+// src/components/session-commands-panel.tsx
+import { ChevronRightIcon as ChevronRightIcon4, Loader2Icon as Loader2Icon3, SquareIcon } from "lucide-react";
+import { useState as useState14 } from "react";
+import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
+function SessionCommandsPanel({
+  commands: state,
+  readOnly = false
+}) {
+  const [pending, setPending] = useState14(null);
+  const [error, setError] = useState14(null);
+  const active = state.commands.filter(
+    (command) => command.state === "running" || command.state === "stopping"
+  );
+  const stop = async (id) => {
+    setPending(id);
+    setError(null);
+    try {
+      await state.cancel(id);
+    } catch (cause) {
+      setError(cause instanceof Error ? cause.message : "Stop was not confirmed. Try again.");
+    } finally {
+      setPending(null);
+    }
+  };
+  return /* @__PURE__ */ jsxs16("div", { className: "space-y-2 text-og-xs", "data-og-session-commands": "", children: [
+    state.loading && active.length === 0 ? /* @__PURE__ */ jsx21("p", { role: "status", className: "text-og-fg-muted", children: "Loading commands\u2026" }) : null,
+    state.error ? /* @__PURE__ */ jsxs16("div", { role: "alert", className: "flex items-center justify-between gap-2 text-og-danger", children: [
+      /* @__PURE__ */ jsx21("span", { children: "Commands unavailable." }),
+      /* @__PURE__ */ jsx21(
+        "button",
+        {
+          type: "button",
+          className: "underline outline-hidden focus-visible:ring-2 focus-visible:ring-og-accent/40",
+          onClick: () => void state.refresh(),
+          children: "Retry"
+        }
+      )
+    ] }) : null,
+    !state.loading && !state.error && active.length === 0 ? /* @__PURE__ */ jsx21("p", { role: "status", className: "text-og-fg-muted", children: "No background commands running." }) : null,
+    active.length > 0 ? /* @__PURE__ */ jsx21("ul", { className: "max-h-64 overflow-y-auto overscroll-contain divide-y divide-og-border/40", children: active.map((command) => /* @__PURE__ */ jsxs16("li", { className: "flex items-start gap-3 py-2 first:pt-0 last:pb-0", children: [
+      /* @__PURE__ */ jsxs16("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxs16("details", { className: "group/command", children: [
+          /* @__PURE__ */ jsxs16(
+            "summary",
+            {
+              className: "flex cursor-pointer list-none items-center gap-1.5 rounded-og-sm font-mono text-og-fg outline-hidden focus-visible:ring-2 focus-visible:ring-og-accent/40",
+              title: "Expand command",
+              children: [
+                /* @__PURE__ */ jsx21(ChevronRightIcon4, { className: "size-3 shrink-0 text-og-fg-subtle transition-transform group-open/command:rotate-90" }),
+                /* @__PURE__ */ jsx21("span", { className: "truncate", children: command.commandPreview || "Background command" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs16("div", { className: "mt-2 space-y-1", children: [
+            /* @__PURE__ */ jsx21("p", { className: "whitespace-pre-wrap break-all font-mono text-og-fg-muted", children: command.commandPreview || "Background command" }),
+            /* @__PURE__ */ jsxs16(
+              "time",
+              {
+                className: "block text-og-fg-subtle",
+                dateTime: command.startedAt,
+                title: new Date(command.startedAt).toLocaleString(),
+                children: [
+                  "Started ",
+                  formatClockTime(command.startedAt)
+                ]
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx21("p", { className: "mt-1 text-og-fg-subtle", children: command.state === "stopping" ? "Stopping\u2026" : "Running" })
+      ] }),
+      !readOnly ? /* @__PURE__ */ jsxs16(
+        "button",
+        {
+          type: "button",
+          "aria-label": `Stop ${command.commandPreview || "background command"}`,
+          disabled: pending !== null || command.state === "stopping",
+          onClick: () => void stop(command.id),
+          className: "inline-flex min-h-7 shrink-0 items-center gap-1 rounded-og-sm px-2 text-og-fg-muted outline-hidden hover:bg-og-surface-3/70 hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent/40 disabled:opacity-50 pointer-coarse:min-h-11",
+          children: [
+            pending === command.id || command.state === "stopping" ? /* @__PURE__ */ jsx21(Loader2Icon3, { className: "size-3 animate-og-spin motion-reduce:animate-none" }) : /* @__PURE__ */ jsx21(SquareIcon, { className: "size-3" }),
+            "Stop"
+          ]
+        }
+      ) : null
+    ] }, command.id)) }) : null,
+    error ? /* @__PURE__ */ jsx21("p", { role: "alert", className: "text-og-danger", children: error }) : null
   ] });
 }
 
@@ -9676,9 +10601,14 @@ export {
   MessageTimeline,
   TimelineRow,
   QueueSurface,
+  useAvailableModels,
+  useWorkspaceModelCatalog,
+  ChatComposer,
+  SessionConversation,
   sessionChromeGoalPillLabel,
   sessionChromeGoalPillExplanation,
   sessionChromeGoalPillState,
-  SessionChrome
+  SessionChrome,
+  SessionCommandsPanel
 };
-//# sourceMappingURL=chunk-DOK4KZF2.js.map
+//# sourceMappingURL=chunk-5IXTJTK3.js.map