@wrongstack/tui 0.298.0 → 0.298.2

package/dist/components/sidebar-panels.d.ts

@@ -0,0 +1,136 @@
+import type React from 'react';
+import type { FleetEntry } from '../app-state.js';
+import type { TodoItem } from '@wrongstack/core/agent';
+import type { GoalSummary } from '../app-state.js';
+import type { QueueItem } from '../app-state-core-types.js';
+import type { LiveSessionEntry } from './sessions-panel.js';
+import type { ProjectPickerItem } from './project-picker.js';
+import type { ResumeSessionEntry } from '../app-state.js';
+import type { WorktreeRow } from '../ui-contracts.js';
+export interface ProjectPickerSidebarProps {
+    /** Already-filtered picker items. Navigation indices target this list directly. */
+    items: readonly ProjectPickerItem[];
+    /** Index into `items`. */
+    selected: number;
+    /** Current filter text. */
+    filter: string;
+    /** Optional status/error hint shown below the list. */
+    hint?: string | undefined;
+    /** Current project name to highlight. */
+    currentProject?: string | undefined;
+    /** Width of the sidebar in columns. */
+    width: number;
+}
+export declare function ProjectPickerSidebar({ items, selected, filter, hint, currentProject, width, }: ProjectPickerSidebarProps): React.ReactElement;
+export interface FleetPanelSidebarProps {
+    entries: Record<string, FleetEntry>;
+    /** Active (running) subagent count. */
+    runningCount: number;
+    /** Width of the sidebar in columns. */
+    width: number;
+}
+export declare function FleetPanelSidebar({ entries, runningCount, width, }: FleetPanelSidebarProps): React.ReactElement;
+export interface AgentsPanelSidebarProps {
+    entries: Record<string, FleetEntry>;
+    totalCost: number;
+    nowTick: number;
+    width: number;
+}
+export declare function AgentsPanelSidebar({ entries, totalCost, nowTick, width, }: AgentsPanelSidebarProps): React.ReactElement;
+export interface WorktreePanelSidebarProps {
+    worktrees: Record<string, WorktreeRow>;
+    /** Width of the sidebar in columns. */
+    width: number;
+}
+export declare function WorktreePanelSidebar({ worktrees, width, }: WorktreePanelSidebarProps): React.ReactElement;
+export interface PlanPanelSidebarProps {
+    /** Plan items grouped by status. */
+    openCount: number;
+    inProgressCount: number;
+    doneCount: number;
+    /** Up to N plan item titles to display. */
+    items: readonly {
+        id: string;
+        title: string;
+        status: 'open' | 'in_progress' | 'done';
+    }[];
+    /** Title of the plan (if any). */
+    title?: string | undefined;
+    width: number;
+}
+export declare function PlanPanelSidebar({ openCount, inProgressCount, doneCount, items, title, width, }: PlanPanelSidebarProps): React.ReactElement;
+export interface TodosPanelSidebarProps {
+    todos: readonly TodoItem[];
+    width: number;
+}
+export declare function TodosPanelSidebar({ todos, width }: TodosPanelSidebarProps): React.ReactElement;
+export interface QueuePanelSidebarProps {
+    items: readonly QueueItem[];
+    width: number;
+}
+export declare function QueuePanelSidebar({ items, width }: QueuePanelSidebarProps): React.ReactElement;
+export interface ProcessListPanelSidebarProps {
+    /** Active process count and a few process summaries. */
+    activeCount: number;
+    /** Total process count. */
+    totalCount: number;
+    /** Up to 8 process rows: name + pid. */
+    processes: readonly {
+        pid: number;
+        name: string;
+        status?: string;
+    }[];
+    width: number;
+}
+export declare function ProcessListPanelSidebar({ activeCount, totalCount, processes, width, }: ProcessListPanelSidebarProps): React.ReactElement;
+export interface GoalPanelSidebarProps {
+    goal: GoalSummary | null;
+    coordinatorRunning: boolean;
+    width: number;
+}
+export declare function GoalPanelSidebar({ goal, coordinatorRunning, width, }: GoalPanelSidebarProps): React.ReactElement;
+export interface SessionsPanelSidebarProps {
+    liveSessions?: readonly LiveSessionEntry[] | undefined;
+    resumeSessions?: readonly ResumeSessionEntry[] | undefined;
+    currentSessionId?: string | undefined;
+    width: number;
+}
+export declare function SessionsPanelSidebar({ liveSessions, resumeSessions, currentSessionId, width, }: SessionsPanelSidebarProps): React.ReactElement;
+export interface CoordinatorPanelSidebarProps {
+    running: boolean;
+    /** Active phase count. */
+    activePhases: number;
+    /** Completed phase count. */
+    completedPhases: number;
+    /** Up to 5 active phase names. */
+    phaseNames: readonly string[];
+    /** Elapsed ms since coordinator started. */
+    elapsedMs: number;
+    width: number;
+}
+export declare function CoordinatorPanelSidebar({ running, activePhases, completedPhases, phaseNames, elapsedMs, width, }: CoordinatorPanelSidebarProps): React.ReactElement;
+export interface KanbanPanelSidebarProps {
+    /** Per-column counts: Backlog / Up Next / In Progress / Review / Done. */
+    columns: readonly {
+        name: string;
+        count: number;
+        wip?: number;
+    }[];
+    /** Active card count (total cards across all columns). */
+    totalActive: number;
+    /** Up to 6 active card titles. */
+    activeCardTitles: readonly string[];
+    width: number;
+}
+export declare function KanbanPanelSidebar({ columns, totalActive, activeCardTitles, width, }: KanbanPanelSidebarProps): React.ReactElement;
+export interface ConnectionsPanelSidebarProps {
+    /** Connection summaries: name + status badge. */
+    connections: readonly {
+        name: string;
+        status: 'ok' | 'warn' | 'down' | 'unknown';
+        latencyMs?: number | undefined;
+    }[];
+    width: number;
+}
+export declare function ConnectionsPanelSidebar({ connections, width, }: ConnectionsPanelSidebarProps): React.ReactElement;
+//# sourceMappingURL=sidebar-panels.d.ts.map

