@opengeni/react 0.46.1 → 0.52.1

package/dist/interaction.d.ts

@@ -0,0 +1,23 @@
+export type { EmbeddedBrowserInteractionClientLike, EmbeddedComputerInteractionClientLike, EmbeddedInteractionClientLike, } from "./client.js";
+export { useEmbeddedBrowserInteraction, useEmbeddedComputerInteraction, useEmbeddedInteraction, } from "./session-context.js";
+export type { EmbeddedBrowserInteractionClientOverride, EmbeddedComputerInteractionClientOverride, EmbeddedInteractionClientOverride, } from "./session-context.js";
+export { useAttachedBrowsers } from "./hooks/use-attached-browsers.js";
+export type { AttachedBrowsersClient, UseAttachedBrowsersOptions, UseAttachedBrowsersResult, } from "./hooks/use-attached-browsers.js";
+export { useBrowserSessions } from "./hooks/use-browser-sessions.js";
+export type { BrowserSessionsClient, UseBrowserSessionsOptions, UseBrowserSessionsResult, } from "./hooks/use-browser-sessions.js";
+export { useBrowserIdentities } from "./hooks/use-browser-identities.js";
+export type { BrowserIdentitiesClient, UseBrowserIdentitiesOptions, UseBrowserIdentitiesResult, } from "./hooks/use-browser-identities.js";
+export { useBrowserSession } from "./hooks/use-browser-session.js";
+export type { UseBrowserSessionOptions, UseBrowserSessionResult, } from "./hooks/use-browser-session.js";
+export { useBrowserFrameStream } from "./hooks/use-browser-frame-stream.js";
+export type { BrowserFrameConnectionState, BrowserFrameWebSocket, BrowserFrameWebSocketFactory, UseBrowserFrameStreamOptions, UseBrowserFrameStreamResult, } from "./hooks/use-browser-frame-stream.js";
+export { BrowserViewer } from "./components/browser-viewer.js";
+export type { BrowserViewerNotification, BrowserViewerProps } from "./components/browser-viewer.js";
+export { useComputerSessions } from "./hooks/use-computer-sessions.js";
+export type { ComputerSessionsClient, UseComputerSessionsOptions, UseComputerSessionsResult, } from "./hooks/use-computer-sessions.js";
+export { useComputerSession } from "./hooks/use-computer-session.js";
+export type { UseComputerSessionOptions, UseComputerSessionResult, } from "./hooks/use-computer-session.js";
+export { useComputerFrameStream } from "./hooks/use-computer-frame-stream.js";
+export type { ComputerFrameConnectionState, ComputerFrameWebSocket, ComputerFrameWebSocketFactory, UseComputerFrameStreamOptions, UseComputerFrameStreamResult, } from "./hooks/use-computer-frame-stream.js";
+export { ComputerViewer } from "./components/computer-viewer.js";
+export type { ComputerViewerNotification, ComputerViewerProps } from "./components/computer-viewer.js";

package/dist/interaction.js

@@ -0,0 +1,36 @@
+import {
+  BrowserViewer,
+  ComputerViewer,
+  useAttachedBrowsers,
+  useBrowserFrameStream,
+  useBrowserIdentities,
+  useBrowserSession,
+  useBrowserSessions,
+  useComputerFrameStream,
+  useComputerSession,
+  useComputerSessions
+} from "./chunk-7I2KB3OK.js";
+import "./chunk-6BBWWOOU.js";
+import "./chunk-KZ73RL76.js";
+import {
+  useEmbeddedBrowserInteraction,
+  useEmbeddedComputerInteraction,
+  useEmbeddedInteraction
+} from "./chunk-HDBG7XGO.js";
+import "./chunk-22KP6LR5.js";
+export {
+  BrowserViewer,
+  ComputerViewer,
+  useAttachedBrowsers,
+  useBrowserFrameStream,
+  useBrowserIdentities,
+  useBrowserSession,
+  useBrowserSessions,
+  useComputerFrameStream,
+  useComputerSession,
+  useComputerSessions,
+  useEmbeddedBrowserInteraction,
+  useEmbeddedComputerInteraction,
+  useEmbeddedInteraction
+};
+//# sourceMappingURL=interaction.js.map

package/dist/interaction.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/interactive-workbench-viewers-KHNOHWQE.js

