tmux-ide 2.9.0-beta.19 → 2.9.0-beta.21

package/packages/daemon/src/tui/mirror/resize-transaction.ts

@@ -104,6 +104,7 @@ function sameTarget(
 ): boolean {
   return (
     state.operationId === observation.operationId &&
+    state.authorityGeneration === observation.authorityGeneration &&
     state.workspaceName === observation.workspaceName &&
     state.semanticPaneId === observation.semanticPaneId &&
     state.axis === observation.axis
@@ -113,9 +114,9 @@ function sameTarget(
 /**
  * Renderer-local pane-resize transaction.
  *
- * Pointer motion only changes the preview state. Release authors exactly one
- * semantic intent and keeps that preview visible until the matching observed
- * operation settles or rejects. The controller owns no timers, transport, or
+ * Pointer motion submits the first target immediately, then retains only the
+ * latest desired size while receipt and canonical layout settle the pending
+ * operation. Release closes the gesture and flushes that latest target. The controller owns no timers, transport, or
  * rendering effects beyond the functions supplied by its caller.
  */
 export class ResizeTransactionController {
@@ -129,6 +130,8 @@ export class ResizeTransactionController {
   #projection: OptimisticProjectionState<number, number> | null = null;
   #revision = 0;
   #disposed = false;
+  #dragOpen = false;
+  #submittedCells: number | null = null;
 
   constructor(options: ResizeTransactionControllerOptions) {
     if (!Number.isFinite(options.timeoutMs) || options.timeoutMs <= 0) {
@@ -150,6 +153,8 @@ export class ResizeTransactionController {
     const workspaceName = nonEmpty(input.workspaceName, "workspaceName");
     const semanticPaneId = nonEmpty(input.semanticPaneId, "semanticPaneId");
     const canonicalCells = positiveCells(input.canonicalCells, "canonicalCells");
+    this.#dragOpen = true;
+    this.#submittedCells = null;
     this.#projection = createOptimisticProjection<number, number>({
       generation: authorityGeneration,
       revision: this.#revision,
@@ -168,28 +173,31 @@ export class ResizeTransactionController {
     return true;
   }
 
-  /** Purely local preview update. It never calls submit or schedules work. */
+  /** First/latest coalescing: at most one mutation awaits canonical settlement. */
   move(previewCells: number): boolean {
-    if (this.#state.phase !== "dragging") return false;
+    if (!this.#dragOpen || this.#state.phase === "idle") return false;
     const next = positiveCells(previewCells, "previewCells");
     if (next === this.#state.previewCells) return false;
     this.#emit({ ...this.#state, previewCells: next });
+    if (this.#state.phase === "dragging") this.#submit();
     return true;
   }
 
-  /**
-   * Submit once. Duplicate physical release/up/drop events return the existing
-   * operation id without authoring another mutation.
-   */
+  /** Duplicate releases never author another mutation. */
   release(): string | null {
+    this.#dragOpen = false;
     if (this.#state.phase === "pending") return this.#state.operationId;
     if (this.#state.phase !== "dragging") return null;
-    const dragging = this.#state;
-    if (dragging.previewCells === dragging.canonicalCells) {
-      this.#emit({ phase: "idle", canonicalCells: dragging.canonicalCells, outcome: null });
-      return null;
-    }
+    const canonicalCells = this.#state.canonicalCells;
+    this.#emit({ phase: "idle", canonicalCells, outcome: null });
+    return null;
+  }
 
+  #submit(): string | null {
+    if (this.#state.phase !== "dragging") return null;
+    const dragging = this.#state;
+    if (dragging.previewCells === dragging.canonicalCells) return null;
+    this.#submittedCells = dragging.previewCells;
     const operationId = nonEmpty(this.#options.operationId(), "operationId");
     const submittedAt = this.#options.now();
     if (!this.#projection) throw new Error("resize projection is unavailable");
@@ -245,9 +253,14 @@ export class ResizeTransactionController {
     });
   }
 
-  /** Escape/cancel is only meaningful before release. */
+  /** Discard queued motion; an already dispatched mutation cannot be undone. */
   cancelDrag(): boolean {
-    if (this.#state.phase !== "dragging") return false;
+    if (!this.#dragOpen || this.#state.phase === "idle") return false;
+    this.#dragOpen = false;
+    if (this.#state.phase === "pending") {
+      this.#emit({ ...this.#state, previewCells: this.#submittedCells! });
+      return true;
+    }
     const canonicalCells = this.#state.canonicalCells;
     this.#emit({ phase: "idle", canonicalCells, outcome: null });
     return true;
@@ -260,6 +273,8 @@ export class ResizeTransactionController {
 
   /** Retire one runtime lane without permanently disposing the controller. */
   retire(): void {
+    this.#dragOpen = false;
+    this.#submittedCells = null;
     this.#clearTimeout();
     this.#projection = null;
     if (this.#state.phase !== "idle" || this.#state.canonicalCells !== null) {
@@ -277,7 +292,8 @@ export class ResizeTransactionController {
     )
       return false;
     const cells = positiveCells(observation.cells, "observed cells");
-    const operationId = this.#state.operationId;
+    const pending = this.#state;
+    const operationId = pending.operationId;
     if (!this.#projection) return false;
     this.#revision += 1;
     this.#projection = replaceCommittedProjection(
@@ -290,11 +306,18 @@ export class ResizeTransactionController {
       { observedOperationIds: [operationId], nowMs: this.#options.now() },
     );
     this.#clearTimeout();
-    this.#emit({
-      phase: "idle",
-      canonicalCells: cells,
-      outcome: { kind: "settled", operationId, source, cells },
-    });
+    const hasLatest =
+      pending.previewCells !== this.#submittedCells && pending.previewCells !== cells;
+    if (this.#dragOpen || hasLatest) {
+      this.#emit({ ...pending, phase: "dragging", canonicalCells: cells });
+      if (hasLatest) this.#submit();
+    } else {
+      this.#emit({
+        phase: "idle",
+        canonicalCells: cells,
+        outcome: { kind: "settled", operationId, source, cells },
+      });
+    }
     return true;
   }
 
@@ -321,6 +344,7 @@ export class ResizeTransactionController {
       );
     }
     const canonicalCells = this.#state.canonicalCells;
+    this.#dragOpen = false;
     this.#clearTimeout();
     this.#emit({
       phase: "idle",

package/packages/daemon/src/tui/mirror/runtime/application-appearance-owner.ts

@@ -1,3 +1,5 @@
+import type { CliRenderer } from "@opentui/core";
+import { createAutomaticContrastPass } from "../automatic-contrast.ts";
 import { VISUAL_THEME_PRESETS, findVisualThemePreset } from "@tmux-ide/contracts";
 import { batch, createSignal, type Accessor } from "solid-js";
 
@@ -26,6 +28,8 @@ export interface ApplicationAppearanceOwner {
   readonly palette: Accessor<TerminalPaletteProjection>;
   readonly hostPalette: Accessor<ApplicationTerminalPaletteSnapshot>;
   readonly setTransientNote: (note: string | null) => void;
+  readonly automaticContrast: Accessor<boolean>;
+  readonly toggleAutomaticContrast: () => void;
   readonly pickerOpen: Accessor<boolean>;
   readonly pickerError: Accessor<string | null>;
   readonly openPicker: () => void;
@@ -54,15 +58,36 @@ export interface ApplicationAppearanceSnapshot {
 }
 
 function hostDefaults(snapshot: ApplicationTerminalPaletteSnapshot) {
-  if (snapshot.availability !== "available") return null;
-  return deriveSystemVisualHostDefaults(snapshot);
+  return (
+    deriveSystemVisualHostDefaults(snapshot) ?? { appearance: snapshot.detectedMode, overrides: {} }
+  );
 }
 
 export function createAppearanceOwner(
   config: AppConfig,
-  renderer: ThemeModeSource,
+  renderer: ThemeModeSource &
+    Partial<Pick<CliRenderer, "addPostProcessFn" | "removePostProcessFn" | "requestRender">>,
   terminalPaletteOwner: ApplicationTerminalPaletteOwner,
 ): ApplicationAppearanceOwner {
+  const [automaticContrast, setAutomaticContrast] = createSignal(
+    config.theme.automaticContrast ?? true,
+  );
+  const correct = createAutomaticContrastPass();
+  const postProcess: Parameters<CliRenderer["addPostProcessFn"]>[0] = (buffer) => {
+    if (automaticContrast()) correct(buffer);
+  };
+  renderer.addPostProcessFn?.(postProcess);
+  const setContrast = (enabled: boolean) => {
+    if (enabled === automaticContrast()) return;
+    setAutomaticContrast(enabled);
+    renderer.requestRender?.();
+  };
+  const toggleAutomaticContrast = () => {
+    if (pickerOpen()) {
+      setContrast(!automaticContrast());
+      setPickerError(null);
+    }
+  };
   const initialHostPalette = terminalPaletteOwner.getSnapshot();
   const store = createSemanticThemeStore(config.theme, {
     rendererMode: renderer.themeMode,
@@ -128,10 +153,17 @@ export function createAppearanceOwner(
   const apply = (id: string) => {
     const preset = findVisualThemePreset(id);
     const mode = preset?.appearance ?? (id as ThemeModeSetting);
-    store.configure({ ...config.theme, mode, preset: preset?.id });
+    const wasSystem = theme().setting === "system";
+    store.configure({
+      ...config.theme,
+      mode,
+      preset: preset?.id,
+    });
+    if (mode === "system" && !wasSystem) void terminalPaletteOwner.refresh();
     setPickerSelection(id);
   };
   let originalSelection = pickerSelection();
+  let originalContrast = automaticContrast();
   const preview = (id: string): void => {
     if (!pickerOpen()) return;
     setPickerError(null);
@@ -139,6 +171,7 @@ export function createAppearanceOwner(
   };
   const cancelPicker = (): void => {
     if (!pickerOpen()) return;
+    setContrast(originalContrast);
     apply(originalSelection);
     setPickerOpen(false);
     setPickerError(null);
@@ -148,6 +181,7 @@ export function createAppearanceOwner(
     try {
       updateAppConfig({
         theme: {
+          automaticContrast: automaticContrast(),
           mode: theme().setting,
           preset: findVisualThemePreset(pickerSelection())?.id ?? "",
         },
@@ -165,7 +199,7 @@ export function createAppearanceOwner(
     const order: readonly ThemeModeSetting[] = ["dark", "light", "system"];
     const next = order[(order.indexOf(theme().setting) + 1) % order.length]!;
     apply(next);
-    updateAppConfig({ theme: { mode: next, preset: "" } });
+    updateAppConfig({ theme: { mode: next, preset: "", automaticContrast: automaticContrast() } });
     notice.publish(`theme → ${next}`);
   };
   return {
@@ -176,6 +210,8 @@ export function createAppearanceOwner(
     palette,
     hostPalette,
     setTransientNote: notice.publish,
+    automaticContrast,
+    toggleAutomaticContrast,
     pickerOpen,
     pickerError,
     pickerQuery,
@@ -184,6 +220,7 @@ export function createAppearanceOwner(
     openPicker() {
       if (pickerOpen()) return;
       originalSelection = pickerSelection();
+      originalContrast = automaticContrast();
       setPickerQuery("");
       setPickerError(null);
       setPickerOpen(true);
@@ -196,7 +233,8 @@ export function createAppearanceOwner(
       if (event.eventType === "release" || event.repeated) return true;
       const name = event.name.toLowerCase();
       const choices = pickerOptions();
-      if (name === "escape") cancelPicker();
+      if (event.ctrl && name === "a") toggleAutomaticContrast();
+      else if (name === "escape") cancelPicker();
       else if (name === "return" || name === "enter") savePicker();
       else if (name === "up" || name === "down" || name === "tab") {
         if (choices.length) {
@@ -219,6 +257,7 @@ export function createAppearanceOwner(
     },
     cycleTheme,
     dispose() {
+      renderer.removePostProcessFn?.(postProcess);
       stopTheme();
       stopRendererTheme();
       stopHostPalette();

package/packages/daemon/src/tui/mirror/runtime/application-fleet-preview.ts

@@ -14,6 +14,7 @@ export async function readFleetWindowPreview(
   liveSessionId: string,
   signal: AbortSignal,
   windowId?: string,
+  paneId?: string,
 ): Promise<FleetPreviewResult> {
   const daemon = handle.read();
   const epoch = handle.endpoint().epoch;
@@ -32,6 +33,7 @@ export async function readFleetWindowPreview(
         body: JSON.stringify({
           expectedInstanceId: daemon.instanceId,
           liveSessionId,
+          ...(paneId ? { paneId } : {}),
           ...(windowId ? { windowId } : {}),
         }),
       },
@@ -63,6 +65,7 @@ export async function readFleetWindowPreview(
       body.daemon?.instanceId !== daemon.instanceId ||
       body.daemon?.startedAt !== daemon.startedAt ||
       body.liveSessionId !== liveSessionId ||
+      (paneId && body.selectedPaneId !== paneId) ||
       typeof body.text !== "string" ||
       body.text.length > 8192
     )
@@ -103,6 +106,7 @@ export async function readFleetWindowPreview(
       status: "ready",
       snapshot: {
         text: clean(body.text),
+        ...(body.selectedPaneId ? { selectedPaneId: body.selectedPaneId } : {}),
         selectedWindowId,
         windows: windows.map((w) => ({
           id: w.id,

package/packages/daemon/src/tui/mirror/runtime/application-fleet-switcher.tsx

@@ -83,7 +83,8 @@ export function ApplicationFleetSwitcher(props: {
     if (!props.open || props.active === false || modal()) return false;
     const key = event.name.toLowerCase();
     // Preview and action components own these chords, without text or terminal leakage.
-    if (event.ctrl && ["left", "right", "p", "e", "n", "x", "r"].includes(key)) return false;
+    if (event.ctrl && ["left", "right", "p", "e", "n", "x", "r", "k", "b"].includes(key))
+      return false;
     if (event.ctrl && key === "f") {
       event.preventDefault();
       event.stopPropagation();

package/packages/daemon/src/tui/mirror/runtime/application-machine-sidebar.tsx

@@ -175,6 +175,7 @@ export function ApplicationMachineSidebar(props: {
         : []),
     ]),
   );
+  const rowsByKey = createMemo(() => new Map(rows().map((row) => [row.key, row])));
   const index = () =>
     Math.max(
       0,
@@ -437,83 +438,106 @@ export function ApplicationMachineSidebar(props: {
         scrollY={true}
         horizontalScrollbarOptions={{ visible: false }}
       >
-        <For each={rows()}>
-          {(row) => (
-            <box
-              width={Math.max(1, props.width - 1)}
-              height={row.agent ? (row.agentHeading ? 3 : 2) : 1}
-              flexShrink={0}
-              flexDirection="column"
-            >
-              <Show when={row.agentHeading}>
-                <text height={1} fg={props.theme.roles.text.secondary}>
-                  {" "}
-                  Agents
-                </text>
-              </Show>
-              <NavigationRow
-                theme={props.theme}
-                id={`machine:${row.key}`}
+        <For each={rows().map((row) => row.key)}>
+          {(key) => {
+            // The semantic key owns the native row; fresh snapshots update its
+            // props instead of destroying and recreating identical renderables.
+            const current = createMemo<Row>(
+              (previous) => rowsByKey().get(key) ?? previous,
+              rowsByKey().get(key)!,
+            );
+            const row: Row = {
+              key,
+              get group() {
+                return current().group;
+              },
+              get session() {
+                return current().session;
+              },
+              get agent() {
+                return current().agent;
+              },
+              get agentHeading() {
+                return current().agentHeading;
+              },
+            };
+            return (
+              <box
                 width={Math.max(1, props.width - 1)}
-                labelColor={!row.agent && !row.session ? fleetHostColor(row.group) : undefined}
-                label={
-                  row.agent
-                    ? row.agent.name
-                    : row.session
-                      ? friendlySessionLabel(row.session.name)
-                      : row.group.label
-                }
-                marker={
-                  row.agent
-                    ? active(row)
-                      ? row.agent.attention
-                        ? "›!"
-                        : "›"
-                      : row.agent.attention
-                        ? "!"
-                        : "•"
-                    : row.session
-                      ? props.model.favorites?.().includes(row.session.id)
-                        ? " ★"
-                        : active(row)
-                          ? " ›"
-                          : "  "
-                      : collapsed().has(preferenceKey(row.group))
-                        ? "▸"
-                        : "▾"
-                }
-                detail={
-                  row.agent
-                    ? row.group.state !== "ready" || row.agent.disabled
-                      ? "unavailable"
-                      : `[${terminalAgentStatusLabel(row.agent.activity)}]`
-                    : row.session
-                      ? row.group.state !== "ready" || row.session.disabled
+                height={row.agent ? (row.agentHeading ? 3 : 2) : 1}
+                flexShrink={0}
+                flexDirection="column"
+              >
+                <Show when={row.agentHeading}>
+                  <text height={1} fg={props.theme.roles.text.secondary}>
+                    {" "}
+                    Agents
+                  </text>
+                </Show>
+                <NavigationRow
+                  theme={props.theme}
+                  id={`machine:${row.key}`}
+                  width={Math.max(1, props.width - 1)}
+                  labelColor={!row.agent && !row.session ? fleetHostColor(row.group) : undefined}
+                  label={
+                    row.agent
+                      ? row.agent.name
+                      : row.session
+                        ? friendlySessionLabel(row.session.name)
+                        : row.group.label
+                  }
+                  marker={
+                    row.agent
+                      ? active(row)
+                        ? row.agent.attention
+                          ? "›!"
+                          : "›"
+                        : row.agent.attention
+                          ? "!"
+                          : "•"
+                      : row.session
+                        ? props.model.favorites?.().includes(row.session.id)
+                          ? " ★"
+                          : active(row)
+                            ? " ›"
+                            : "  "
+                        : collapsed().has(preferenceKey(row.group))
+                          ? "▸"
+                          : "▾"
+                  }
+                  detail={
+                    row.agent
+                      ? row.group.state !== "ready" || row.agent.disabled
                         ? "unavailable"
-                        : `${row.session.paneCount}p${row.group.agents?.length ? ` ${activity(row).label}` : ""}`
-                      : row.group.agents?.length && row.group.state === "ready"
-                        ? activity(row).label
-                        : `${connectionDetail(row.group)}${row.group.agents?.length ? " ?" : ""}`
-                }
-                selected={Boolean((row.session || row.agent) && active(row))}
-                focused={Boolean(focused() && row.key === selectedKey())}
-                attention={row.agent?.attention ?? activity(row).kind === "attention"}
-                onActivate={(source) => activate(row, source)}
-              />
-              <Show when={row.agent}>
-                {(agent) => (
-                  <text
-                    height={1}
-                    fg={props.theme.roles.text.muted}
-                    content={clipTerminal(
-                      `  ${friendlySessionLabel(agent().sessionName)}`,
-                      Math.max(1, props.width - 1),
-                    )}
-                  />
-                )}
-              </Show>
-            </box>
-          )}
+                        : `[${terminalAgentStatusLabel(row.agent.activity)}]`
+                      : row.session
+                        ? row.group.state !== "ready" || row.session.disabled
+                          ? "unavailable"
+                          : `${row.session.paneCount}p${row.group.agents?.length ? ` ${activity(row).label}` : ""}`
+                        : row.group.agents?.length && row.group.state === "ready"
+                          ? activity(row).label
+                          : `${connectionDetail(row.group)}${row.group.agents?.length ? " ?" : ""}`
+                  }
+                  selected={Boolean((row.session || row.agent) && active(row))}
+                  focused={Boolean(focused() && row.key === selectedKey())}
+                  attention={row.agent?.attention ?? activity(row).kind === "attention"}
+                  onActivate={(source) => activate(row, source)}
+                />
+                <Show when={row.agent}>
+                  {(agent) => (
+                    <text
+                      height={1}
+                      fg={props.theme.roles.text.muted}
+                      content={clipTerminal(
+                        `  ${friendlySessionLabel(agent().sessionName)}`,
+                        Math.max(1, props.width - 1),
+                      )}
+                    />
+                  )}
+                </Show>
+              </box>
+            );
+          }}
         </For>
       </scrollbox>
       <For each={agentHeight() > 0 ? [true] : []}>

package/packages/daemon/src/tui/mirror/runtime/application-palette-preview.tsx

@@ -45,15 +45,24 @@ export function ApplicationPalettePreview(props: {
   const owner = createAdaptiveFleetPreviewOwner(setState, { cache: fleetPreviewMemory });
   const stop = applicationMachineAuthorityManager.subscribe(() => setRevision((v) => v + 1));
   const command = () => (typeof props.command === "object" ? props.command : undefined);
+  const paneId = () => {
+    const c = command();
+    return c?.kind === "jump-agent" ? c.paneId : undefined;
+  };
   const target = () => command()?.fleet;
   const identity = () =>
-    JSON.stringify([target()?.machineId, target()?.liveSessionId, target()?.daemonInstanceId]);
+    JSON.stringify([
+      target()?.machineId,
+      target()?.liveSessionId,
+      target()?.daemonInstanceId,
+      paneId(),
+    ]);
   let previousIdentity = "";
   createEffect(() => {
     const next = identity();
     if (next !== previousIdentity) {
       previousIdentity = next;
-      setWindowId(rememberedWindows.get(next));
+      setWindowId(paneId() ? undefined : rememberedWindows.get(next));
     }
   });
   createEffect(() => {
@@ -78,6 +87,7 @@ export function ApplicationPalettePreview(props: {
               fleet.liveSessionId,
               signal,
               selected,
+              selected ? undefined : paneId(),
             );
             // A remembered window may have been closed since the last visit.
             // Fall back to the session's current window instead of retrying it forever.
@@ -135,7 +145,7 @@ export function ApplicationPalettePreview(props: {
   const heading = () => {
     const snapshot = state().snapshot;
     const window = snapshot?.windows.find((w) => w.id === snapshot.selectedWindowId);
-    return `${target()?.hostLabel ?? "Session preview"} · ${command()?.sessionName ?? "Select a session"}${window ? ` · ${window.index}: ${window.name}` : ""}`;
+    return `${paneId() ? command()?.label + " · " : ""}${target()?.hostLabel ?? "Session preview"} · ${command()?.sessionName ?? "Select a session"}${window ? ` · ${window.index}: ${window.name}` : ""}`;
   };
   const hostColor = () => {
     revision();