package/dist/components/sidebar.d.ts

@@ -0,0 +1,49 @@
+import type React from 'react';
+/** Terminal widths below this hide the sidebar entirely. */
+export declare const SIDEBAR_MIN_TERMINAL = 64;
+/** Smallest sidebar width (in columns) when visible. */
+export declare const SIDEBAR_MIN_WIDTH = 20;
+/** Largest sidebar width (in columns). */
+export declare const SIDEBAR_MAX_WIDTH = 48;
+/** Fraction of terminal width to allocate to the sidebar. */
+export declare const SIDEBAR_FRACTION = 0.25;
+/** Border (2) plus horizontal padding (2) consumed by RightSidebar. */
+export declare const SIDEBAR_HORIZONTAL_CHROME = 4;
+/**
+ * Return the width available to children inside RightSidebar.
+ *
+ * Routed panel frames have their own border and padding, so they must receive
+ * this content width rather than claiming the outer sidebar width again.
+ */
+export declare function computeSidebarContentWidth(sidebarWidth: number): number;
+/**
+ * Compute the sidebar width in columns for a given terminal width.
+ * Returns 0 when the terminal is too narrow for a sidebar.
+ *
+ * Pure — no React, no Ink — so callers can use the same value for layout
+ * math (e.g. narrowing the history column) without mounting the component.
+ */
+export declare function computeSidebarWidth(termCols: number): number;
+export interface RightSidebarProps {
+    /**
+     * Optional explicit width override (in columns). When omitted, the width
+     * is derived from the current terminal width via {@link computeSidebarWidth}.
+     */
+    width?: number | undefined;
+    /**
+     * Maximum height in rows. Content beyond this is clipped (scroll handled
+     * by the caller via scrollOffset). When omitted, no height cap is applied.
+     */
+    maxHeight?: number | undefined;
+    /**
+     * When true, the sidebar border is highlighted to indicate keyboard focus.
+     */
+    focused?: boolean | undefined;
+    /**
+     * Content to render inside the sidebar. When omitted, a dimmed placeholder
+     * label is shown so the reserved region is visually self-documenting.
+     */
+    children?: React.ReactNode | undefined;
+}
+export declare function RightSidebar({ width, maxHeight, focused, children }: RightSidebarProps): React.ReactElement | null;
+//# sourceMappingURL=sidebar.d.ts.map