@@ -0,0 +1,13 @@
+import {
+  BrowserViewer,
+  ComputerViewer
+} from "./chunk-7I2KB3OK.js";
+import "./chunk-6BBWWOOU.js";
+import "./chunk-KZ73RL76.js";
+import "./chunk-HDBG7XGO.js";
+import "./chunk-22KP6LR5.js";
+export {
+  BrowserViewer,
+  ComputerViewer
+};
+//# sourceMappingURL=interactive-workbench-viewers-KHNOHWQE.js.map

package/dist/interactive-workbench-viewers-KHNOHWQE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/lib/composer-responsive-context.d.ts

@@ -0,0 +1,9 @@
+import { type RefObject } from "react";
+/** The measurement surface used by responsive composer chrome. */
+export type ResponsiveBasis = "viewport" | "container";
+export type ComposerResponsiveContextValue = {
+    responsiveBasis: ResponsiveBasis;
+    rootRef: RefObject<HTMLDivElement | null>;
+};
+export declare const ComposerResponsiveContext: import("react").Context<ComposerResponsiveContextValue | null>;
+export declare function useComposerResponsiveContext(): ComposerResponsiveContextValue | null;

package/dist/lib/relay-wire.d.ts

@@ -1,5 +1,9 @@
 /** `StreamKind.STREAM_KIND_DESKTOP` (agent-proto enum value). */
 export declare const STREAM_KIND_DESKTOP = 2;
