@robota-sdk/agent-ui-terminal 3.0.0-beta.82 → 3.0.0-beta.83

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@robota-sdk/agent-ui-terminal",
-  "version": "3.0.0-beta.82",
+  "version": "3.0.0-beta.83",
   "description": "Terminal UI package (React + Ink) for the Robota SDK",
   "type": "module",
   "main": "dist/node/index.js",
@@ -12,23 +12,16 @@
         "import": {
           "types": "./dist/node/index.d.ts",
           "default": "./dist/node/index.js"
-        },
-        "require": {
-          "types": "./dist/node/index.d.cts",
-          "default": "./dist/node/index.cjs"
         }
       },
       "default": {
         "import": {
           "types": "./dist/node/index.d.ts",
           "default": "./dist/node/index.js"
-        },
-        "require": {
-          "types": "./dist/node/index.d.cts",
-          "default": "./dist/node/index.cjs"
         }
       }
-    }
+    },
+    "./package.json": "./package.json"
   },
   "repository": {
     "type": "git",
@@ -39,11 +32,12 @@
     "url": "https://github.com/woojubb/robota/issues"
   },
   "engines": {
-    "node": ">=22.0.0"
+    "node": ">=22.12.0"
   },
   "files": [
     "dist",
-    "src"
+    "src",
+    "CHANGELOG.md"
   ],
   "dependencies": {
     "chalk": "^5.6.2",
@@ -52,14 +46,15 @@
     "marked-terminal": "^7.3.0",
     "react": "19.2.8",
     "string-width": "^8.2.2",
-    "@robota-sdk/agent-core": "3.0.0-beta.82",
-    "@robota-sdk/agent-framework": "3.0.0-beta.82",
-    "@robota-sdk/agent-interface-analytics": "3.0.0-beta.82",
-    "@robota-sdk/agent-interface-command": "3.0.0-beta.82",
-    "@robota-sdk/agent-interface-execution": "3.0.0-beta.82",
-    "@robota-sdk/agent-interface-session": "3.0.0-beta.82",
-    "@robota-sdk/agent-interface-transport": "3.0.0-beta.82",
-    "@robota-sdk/agent-interface-tui": "3.0.0-beta.82"
+    "@robota-sdk/agent-core": "3.0.0-beta.83",
+    "@robota-sdk/agent-framework": "3.0.0-beta.83",
+    "@robota-sdk/agent-interface-analytics": "3.0.0-beta.83",
+    "@robota-sdk/agent-interface-command": "3.0.0-beta.83",
+    "@robota-sdk/agent-interface-execution": "3.0.0-beta.83",
+    "@robota-sdk/agent-interface-session": "3.0.0-beta.83",
+    "@robota-sdk/agent-interface-transport": "3.0.0-beta.83",
+    "@robota-sdk/agent-transport": "3.0.0-beta.83",
+    "@robota-sdk/agent-interface-tui": "3.0.0-beta.83"
   },
   "devDependencies": {
     "@homebridge/node-pty-prebuilt-multiarch": "^0.14.1",
@@ -70,7 +65,7 @@
     "tsx": "^4.23.1",
     "typescript": "^6.0.3",
     "vitest": "^3.2.6",
-    "@robota-sdk/agent-command": "3.0.0-beta.82"
+    "@robota-sdk/agent-command": "3.0.0-beta.83"
   },
   "license": "AGPL-3.0-only OR LicenseRef-Commercial",
   "publishConfig": {

package/src/App.tsx

@@ -17,6 +17,12 @@ interface IProps {
   cwd: string;
   /** The composition root narrows every concrete channel to this port before React receives it. */
   createChannel: (resumeSessionId?: string) => ITuiAppChannelPort;
+  /**
+   * The session lives on a host this terminal is attached to: a switch is asked of the host, and the
+   * channel follows the host's `session_switched`, so the App keeps its channel. Absent ⇒ the App
+   * switches by building a channel for the chosen session.
+   */
+  requestSessionSwitch?: (sessionId: string) => Promise<void>;
   providerOverride?: string | undefined;
   providerType?: string | undefined;
   modelId?: string;
@@ -76,9 +82,14 @@ function useActiveChannel(props: IProps): IActiveChannel {
       setIsSwitching(true);
       try {
         setShowPicker(false);
-        await state.channel.stop();
+        if (props.requestSessionSwitch) {
+          await props.requestSessionSwitch(sessionId);
+        } else {
+          await state.channel.stop();
+          if (!mounted.current) return;
+          setState({ channel: props.createChannel(sessionId), sessionId });
+        }
         if (!mounted.current) return;
-        setState({ channel: props.createChannel(sessionId), sessionId });
         setFailedTarget(undefined);
         setError(undefined);
       } catch (cause) {
@@ -90,7 +101,7 @@ function useActiveChannel(props: IProps): IActiveChannel {
         setIsSwitching(false);
       }
     },
-    [props.createChannel, state.channel],
+    [props.createChannel, props.requestSessionSwitch, state.channel],
   );
   const retrySwitch = useCallback((): void => {
     if (failedTarget !== undefined) void switchSession(failedTarget);

package/src/AppPresentation.tsx

@@ -26,7 +26,7 @@ import type { IAppViewModel } from './app-view-model.js';
 
 function Transcript({ model }: { model: IAppViewModel }): React.ReactElement {
   return (
-    <Static items={model.staticItems}>
+    <Static key={model.transcriptKey} items={model.staticItems}>
       {(item) =>
         item.kind === 'banner' ? (
           <AppBanner key="logo" version={item.version} />

package/src/PermissionPrompt.tsx

@@ -27,8 +27,18 @@ import type { TToolArgs } from '@robota-sdk/agent-core';
 
 interface IProps {
   request: IPendingPermissionRequest;
+  /** How long a new request ignores its answer keys; tests pass their own. */
+  armDelayMs?: number;
 }
 
+/**
+ * The prompt replaces the composer while the user may still be typing, and its keys are ordinary
+ * letters and digits (`a` allows for the session). For this long after a request appears its keys
+ * answer nothing, so a keystroke meant for the composer cannot grant a permission. The prompt shows
+ * no selection cursor until it is armed.
+ */
+export const PERMISSION_PROMPT_ARM_DELAY_MS = 450;
+
 /**
  * Footer for the permission prompt — identical to the confirm prompt's (same horizontal row, same
  * reducer). Esc is deliberately suppressed by the flow (`escape: false` — a permission ask must
@@ -47,7 +57,10 @@ function formatArgs(args: TToolArgs): string {
     .join(', ');
 }
 
-export default function PermissionPrompt({ request }: IProps): React.ReactElement {
+export default function PermissionPrompt({
+  request,
+  armDelayMs = PERMISSION_PROMPT_ARM_DELAY_MS,
+}: IProps): React.ReactElement {
   const palette = usePalette();
   const canPersistProjectPermission = request.canPersistProjectPermission !== false;
   const [state, setState] = React.useState<ISelectionFlowState>(() => createSelectionFlowState());
@@ -61,6 +74,14 @@ export default function PermissionPrompt({ request }: IProps): React.ReactElemen
     setState(nextState);
   }
 
+  const [armedRequest, setArmedRequest] = React.useState<IPendingPermissionRequest | undefined>();
+  React.useEffect(() => {
+    if (armDelayMs <= 0) return undefined;
+    const timer = setTimeout(() => setArmedRequest(request), armDelayMs);
+    return () => clearTimeout(timer);
+  }, [request, armDelayMs]);
+  const armed = armDelayMs <= 0 || armedRequest === request;
+
   const applyAction = React.useCallback(
     (action: TPermissionPromptInputAction): void => {
       const result = applyPermissionPromptInput(
@@ -83,7 +104,8 @@ export default function PermissionPrompt({ request }: IProps): React.ReactElemen
     canPersistProjectPermission,
   );
   const numbered = useNumberedSelection({
-    enabled: screenReader,
+    // Off while arming, so a digit typed then is not buffered for a later Enter to commit.
+    enabled: screenReader && armed,
     itemCount: options.length,
     onSelect: (index) => {
       const result = applyPermissionPromptInput(
@@ -99,10 +121,14 @@ export default function PermissionPrompt({ request }: IProps): React.ReactElemen
       if (result.effect.type === 'resolve') request.resolve(result.effect.decision);
     },
   });
+  // Digits typed for one request are not an answer to the next.
+  const clearNumbered = numbered.clear;
+  React.useEffect(() => clearNumbered(), [request, clearNumbered]);
 
   useKeybindingActions(
     'permission-prompt',
     (actions) => {
+      if (!armed) return;
       const shortcutIndex = {
         'allow-once': 0,
         'allow-session': 1,
@@ -147,12 +173,15 @@ export default function PermissionPrompt({ request }: IProps): React.ReactElemen
     <Box
       flexDirection="column"
       borderStyle="round"
-      borderColor={palette.border.attention}
+      borderColor={armed ? palette.border.attention : palette.border.muted}
       paddingX={1}
     >
-      <Text color={palette.text.warning} bold>
-        [Permission Required]
-      </Text>
+      <Box>
+        <Text color={palette.text.warning} bold>
+          [Permission Required]
+        </Text>
+        {armed ? null : <Text dimColor> keys answer in a moment</Text>}
+      </Box>
       <Text>
         Tool:{' '}
         <Text color={palette.text.accent} bold>
@@ -168,17 +197,21 @@ export default function PermissionPrompt({ request }: IProps): React.ReactElemen
       {/* Issue #2351: the "always" options carry the consent scope, so they no longer fit one row
           of the prompt box — a row wrapped `Allow [y]` across two lines. One option per line. */}
       <Box marginTop={1} flexDirection="column">
-        {options.map((opt, i) => (
-          <Box key={opt}>
-            <Text
-              color={i === state.selectedIndex ? palette.text.accent : undefined}
-              bold={i === state.selectedIndex}
-            >
-              {i === state.selectedIndex ? SELECTION_INDICATOR : SELECTION_INDICATOR_NONE}
-              {opt}
-            </Text>
-          </Box>
-        ))}
+        {options.map((opt, i) => {
+          const selected = armed && i === state.selectedIndex;
+          return (
+            <Box key={opt}>
+              <Text
+                color={selected ? palette.text.accent : undefined}
+                bold={selected}
+                dimColor={!armed}
+              >
+                {selected ? SELECTION_INDICATOR : SELECTION_INDICATOR_NONE}
+                {opt}
+              </Text>
+            </Box>
+          );
+        })}
       </Box>
       <KeyHintFooter hints={footerHints} />
     </Box>

package/src/SessionPicker.tsx

@@ -9,15 +9,28 @@ import React from 'react';
 import { SELECTION_INDICATOR, SELECTION_INDICATOR_NONE } from './key-hint-footer.js';
 import ListPicker from './ListPicker.js';
 import { Text } from './SafeText.js';
+import { shortSessionId } from './short-session-id.js';
 import { usePalette } from './theme/index.js';
 
-import type { IResumableSessionSummary } from '@robota-sdk/agent-interface-session';
+import type { ISessionListingEntry } from '@robota-sdk/agent-interface-session';
 
-const SESSION_ID_DISPLAY_LENGTH = 8;
 const SESSION_PREVIEW_DISPLAY_LENGTH = 60;
 
+/**
+ * `● live · 2 clients` on a host that keeps sessions live: the session runs there now, and that many
+ * clients are on it. Null for a stored session, and for a host that says neither.
+ */
+export function sessionLiveBadge(session: ISessionListingEntry): string | null {
+  const parts: string[] = [];
+  if (session.live === true) parts.push('● live');
+  if (session.clients !== undefined && session.clients > 0) {
+    parts.push(`${session.clients} ${session.clients === 1 ? 'client' : 'clients'}`);
+  }
+  return parts.length > 0 ? parts.join(' · ') : null;
+}
+
 interface IProps {
-  sessions: readonly IResumableSessionSummary[];
+  sessions: readonly ISessionListingEntry[];
   onSelect: (sessionId: string) => void;
   onCancel: () => void;
 }
@@ -33,9 +46,10 @@ export default function SessionPicker({
       <Text bold color={palette.text.accent}>
         Select a session to resume:
       </Text>
-      <ListPicker<IResumableSessionSummary>
+      <ListPicker<ISessionListingEntry>
         items={[...sessions]}
-        renderItem={(session: IResumableSessionSummary, isSelected: boolean) => {
+        renderItem={(session: ISessionListingEntry, isSelected: boolean) => {
+          const badge = sessionLiveBadge(session);
           const preview = session.preview
             ? session.preview.slice(0, SESSION_PREVIEW_DISPLAY_LENGTH) +
               (session.preview.length > SESSION_PREVIEW_DISPLAY_LENGTH ? '...' : '')
@@ -43,7 +57,7 @@ export default function SessionPicker({
           return (
             <Text>
               {isSelected ? SELECTION_INDICATOR : SELECTION_INDICATOR_NONE}
-              <Text bold>{session.name ?? session.id.slice(0, SESSION_ID_DISPLAY_LENGTH)}</Text>
+              <Text bold>{session.name ?? shortSessionId(session.id)}</Text>
               {'  '}
               <Text dimColor>
                 {new Date(session.updatedAt).toLocaleString(undefined, {
@@ -55,6 +69,12 @@ export default function SessionPicker({
               </Text>
               {'  '}
               <Text dimColor>msgs: {session.messageCount}</Text>
+              {badge !== null ? (
+                <>
+                  {'  '}
+                  <Text color={palette.text.success}>{badge}</Text>
+                </>
+              ) : null}
               {preview ? (
                 <>
                   {'\n    '}
@@ -64,7 +84,7 @@ export default function SessionPicker({
             </Text>
           );
         }}
-        onSelect={(session: IResumableSessionSummary) => onSelect(session.id)}
+        onSelect={(session: ISessionListingEntry) => onSelect(session.id)}
         onCancel={onCancel}
       />
     </Box>

package/src/SessionStatusBar.tsx

@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react';
 
-import StatusBar from './StatusBar.js';
+import StatusBar, { ReadOnlyText } from './StatusBar.js';
 import { useTuiCliAdapter } from './tui-cli-adapter-context.js';
 
 import type { TModelEffortSelection, TPermissionMode } from '@robota-sdk/agent-core';
@@ -23,6 +23,7 @@ interface IProps {
   activePresetId?: string;
   effort?: TModelEffortSelection;
   gitRefreshToken?: number;
+  readOnly?: boolean;
 }
 
 export default function SessionStatusBar({
@@ -42,6 +43,7 @@ export default function SessionStatusBar({
   activePresetId,
   effort,
   gitRefreshToken,
+  readOnly = false,
 }: IProps): React.ReactElement | null {
   const cliAdapter = useTuiCliAdapter();
   const gitBranch = useMemo(() => cliAdapter.getGitBranch(cwd), [cliAdapter, cwd, gitRefreshToken]);
@@ -50,7 +52,8 @@ export default function SessionStatusBar({
       providerType !== undefined ? cliAdapter.getProviderDisplayName(providerType) : undefined,
     [cliAdapter, providerType],
   );
-  if (!settings.enabled) return null;
+  // With the status line off, an observer is still told it cannot change the session.
+  if (!settings.enabled) return readOnly ? <ReadOnlyText /> : null;
 
   return (
     <StatusBar
@@ -71,6 +74,7 @@ export default function SessionStatusBar({
       activeAgentLabel={activeAgentLabel}
       activePresetId={activePresetId}
       effort={effort}
+      readOnly={readOnly}
     />
   );
 }

package/src/StatusBar.tsx

@@ -35,6 +35,8 @@ interface IProps {
   activeAgentLabel?: string;
   activePresetId?: string;
   effort?: TModelEffortSelection;
+  /** This terminal only observes the session. */
+  readOnly?: boolean;
 }
 
 interface IStatusLeftProps {
@@ -53,8 +55,12 @@ interface IStatusLeftProps {
   showGitBranch: boolean;
   activePresetId?: string;
   effort?: TModelEffortSelection;
+  readOnly: boolean;
 }
 
+/** What an observing terminal shows first on its status line. */
+export const READ_ONLY_STATUS = 'Observing — read only';
+
 /** Return the color for the context percentage indicator */
 function getContextColor(percentage: number, palette: IThemeColors): string {
   if (percentage >= CONTEXT_RED_THRESHOLD) return palette.text.error;
@@ -104,6 +110,15 @@ function ContextText({
   );
 }
 
+export function ReadOnlyText(): React.ReactElement {
+  const palette = usePalette();
+  return (
+    <Text color={palette.text.warning} bold>
+      {READ_ONLY_STATUS}
+    </Text>
+  );
+}
+
 function ModeText({ permissionMode }: { permissionMode: TPermissionMode }): React.ReactElement {
   const palette = usePalette();
   return (
@@ -183,6 +198,13 @@ function StatusLeft(props: IStatusLeftProps): React.ReactElement {
   const showActivePreset = shouldShowActivePreset(activePresetId);
   return (
     <Text>
+      {props.readOnly && (
+        <>
+          <ReadOnlyText />
+          {/* In screen-reader mode the next field brings its own separator. */}
+          {!screenReader && SEP}
+        </>
+      )}
       {!screenReader && (
         <StatusActivityText
           isThinking={props.isThinking}
@@ -253,6 +275,7 @@ export default function StatusBar({
   activeAgentLabel,
   activePresetId,
   effort,
+  readOnly = false,
 }: IProps): React.ReactElement {
   const palette = usePalette();
   return (
@@ -273,6 +296,7 @@ export default function StatusBar({
         showGitBranch={showGitBranch}
         activePresetId={activePresetId}
         effort={effort}
+        readOnly={readOnly}
       />
       {activeAgentLabel !== undefined && (
         <Text color={palette.text.warning} bold>