package/dist/components/status-bar-format.d.ts

@@ -58,6 +58,16 @@ export declare function stateChip(state: 'idle' | 'running' | 'streaming' | 'abo
 export declare function renderProgress(ratio: number, width: number): string;
 export declare function contextBarColor(ratio: number): string;
 export declare function renderMeter(ratio: number, width: number): string;
+/**
+ * Block-style meter for the sidebar — a solid fill (`█`) plus an empty track
+ * (`░`). Returned as two segments so the caller can color the fill (e.g. by
+ * context pressure via {@link contextBarColor}) independently of the dim track.
+ * Width-safe: `filled.length + empty.length === max(1, width)` always holds.
+ */
+export declare function blockMeter(ratio: number, width: number): {
+    filled: string;
+    empty: string;
+};
 export declare function fmtTok(n: number): string;
 export declare function fmtMemory(bytes: number): string;
 export declare function fmtElapsed(ms: number): string;

package/dist/components/status-bar-types.d.ts

@@ -372,5 +372,12 @@ export interface StatusBarProps {
      * Clicking opens /audit (TUI) — in the REPL it's informational.
      */
     sideEffectCount?: number | undefined;
+    /**
+     * Optional cap on the column width used for layout adaptation. When set,
+     * the status bar treats this as its effective terminal width instead of
+     * `stdout.columns` — needed when the bar sits in a column narrower than
+     * the full terminal (e.g. beside a sidebar).
+     */
+    maxWidth?: number | undefined;
 }
 //# sourceMappingURL=status-bar-types.d.ts.map

package/dist/components/status-bar.d.ts

@@ -11,5 +11,5 @@ export declare const COMPACT_THRESHOLD = 50;
  * to show — git branch, elapsed time, todo counts, YOLO marker — so a
  * vanilla session keeps the original single-line footprint.
  */
-export declare function StatusBar({ model, provider, version, latestVersion, updateAvailable, state, thinkingWord, thinkingAnimationStyle, tokenCounter, hint, queueCount, yolo, autonomy, fleetWorkingTime, todos, plan, tasks, fleet, fleetAgents, git, subagentCount, brain, projectName, workingDir, processCount, processMemory, cpuPercent, context, estimatedContextTokens, Sage, memoryContextMonitor, contextStrategy, hiddenItems, mode, events, sessionId, eternalStage, goalSummary, droppedTools, indexState, breakerCountdown, modeLabel, debugStreamStats, enhanceCountdown, nextStepsAutoSubmitCountdown, nextStepsAutoSubmitLabel, autoProceedCountdown, sessionCount, mailbox, tokenSavingMode, toolCount, visibleChips, sideEffectCount, }: StatusBarProps): React.ReactElement;
+export declare function StatusBar({ model, provider, version, latestVersion, updateAvailable, state, thinkingWord, thinkingAnimationStyle, tokenCounter, hint, queueCount, yolo, autonomy, fleetWorkingTime, todos, plan, tasks, fleet, fleetAgents, git, subagentCount, brain, projectName, workingDir, processCount, processMemory, cpuPercent, context, estimatedContextTokens, Sage, memoryContextMonitor, contextStrategy, hiddenItems, mode, events, sessionId, eternalStage, goalSummary, droppedTools, indexState, breakerCountdown, modeLabel, debugStreamStats, enhanceCountdown, nextStepsAutoSubmitCountdown, nextStepsAutoSubmitLabel, autoProceedCountdown, sessionCount, mailbox, tokenSavingMode, toolCount, visibleChips, sideEffectCount, maxWidth, }: StatusBarProps): React.ReactElement;
 //# sourceMappingURL=status-bar.d.ts.map

package/dist/hit-test.d.ts

@@ -40,9 +40,10 @@ export type HitRegion =
 };
 /**
  * Columns at the right edge of the history viewport reserved for the copy/scroll
- * rail. Copy icons use the first column and the scrollbar track uses the last.
+ * rail. Copy icons use the first column, a blank gap separates them from the
+ * scrollbar track in the last column.
  */