+/** `StreamKind.STREAM_KIND_BROWSER` (agent-proto enum value). */
+export declare const STREAM_KIND_BROWSER = 3;
+/** `StreamKind.STREAM_KIND_COMPUTER` (agent-proto enum value). */
+export declare const STREAM_KIND_COMPUTER = 4;
 /** `StreamRole.STREAM_ROLE_CLIENT` (agent-proto enum value). */
 export declare const STREAM_ROLE_CLIENT = 2;
 export interface RelayChannel {

package/dist/lib/sandbox-liveness.d.ts

@@ -0,0 +1,9 @@
+/**
+ * A sandbox is available for new I/O only after a holder has observed `warm`.
+ *
+ * `draining` means the holder count is zero and teardown owns the provider
+ * instance. The provider may disappear before the durable lease reaches `cold`,
+ * so treating `draining` as live races capture/termination. Explicit user intent
+ * reacquires a holder; only its subsequent `warm` state re-enables live I/O.
+ */
+export declare function sandboxAcceptsLiveIo(liveness: string | null | undefined): boolean;

package/dist/lib/terminal-capability.d.ts

@@ -0,0 +1,5 @@
+import type { TerminalCapability } from "@opengeni/sdk";
+/** Whether an explicit viewer grant can upgrade this cell to a real PTY.
+ * Keep acquisition feasibility separate from the current transport: a cold
+ * real-PTY backend reports sse-events until the just-in-time grant warms it. */
+export declare function terminalCanAcquirePty(cell: TerminalCapability | null | undefined): boolean;

package/dist/lib/use-portal-token-style.d.ts

@@ -1,9 +1,20 @@
-import { type CSSProperties, type RefObject } from "react";
-export type PortalTokenStyle = CSSProperties & Record<`--${string}`, string>;
+import { type CSSProperties, type RefCallback, type RefObject } from "react";
+export type PortalTokenStyle = Pick<CSSProperties, "colorScheme"> & Partial<Record<`--${string}`, string>>;
+export declare const PORTAL_SOURCE_INLINE_SIZE = "--og-portal-source-inline-size";
+/**
+ * A callback ref that publishes the currently mounted source element through
+ * React state. Unlike a bare mutable ref, late mounts and replacements cause
+ * consumers to render and restart their observers without polling.
+ */
+export declare function usePortalTokenSource<T extends HTMLElement>(): {
+    source: T | null;
+    currentRef: RefObject<T | null>;
+    ref: RefCallback<T>;
+};
 /**
  * Copy the effective SDK tokens across a portal boundary. A locally themed or
  * rebranded embed cannot rely on CSS inheritance once a portal mounts under
  * `<body>`. Ancestor theme/class/style mutations and OS color-scheme changes
  * keep the copied values live.
  */
-export declare function usePortalTokenStyle(sourceRef: RefObject<HTMLElement | null>): PortalTokenStyle;
+export declare function usePortalTokenStyle(source: HTMLElement | null): PortalTokenStyle;

package/dist/lib/xterm-theme.d.ts

@@ -1,4 +1,4 @@
-import type { XtermTheme } from "../components/sandbox-terminal";
+import type { XtermTheme } from "../components/sandbox-terminal.js";
 export type ThemeMode = "dark" | "light";
 /** Reads a resolved token value (already `getComputedStyle`-flattened). */
 export type TokenReader = (name: string) => string | undefined;

package/dist/machines.d.ts

@@ -1,30 +1,30 @@
-export type { ConnectionStatus, MachineKind, MachineMetricsSeriesResponse, MachineState, MachineView, MachinesResponse, MetricSample, } from "./types/machines";
-export { connectionStatusForState } from "./types/machines";
-export { ConnectionDot, ConnectionStatusPill, MachineStatusPill, CONNECTION_STATUS_META, MACHINE_STATE_BADGE_META, } from "./components/machine-status-pill";
-export type { ConnectionDotProps, ConnectionStatusMeta, ConnectionStatusPillProps, MachineStateBadgeMeta, MachineStatusPillProps, } from "./components/machine-status-pill";
-export { MachineMetrics } from "./components/machine-metrics";
-export type { MachineMetricsProps } from "./components/machine-metrics";
-export { MachineCard } from "./components/machine-card";
-export type { MachineCardProps } from "./components/machine-card";
-export { MachineHealthPill } from "./components/machine-health-pill";
-export type { MachineHealthPillProps } from "./components/machine-health-pill";
-export { deriveHealth, HEALTH_TOKEN, healthPulses } from "./components/machines/health";
-export type { HealthLevel, HealthVerdict } from "./components/machines/health";
-export { MetricSparkline } from "./components/machines/metric-sparkline";
-export type { MetricSparklineProps } from "./components/machines/metric-sparkline";
-export { MetricHistoryChart } from "./components/machines/metric-history-chart";
-export type { MetricHistoryChartProps, SeriesPoint, } from "./components/machines/metric-history-chart";
-export { MachineDetail } from "./components/machines/machine-detail";
-export type { MachineDetailProps } from "./components/machines/machine-detail";
-export { METRICS, METRIC_WINDOWS, WINDOW_LABEL, pointsFor } from "./components/machines/series";
-export type { MetricDef, MetricKey, MetricWindow } from "./components/machines/series";
-export { MachinesDashboard } from "./components/machines-dashboard";
-export type { MachinesDashboardProps } from "./components/machines-dashboard";
-export { MachineDockBar, SharedMachineDisclosure } from "./components/machine-dock-bar";
-export type { MachineDockBarProps, SharedMachineDisclosureProps, } from "./components/machine-dock-bar";
-export { EnrollmentDeviceFlow } from "./components/enrollment-device-flow";
-export type { DeviceFlowPhase, EnrollmentDeviceFlowProps, } from "./components/enrollment-device-flow";
-export { EnrollmentConsent } from "./components/enrollment-consent";
-export type { EnrollmentConsentMachine, EnrollmentConsentPhase, EnrollmentConsentProps, } from "./components/enrollment-consent";
-export { useMachines } from "./hooks/use-machines";
-export type { MachinesClientLike, UseMachinesOptions, UseMachinesResult, } from "./hooks/use-machines";
+export type { ConnectionStatus, MachineKind, MachineMetricsSeriesResponse, MachineState, MachineView, MachinesResponse, MetricSample, } from "./types/machines.js";
+export { connectionStatusForState } from "./types/machines.js";
+export { ConnectionDot, ConnectionStatusPill, MachineStatusPill, CONNECTION_STATUS_META, MACHINE_STATE_BADGE_META, } from "./components/machine-status-pill.js";
+export type { ConnectionDotProps, ConnectionStatusMeta, ConnectionStatusPillProps, MachineStateBadgeMeta, MachineStatusPillProps, } from "./components/machine-status-pill.js";
+export { MachineMetrics } from "./components/machine-metrics.js";
+export type { MachineMetricsProps } from "./components/machine-metrics.js";
+export { MachineCard } from "./components/machine-card.js";
+export type { MachineCardProps } from "./components/machine-card.js";
+export { MachineHealthPill } from "./components/machine-health-pill.js";
+export type { MachineHealthPillProps } from "./components/machine-health-pill.js";
+export { deriveHealth, HEALTH_TOKEN, healthPulses } from "./components/machines/health.js";
+export type { HealthLevel, HealthVerdict } from "./components/machines/health.js";
+export { MetricSparkline } from "./components/machines/metric-sparkline.js";
+export type { MetricSparklineProps } from "./components/machines/metric-sparkline.js";
+export { MetricHistoryChart } from "./components/machines/metric-history-chart.js";
+export type { MetricHistoryChartProps, SeriesPoint, } from "./components/machines/metric-history-chart.js";
+export { MachineDetail } from "./components/machines/machine-detail.js";
+export type { MachineDetailProps } from "./components/machines/machine-detail.js";
+export { METRICS, METRIC_WINDOWS, WINDOW_LABEL, pointsFor } from "./components/machines/series.js";
+export type { MetricDef, MetricKey, MetricWindow } from "./components/machines/series.js";
+export { MachinesDashboard } from "./components/machines-dashboard.js";
+export type { MachinesDashboardProps } from "./components/machines-dashboard.js";
+export { MachineDockBar, SharedMachineDisclosure } from "./components/machine-dock-bar.js";
+export type { MachineDockBarProps, SharedMachineDisclosureProps, } from "./components/machine-dock-bar.js";
+export { EnrollmentDeviceFlow } from "./components/enrollment-device-flow.js";
+export type { DeviceFlowPhase, EnrollmentDeviceFlowProps, } from "./components/enrollment-device-flow.js";
+export { EnrollmentConsent } from "./components/enrollment-consent.js";
+export type { EnrollmentConsentMachine, EnrollmentConsentPhase, EnrollmentConsentProps, } from "./components/enrollment-consent.js";
+export { useMachines } from "./hooks/use-machines.js";
+export type { MachinesClientLike, UseMachinesOptions, UseMachinesResult, } from "./hooks/use-machines.js";

package/dist/machines.js

@@ -24,10 +24,10 @@ import {
   healthPulses,
   pointsFor,
   useMachines
-} from "./chunk-6EDV6YFE.js";
-import "./chunk-EB67J347.js";
-import "./chunk-EKZH6IDG.js";
+} from "./chunk-X4S56Y2H.js";
 import "./chunk-LAKLF4PA.js";
+import "./chunk-KZ73RL76.js";
+import "./chunk-HDBG7XGO.js";
 import "./chunk-22KP6LR5.js";
 export {
   CONNECTION_STATUS_META,

package/dist/provider.d.ts

@@ -1,8 +1,8 @@
 import { type WorkspaceControlEvent } from "@opengeni/sdk";
 import { type ReactNode } from "react";
-import type { SessionClientLike } from "./client";
-export { useOpenGeni, useOpenGeniClient } from "./session-context";
-export type { ClientOverride, OpenGeniContextValue } from "./session-context";
+import type { SessionClientLike } from "./client.js";
+export { useOpenGeni, useOpenGeniClient } from "./session-context.js";
+export type { ClientOverride, OpenGeniContextValue } from "./session-context.js";
 export type OpenGeniProviderProps = {
     client: SessionClientLike;
     workspaceId: string;
@@ -13,4 +13,4 @@ export type OpenGeniProviderProps = {
  * Supplies the OpenGeni client + workspace to all hooks below it. Hooks also
  * accept `{ client, workspaceId }` overrides per call for multi-workspace UIs.
  */
-export declare function OpenGeniProvider({ client, workspaceId, onWorkspaceControlEvent, children, }: OpenGeniProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function OpenGeniProvider({ client, workspaceId, onWorkspaceControlEvent, children, }: OpenGeniProviderProps): import("react").JSX.Element;

package/dist/{queue-surface-implementation-J4XJFKRW.js → queue-surface-implementation-2KVJTYXH.js}

@@ -1,11 +1,14 @@
 import {
   QueueErrorAlert,
   QueueStoppingStatus,
+  TimelineAnnotationsChip,
   requestQueueDraftEdit
-} from "./chunk-VCBFUSUZ.js";
+} from "./chunk-WSK7G5LE.js";
 import {
+  usePortalTokenSource,
   usePortalTokenStyle
-} from "./chunk-JB5725BI.js";
+} from "./chunk-VZTQ73XT.js";
+import "./chunk-22KP6LR5.js";
 
 // src/components/queue-surface-implementation.tsx
 import {
@@ -38,7 +41,6 @@ import {
   useCallback,
   useId,
   useMemo,
-  useRef,
   useState
 } from "react";
 import { DropdownMenu } from "radix-ui";
@@ -56,8 +58,9 @@ function QueueSurface({
   const [replaceDraftFor, setReplaceDraftFor] = useState(null);
   const [announcement, setAnnouncement] = useState("");
   const [draggedTurnId, setDraggedTurnId] = useState(null);
-  const surfaceRef = useRef(null);
-  const portalTokenStyle = usePortalTokenStyle(surfaceRef);
+  const surface = usePortalTokenSource();
+  const surfaceRef = surface.currentRef;
+  const portalTokenStyle = usePortalTokenStyle(surface.source);
   const [keyboardDrag, setKeyboardDrag] = useState(null);
   const count = queue.queue.length;
   const pendingInputCount = queue.pendingInputs.length;
@@ -68,13 +71,13 @@ function QueueSurface({
     (input) => !attachedInputIds.includes(input.id)
   );
   const canEditInComposer = queueComposerCheckoutEnabled(composer, readOnly);
-  const collapsedPreview = useMemo(
-    () => queuePromptPreview(
-      queue.queue[0]?.prompt ?? queue.pendingInputs[0]?.summary ?? "",
+  const collapsedPreview = useMemo(() => {
+    const firstTurn = queue.queue[0];
+    return firstTurn ? queueTurnPreview(firstTurn, QUEUE_COLLAPSED_PREVIEW_CHARACTERS) : queuePromptPreview(
+      queue.pendingInputs[0]?.summary ?? "",
       QUEUE_COLLAPSED_PREVIEW_CHARACTERS
-    ),
-    [queue.pendingInputs, queue.queue]
-  );
+    );
+  }, [queue.pendingInputs, queue.queue]);
   const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: { distance: 6 } }));
   const displayedQueue = useMemo(() => {
     if (!keyboardDrag) return queue.queue;
@@ -97,7 +100,7 @@ function QueueSurface({
       );
       if (moved) focusQueueTurn(surfaceRef.current, turnId);
     },
-    [queue]
+    [queue, surfaceRef]
   );
   const onDragEnd = useCallback(
     (event) => {
@@ -204,7 +207,7 @@ function QueueSurface({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      ref: surfaceRef,
+      ref: surface.ref,
       className: "og-root mx-auto mb-2 w-full max-w-3xl shrink-0 px-4 sm:px-6",
       "data-testid": "queue-surface",
       children: [
@@ -214,7 +217,7 @@ function QueueSurface({
             "button",
             {
               type: "button",
-              className: "flex w-full min-w-0 flex-wrap items-center gap-2 px-3 py-2 text-left outline-none transition-colors hover:bg-surface-2/60 focus-visible:bg-surface-2/60 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring/40 pointer-coarse:min-h-[44px]",
+              className: "flex w-full min-w-0 flex-wrap items-center gap-2 px-3 py-2 text-left outline-hidden transition-colors hover:bg-surface-2/60 focus-visible:bg-surface-2/60 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring/40 pointer-coarse:min-h-[44px]",
               onClick: () => setOpen((value) => !value),
               "aria-description": !open && totalCount > 0 ? collapsedPreview.summary : void 0,
               "aria-expanded": open,
@@ -342,8 +345,8 @@ function QueueSurface({
                         "aria-hidden": "true",
                         className: "line-clamp-3 break-all whitespace-pre-wrap [unicode-bidi:plaintext]",
                         dir: "auto",
-                        children: queuePromptPreview(
-                          queue.queue.find((turn) => turn.id === draggedTurnId)?.prompt ?? "",
+                        children: queueTurnPreview(
+                          queue.queue.find((turn) => turn.id === draggedTurnId),
                           QUEUE_ROW_PREVIEW_CHARACTERS
                         ).summary
                       }
@@ -391,6 +394,22 @@ var QUEUE_VISIBLE_END_IDENTITY_CHARACTERS = 18;
 var QUEUE_PREVIEW_SEPARATOR = " \u2026 ";
 var queuePreviewSegmenter = new Intl.Segmenter(void 0, { granularity: "grapheme" });
 var queuePromptNonRenderingCodePoint = /[\p{White_Space}\p{Control}\p{Default_Ignorable_Code_Point}]/u;
+function annotationOnlyQueuePreview(count) {
+  const summary = `${count} timeline ${count === 1 ? "annotation" : "annotations"}`;
+  return {
+    summary,
+    collapsedVisual: summary,
+    visibleStart: summary,
+    visibleIdentity: null,
+    visibleIdentityLabel: null,
+    isFallback: false
+  };
+}
+function queueTurnPreview(turn, maxCharacters) {
+  if (!turn) return queuePromptPreview("", maxCharacters);
+  const annotations = turn.annotations ?? [];
+  return turn.prompt.length === 0 && annotations.length > 0 ? annotationOnlyQueuePreview(annotations.length) : queuePromptPreview(turn.prompt, maxCharacters);
+}
 function queuePromptPreview(prompt, maxCharacters) {
   const wholePromptProbe = samplePromptStart(prompt, maxCharacters + 1);
   if (!wholePromptProbe.truncated && wholePromptProbe.characters <= maxCharacters) {
@@ -586,14 +605,18 @@ function isLowSurrogate(codeUnit) {
 }
 function QueuePrompt({
   prompt,
+  annotations,
   index,
   onDisclosureChange
 }) {
   const [expanded, setExpanded] = useState(false);
   const fullContentId = useId();
-  const preview = useMemo(() => queuePromptPreview(prompt, QUEUE_ROW_PREVIEW_CHARACTERS), [prompt]);
+  const preview = useMemo(
+    () => prompt.length === 0 && annotations.length > 0 ? annotationOnlyQueuePreview(annotations.length) : queuePromptPreview(prompt, QUEUE_ROW_PREVIEW_CHARACTERS),
+    [annotations.length, prompt]
+  );
   return /* @__PURE__ */ jsxs("div", { className: "w-full min-w-0 max-w-full", children: [
-    /* @__PURE__ */ jsx(
+    prompt ? /* @__PURE__ */ jsx(
       "div",
       {
         "aria-label": `Queued prompt ${index + 1} summary: ${preview.summary}`,
@@ -601,46 +624,60 @@ function QueuePrompt({
         "data-testid": `queue-prompt-preview-${index + 1}`,
         dir: "auto",
         role: "note",
-        children: /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: "flex min-w-0 max-w-full items-baseline gap-2 sm:block", children: [
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: `${preview.isFallback ? "" : "line-clamp-1 sm:line-clamp-2"} min-w-0 flex-1 whitespace-pre-wrap break-all [unicode-bidi:plaintext]`,
-              "data-testid": `queue-prompt-start-${index + 1}`,
-              dir: "auto",
-              children: preview.visibleStart
-            }
-          ),
-          preview.visibleIdentity && preview.visibleIdentityLabel ? /* @__PURE__ */ jsxs(
-            "span",
-            {
-              className: "flex min-w-0 max-w-[70%] shrink-0 items-center gap-1 text-og-xs leading-4 text-fg-muted sm:mt-0.5 sm:max-w-full",
-              "data-testid": `queue-prompt-identity-row-${index + 1}`,
-              children: [
-                /* @__PURE__ */ jsx("span", { className: "shrink-0 font-medium text-fg-subtle", children: preview.visibleIdentityLabel }),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    className: "min-w-0 overflow-hidden text-ellipsis whitespace-nowrap font-mono [unicode-bidi:plaintext]",
-                    "data-testid": `queue-prompt-identity-${index + 1}`,
-                    dir: "auto",
-                    children: preview.visibleIdentity
-                  }
-                )
-              ]
-            }
-          ) : null
-        ] })
+        children: /* @__PURE__ */ jsxs(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: "flex min-w-0 max-w-full items-baseline gap-2 sm:block",
+            children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: `${preview.isFallback ? "" : "line-clamp-1 sm:line-clamp-2"} min-w-0 flex-1 whitespace-pre-wrap break-all [unicode-bidi:plaintext]`,
+                  "data-testid": `queue-prompt-start-${index + 1}`,
+                  dir: "auto",
+                  children: preview.visibleStart
+                }
+              ),
+              preview.visibleIdentity && preview.visibleIdentityLabel ? /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: "flex min-w-0 max-w-[70%] shrink-0 items-center gap-1 text-og-xs leading-4 text-fg-muted sm:mt-0.5 sm:max-w-full",
+                  "data-testid": `queue-prompt-identity-row-${index + 1}`,
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "shrink-0 font-medium text-fg-subtle", children: preview.visibleIdentityLabel }),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: "min-w-0 overflow-hidden text-ellipsis whitespace-nowrap font-mono [unicode-bidi:plaintext]",
+                        "data-testid": `queue-prompt-identity-${index + 1}`,
+                        dir: "auto",
+                        children: preview.visibleIdentity
+                      }
+                    )
+                  ]
+                }
+              ) : null
+            ]
+          }
+        )
+      }
+    ) : null,
+    annotations.length > 0 ? /* @__PURE__ */ jsx(
+      TimelineAnnotationsChip,
+      {
+        annotations,
+        className: prompt ? "mt-1" : void 0
       }
-    ),
-    /* @__PURE__ */ jsxs(
+    ) : null,
+    prompt ? /* @__PURE__ */ jsxs(
       "button",
       {
         type: "button",
         "aria-controls": fullContentId,
         "aria-expanded": expanded,
         "aria-label": `${expanded ? "Hide" : "Show"} full content for queued prompt ${index + 1}`,
-        className: "mt-1 inline-flex min-h-7 min-w-0 max-w-full items-center gap-1 whitespace-normal rounded-md text-left text-og-xs font-medium text-fg outline-none focus-visible:ring-2 focus-visible:ring-ring/40 pointer-coarse:min-h-[44px]",
+        className: "mt-1 inline-flex min-h-7 min-w-0 max-w-full items-center gap-1 whitespace-normal rounded-md text-left text-og-xs font-medium text-fg outline-hidden focus-visible:ring-2 focus-visible:ring-ring/40 pointer-coarse:min-h-[44px]",
         "data-testid": `queue-prompt-disclosure-${index + 1}`,
         onClick: () => {
           const next = !expanded;
@@ -658,8 +695,8 @@ function QueuePrompt({
           expanded ? "Hide full prompt" : "View full prompt"
         ]
       }
-    ),
-    expanded ? /* @__PURE__ */ jsx(
+    ) : null,
+    expanded && prompt ? /* @__PURE__ */ jsx(
       "pre",
       {
         id: fullContentId,
@@ -683,7 +720,15 @@ function ReadOnlyQueueRow({
   return /* @__PURE__ */ jsxs("li", { className: "flex min-w-0 items-start gap-2 bg-surface px-3 py-2", children: [
     /* @__PURE__ */ jsx("span", { className: "mt-1 shrink-0 font-mono text-og-xs text-fg-subtle", children: index + 1 }),
     /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsx(QueuePrompt, { prompt: turn.prompt, index, onDisclosureChange }),
+      /* @__PURE__ */ jsx(
+        QueuePrompt,
+        {
+          prompt: turn.prompt,
+          annotations: turn.annotations ?? [],
+          index,
+          onDisclosureChange
+        }
+      ),
       attachedInputs.length > 0 ? /* @__PURE__ */ jsx(PendingMachineInputs, { inputs: attachedInputs, attached: true }) : null,
       /* @__PURE__ */ jsxs("div", { className: "mt-1 flex min-w-0 items-center gap-2 overflow-hidden whitespace-nowrap text-og-xs text-fg-subtle", children: [
         turn.resources.length > 0 ? /* @__PURE__ */ jsxs("span", { className: "shrink-0", children: [
@@ -754,7 +799,15 @@ function SortableQueueRow({
           ),
           /* @__PURE__ */ jsx("span", { className: "col-start-2 row-start-1 mt-1 shrink-0 font-mono text-og-xs text-fg-subtle", children: index + 1 }),
           /* @__PURE__ */ jsxs("div", { className: "col-span-full row-start-2 min-w-0 sm:col-span-1 sm:col-start-3 sm:row-start-1", children: [
-            /* @__PURE__ */ jsx(QueuePrompt, { prompt: turn.prompt, index, onDisclosureChange }),
+            /* @__PURE__ */ jsx(
+              QueuePrompt,
+              {
+                prompt: turn.prompt,
+                annotations: turn.annotations ?? [],
+                index,
+                onDisclosureChange
+              }
+            ),
             attachedInputs.length > 0 ? /* @__PURE__ */ jsx(PendingMachineInputs, { inputs: attachedInputs, attached: true }) : null,
             /* @__PURE__ */ jsxs("div", { className: "mt-1 flex min-w-0 items-center gap-2 overflow-hidden whitespace-nowrap text-og-xs text-fg-subtle", children: [
               turn.resources.length > 0 ? /* @__PURE__ */ jsxs("span", { className: "shrink-0", children: [
@@ -780,7 +833,7 @@ function SortableQueueRow({
                 onClick: onSteer,
                 "aria-label": `Steer queued prompt ${index + 1}`,
                 title: "Steer \u2014 interrupt the current turn and send this message now",
-                className: "inline-flex h-7 shrink-0 items-center justify-center gap-1 rounded-md px-2 text-og-control font-medium text-fg outline-none transition-[background-color] hover:bg-surface-2 focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 pointer-coarse:min-h-[44px] pointer-coarse:min-w-[44px]",
+                className: "inline-flex h-7 shrink-0 items-center justify-center gap-1 rounded-md px-2 text-og-control font-medium text-fg outline-hidden transition-[background-color] hover:bg-surface-2 focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 pointer-coarse:min-h-[44px] pointer-coarse:min-w-[44px]",
                 children: [
                   pending === "steer" ? /* @__PURE__ */ jsx(Loader2Icon, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ jsx(ZapIcon, { className: "size-3.5" }),
                   /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: "Steer" })
@@ -795,7 +848,7 @@ function SortableQueueRow({
                 onClick: onDelete,
                 "aria-label": `Delete queued prompt ${index + 1}`,
                 title: "Delete this queued prompt",
-                className: "inline-flex size-7 shrink-0 items-center justify-center rounded-md outline-none transition-colors hover:bg-surface-2 hover:text-status-failed focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 pointer-coarse:size-[44px]",
+                className: "inline-flex size-7 shrink-0 items-center justify-center rounded-md outline-hidden transition-colors hover:bg-surface-2 hover:text-status-failed focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 pointer-coarse:size-[44px]",
                 children: pending === "delete" ? /* @__PURE__ */ jsx(Loader2Icon, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ jsx(Trash2Icon, { className: "size-3.5" })
               }
             ),
@@ -806,7 +859,7 @@ function SortableQueueRow({
                   type: "button",
                   disabled: pending !== null,
                   "aria-label": `More actions for queued prompt ${index + 1}`,
-                  className: "inline-flex size-7 shrink-0 items-center justify-center rounded-md outline-none transition-colors hover:bg-surface-2 focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 pointer-coarse:size-[44px]",
+                  className: "inline-flex size-7 shrink-0 items-center justify-center rounded-md outline-hidden transition-colors hover:bg-surface-2 focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 pointer-coarse:size-[44px]",
                   children: pending && pending !== "steer" && pending !== "delete" ? /* @__PURE__ */ jsx(Loader2Icon, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ jsx(EllipsisIcon, { className: "size-3.5" })
                 }
               ) }),
@@ -823,7 +876,7 @@ function SortableQueueRow({
                       /* @__PURE__ */ jsxs(
                         DropdownMenu.Item,
                         {
-                          className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-none focus:bg-surface-2 pointer-coarse:min-h-[44px]",
+                          className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-hidden focus:bg-surface-2 pointer-coarse:min-h-[44px]",
                           onSelect: onEdit,
                           children: [
                             /* @__PURE__ */ jsx(PencilIcon, { className: "size-3.5" }),
@@ -836,7 +889,7 @@ function SortableQueueRow({
                     /* @__PURE__ */ jsxs(
                       DropdownMenu.Item,
                       {
-                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-none focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
+                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-hidden focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
                         disabled: index === 0,
                         onSelect: () => onMove(0),
                         children: [
@@ -848,7 +901,7 @@ function SortableQueueRow({
                     /* @__PURE__ */ jsx(
                       DropdownMenu.Item,
                       {
-                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-none focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
+                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-hidden focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
                         disabled: index === 0,
                         onSelect: () => onMove(index - 1),
                         children: "Move up"
@@ -857,7 +910,7 @@ function SortableQueueRow({
                     /* @__PURE__ */ jsx(
                       DropdownMenu.Item,
                       {
-                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-none focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
+                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-hidden focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
                         disabled: index === count - 1,
                         onSelect: () => onMove(index + 1),
                         children: "Move down"
@@ -866,7 +919,7 @@ function SortableQueueRow({
                     /* @__PURE__ */ jsxs(
                       DropdownMenu.Item,
                       {
-                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-none focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
+                        className: "flex min-w-0 cursor-default items-center gap-2 whitespace-normal break-words rounded-sm px-2 py-1.5 outline-hidden focus:bg-surface-2 data-[disabled]:opacity-50 pointer-coarse:min-h-[44px]",
                         disabled: index === count - 1,
                         onSelect: () => onMove(count - 1),
                         children: [
@@ -934,4 +987,4 @@ export {
   QueueSurface,
   queueComposerCheckoutEnabled
 };
-//# sourceMappingURL=queue-surface-implementation-J4XJFKRW.js.map
+//# sourceMappingURL=queue-surface-implementation-2KVJTYXH.js.map