-export declare const SCROLLBAR_HIT_WIDTH = 2;
+export declare const SCROLLBAR_HIT_WIDTH = 3;
 /** Rows available to managed history after reserving the measured bottom UI. */
 export declare function historyViewportRows(termRows: number, bottomHeight: number): number;
 /**

package/dist/hooks/use-provider-event-bridge.d.ts

@@ -1,6 +1,6 @@
 import { type Dispatch, type MutableRefObject, type SetStateAction } from 'react';
-import type { AppProps } from '../app-props.js';
 import type { Action } from '../app-action-type.js';
+import type { AppProps } from '../app-props.js';
 import { type MemoryContextMonitorState } from '../memory-context-monitor.js';
 interface ProviderEventBridgeOptions {
     events: AppProps['events'];

package/dist/hooks/use-sidebar-panel-data.d.ts

@@ -0,0 +1,59 @@
+/**
+ * Data hooks for sidebar panel twins.
+ *
+ * These hooks lift the data sources used by the bottom-region panels
+ * (ProcessList, Kanban, Connections) into the shared `app-view.tsx`
+ * runtime scope so the sidebar twins can receive real data instead of
+ * hardcoded empty arrays.
+ *
+ * Each hook is self-contained: it manages its own refresh interval and
+ * cleanup. The hooks must be called unconditionally (rules of hooks), but
+ * polling is gated by the `enabled` flag — app-view passes whether the
+ * twin currently occupies a visible sidebar slot. While a panel is closed
+ * or routed to the bottom region no polling runs (the bottom panels run
+ * their own polling when open), so the session pays no IPC probes or disk
+ * reads for panels nobody is looking at. Each hook performs an immediate
+ * first read when enabled, so data is fresh the moment the twin mounts.
+ */
+export interface SidebarProcess {
+    pid: number;
+    name: string;
+    status: string;
+}
+/**
+ * Read the live process registry. Refreshes every 2 seconds (only while
+ * `enabled`) so elapsed times and newly spawned/killed processes are
+ * reflected.
+ */
+export declare function useSidebarProcessList(enabled?: boolean): {
+    activeCount: number;
+    totalCount: number;
+    processes: readonly SidebarProcess[];
+};
+export interface SidebarConnection {
+    name: string;
+    status: 'ok' | 'warn' | 'down' | 'unknown';
+    latencyMs?: number | undefined;
+}
+/**
+ * Poll connections health every 8 seconds (only while `enabled`). The
+ * collection function lives in `connections-health.ts` and mirrors the
+ * WebUI server's shape. We map the richer `ConnectionHealthService` status
+ * into the sidebar's 4-state enum so the sidebar twin stays simple.
+ */
+export declare function useSidebarConnections(projectRoot: string, enabled?: boolean): readonly SidebarConnection[];
+export interface SidebarKanbanColumn {
+    name: string;
+    count: number;
+}
+/**
+ * Load the kanban board summary for the sidebar. Uses `listBoards()` to
+ * find the most recently used board, then fetches its column counts.
+ * Refreshes every 10 seconds (only while `enabled`).
+ */
+export declare function useSidebarKanban(projectRoot: string, enabled?: boolean): {
+    columns: readonly SidebarKanbanColumn[];
+    totalActive: number;
+    activeCardTitles: readonly string[];
+};
+//# sourceMappingURL=use-sidebar-panel-data.d.ts.map