@wrongstack/tui 0.298.1 → 0.298.3

package/dist/app-action-type.d.ts

@@ -280,6 +280,7 @@ export type Action = {
     breakerAutoKillResetMs: number;
     showModelReasoning: boolean;
     showAgentSwarmPanel: import('./app-settings-type.js').AgentSwarmPanelMode;
+    panelPositions: import('./ui-contracts.js').PanelPositionMap;
     readSymbols: boolean;
     showSageMemoryInject: boolean;
     sageMemoryInjectThreshold: number;

package/dist/app-settings-type.d.ts

@@ -1,5 +1,8 @@
 import type { FleetChatVerbosity, TokenSavingTier } from '@wrongstack/core/types';
 import type { CacheTtl, ContextMode, ReasoningEffort, StatuslineMode } from './settings-contracts.js';
+export type { PanelId, PanelPosition, PanelPositionMap } from './ui-contracts.js';
+export { coercePanelPositionMap, DEFAULT_PANEL_POSITIONS, PANEL_IDS, } from './ui-contracts.js';
+import type { PanelPositionMap } from './ui-contracts.js';
 /** Where to render the agent swarm panel: lower region, sidebar, or hidden. */
 export type AgentSwarmPanelMode = 'bottom' | 'sidebar' | 'off';
 /**
@@ -74,6 +77,15 @@ export type Settings = {
      *  sidebar, vertical), or 'off' (hidden). Default: 'bottom'.
      *  Backward-compat: old boolean configs are coerced — true→'bottom', false→'off'. */
     showAgentSwarmPanel: AgentSwarmPanelMode;
+    /**
+     * Per-panel position map. Each F-key panel can be set to 'bottom' (F-key
+     * behavior, the default) or 'sidebar' (rendered in the right sidebar).
+     * The map is always normalized to a full PanelPositionMap at boot via
+     * {@link coercePanelPositionMap}. Optional at the persisted-Settings
+     * boundary so older configs without the key don't typecheck-fail; the
+     * live-settings coercion always fills in a full map.
+     */
+    panelPositions?: Partial<PanelPositionMap>;
     /** Show SAGE Memory Inject blocks in tool results. Default: false (hidden). */
     showSageMemoryInject: boolean;
     /** Minimum relation strength for SAGE memory injection. Default: 0.85. */

package/dist/app-state.d.ts

@@ -7,7 +7,7 @@ import type { BrainLogEntry, BrainRiskLevel } from './brain-contracts.js';
 import type { BrainPanelSettings } from './brain-panel-model.js';
 import type { HistoryEntry } from './history-entry.js';
 import type { AuditLevel, CacheTtl, CompactorStrategy, ContextMode, LogLevel, ReasoningEffort, SettingsMode, StatuslineMode } from './settings-contracts.js';
-import type { AutonomyOption, ChipMeta, HelpEntry, LiveSessionEntry, McpPickerItem, ModeOption, PluginPickerItem, ProjectPickerItem, PromptPickEntry, ProviderOption, RefineFailureDecision, RefineFailureModel, SendMode, ShadowState, StatuslineItem, ToolPickerItem, WorktreeRow } from './ui-contracts.js';
+import type { AutonomyOption, ChipMeta, HelpEntry, LiveSessionEntry, McpPickerItem, ModeOption, PanelPositionMap, PluginPickerItem, ProjectPickerItem, PromptPickEntry, ProviderOption, RefineFailureDecision, RefineFailureModel, SendMode, ShadowState, StatuslineItem, ToolPickerItem, WorktreeRow } from './ui-contracts.js';
 export type { Settings } from './app-settings-type.js';
 export type { DraftEntry, GoalSummary, QueueItem, ResumeSessionEntry, SlashCommandMatch, } from './app-state-core-types.js';
 export type { FleetEntry } from './app-state-fleet.js';
@@ -275,7 +275,16 @@ export type State = {
         showModelReasoning: boolean;
         /** Agent swarm panel placement: 'bottom' (lower region), 'sidebar' (right sidebar), or 'off'. Default: 'bottom'. */
         showAgentSwarmPanel: import('./app-settings-type.js').AgentSwarmPanelMode;
-        /** Show SAGE Memory Inject blocks in tool results. Default: false. */
+        /**
+         * Per-panel position map mirrored from the persisted Settings shape.
+         * Each F-key panel can be set to 'bottom' (F-key behavior, the default)
+         * or 'sidebar' (rendered in the right sidebar). When a panel is set to
+         * 'sidebar' AND its F-key toggle is on, the bottom view hides and the
+         * sidebar shows the panel twin instead. When the F-key is off, neither
+         * surface shows the panel.
+         */
+        panelPositions: PanelPositionMap;
+        /** Show SAGE Memory Inject blocks in tool results. Default: false (hidden). */
         showSageMemoryInject: boolean;
         /** Minimum relation strength for SAGE memory injection. Default: 0.85. */
         sageMemoryInjectThreshold: number;

package/dist/app-ui-state.d.ts

@@ -1,5 +1,29 @@
 import type { State } from './app-reducer.js';
 import type { StatuslineItem } from './components/statusline-picker.js';
+import { type PanelId, type PanelPositionMap } from './ui-contracts.js';
 export declare function mergeStatuslineHiddenItems(hookHidden: StatuslineItem[], reducerHidden: StatuslineItem[]): StatuslineItem[];
+/**
+ * True when any of the legacy picker overlays is open. Note: panel flags
+ * like `state.sessionsPanelOpen` are intentionally NOT included here so
+ * the local `overlayOpen` gate in app-view.tsx can apply its per-panel
+ * routing guard (`!anyRoutedToSidebar(id)`) and let the sidebar twin
+ * render. Adding a new panel-open flag to this list would silently
+ * collapse the sidebar to width 0 and prevent the twin from mounting.
+ */
 export declare function isPickerOverlayOpen(state: State): boolean;
+export interface SidebarLayoutState {
+    panelPositions: PanelPositionMap;
+    overlayOpen: boolean;
+    sidebarWidth: number;
+    /** Width AppView must pass to nested routed sidebar panel frames. */
+    sidebarContentWidth: number;
+    mainColumnWidth: number;
+}
+/**
+ * Resolve the TUI's right-sidebar layout once from the open-panel flags and
+ * persisted panel routing. Both the renderer and input/mouse hit-testing use
+ * this so a sidebar-routed panel narrows history consistently instead of
+ * being treated as a full-width overlay by one surface.
+ */
+export declare function resolveSidebarLayout(state: State, termCols: number, panelPositionsInput: Partial<Record<PanelId, 'bottom' | 'sidebar'>> | undefined, mailboxPanelOpen: boolean): SidebarLayoutState;
 //# sourceMappingURL=app-ui-state.d.ts.map

package/dist/auth-panel-model.d.ts

@@ -68,12 +68,37 @@ export interface AuthPanelHost {
     addKey(providerId: string, io: AuthFlowIo): Promise<AuthFlowResult>;
     updateKey(providerId: string, label: string, io: AuthFlowIo): Promise<AuthFlowResult>;
     editField(providerId: string, field: 'family' | 'baseUrl' | 'models', io: AuthFlowIo): Promise<AuthFlowResult>;
+    /**
+     * Edit a single model's detailed schema fields (ME-5). Opens a field-group
+     * prompt flow covering identity, limits, pricing, modalities, capability
+     * flags, and dates. Validates via the ME-1 zod schema.
+     *
+     * Shows the models.dev catalog reference values alongside the current
+     * values so the user can see what the upstream defaults are and reset
+     * individual fields back to them.
+     */
+    editModelDetails(providerId: string, modelId: string, io: AuthFlowIo): Promise<AuthFlowResult>;
+    /**
+     * Add a model to the provider's allowlist with optional full schema details
+     * (ME-5). When `fromCatalog` is true, prefills from the models.dev registry.
+     */
+    addModel(providerId: string, io: AuthFlowIo, opts?: {
+        fromCatalog?: boolean | undefined;
+    }): Promise<AuthFlowResult>;
+    /** Remove a single model from the provider's allowlist + customModels (ME-5). */
+    removeModel(providerId: string, modelId: string): Promise<string | null>;
+    /**
+     * Reset a model's customModels override back to the models.dev catalog
+     * values (ME-5). Drops the customModels entry for this modelId so the
+     * runtime falls back to the live catalog data.
+     */
+    resetModelToCatalog(providerId: string, modelId: string): Promise<string | null>;
     addCatalogProvider(catalogId: string, io: AuthFlowIo): Promise<AuthFlowResult>;
     addCustomProvider(io: AuthFlowIo): Promise<AuthFlowResult>;
     addLocal(presetId: string, io: AuthFlowIo): Promise<AuthFlowResult>;
     oauthLogin(kind: AuthOAuthKind, io: AuthFlowIo): Promise<AuthFlowResult>;
 }
-export type AuthPanelView = 'list' | 'provider' | 'catalog' | 'local' | 'oauth' | 'flow';
+export type AuthPanelView = 'list' | 'provider' | 'models' | 'catalog' | 'local' | 'oauth' | 'flow';
 export type AuthConfirmAction = {
     kind: 'delete-key';
     providerId: string;
@@ -81,6 +106,10 @@ export type AuthConfirmAction = {
 } | {
     kind: 'remove-provider';
     providerId: string;
+} | {
+    kind: 'remove-model';
+    providerId: string;
+    modelId: string;
 };
 export interface AuthPanelState {
     open: boolean;
@@ -125,7 +154,12 @@ export type AuthPanelRow = {
     keyRow: AuthKeyRow;
 } | {
     kind: 'provider-action';
-    action: 'add-key' | 'edit-family' | 'edit-base-url' | 'edit-models' | 'remove';
+    action: 'add-key' | 'edit-family' | 'edit-base-url' | 'edit-models' | 'edit-model-details' | 'add-model' | 'reset-model-to-catalog' | 'remove' | 'back-to-list';
+} | {
+    kind: 'model-row';
+    providerId: string;
+    modelId: string;
+    name: string;
 } | {
     kind: 'catalog-entry';
     entry: AuthCatalogRow;

package/dist/components/plan-panel.d.ts

@@ -1,4 +1,22 @@
 import type React from 'react';
+export interface PlanItem {
+    id: string;
+    title: string;
+    details?: string;
+    status: 'open' | 'in_progress' | 'done';
+    createdAt: string;
+    updatedAt: string;
+}
+export interface PlanPanelData {
+    items: PlanItem[];
+    title?: string | undefined;
+    scope: 'session' | 'project';
+    loading: boolean;
+    error: string | null;
+    updatedAt?: string | undefined;
+    setScope: (scope: 'session' | 'project') => void;
+    load: (scope: 'session' | 'project', quiet?: boolean) => Promise<void>;
+}
 export interface PlanPanelProps {
     /** Absolute path to the project root. */
     projectRoot: string;
@@ -8,10 +26,19 @@ export interface PlanPanelProps {
     onClose: () => void;
 }
 /**
- * Full-screen plan panel (F5 in TUI).
+ * Plan panel data hook (F5 in TUI).
+ *
+ * Reads the active plan JSON file from disk and renders plan items grouped
+ * by status. Shows the current scope and a hint for switching scopes via
+ * the /plan tool.
  *
- * Reads the active plan JSON file from disk and renders plan items grouped by status.
- * Shows the current scope and a hint for switching scopes via the /plan tool.
+ * Each consumer gets its own polling interval, gated by `enabled` (default
+ * true). Consumers pass `enabled` reflecting whether their panel surface is
+ * actually mounted — e.g. app-view gates the sidebar twin on its slot
+ * visibility — so a closed or bottom-routed plan panel does not keep a
+ * second 3s file-read poll alive for the whole session (the bottom PlanPanel
+ * mounts its own instance of this hook while open).
  */
+export declare function usePlanPanelData(projectRoot: string, sessionId: string | null, enabled?: boolean): PlanPanelData;
 export declare function PlanPanel({ projectRoot, sessionId, onClose: _onClose, }: PlanPanelProps): React.ReactElement;
 //# sourceMappingURL=plan-panel.d.ts.map

package/dist/components/settings-picker-model.d.ts

@@ -1,3 +1,4 @@
+import { SettingsPickerPatch } from '../settings-contracts.js';
 /** Selectable presets for the auto-proceed delay, so the field is fully
  *  keyboard-cyclable (←/→) instead of needing typed numeric input. */
 export declare const DELAY_PRESETS_MS: number[];
@@ -81,8 +82,13 @@ export type AnimationStyleChoice = (typeof ANIMATION_STYLE_CHOICES)[number];
 /** Human-readable label for an animation style choice (including cycle). */
 export declare function formatAnimationStyle(style: AnimationStyleChoice): string;
 export declare const MODE_DESC: Record<SettingsMode, string>;
-/** Total number of settings rows (used for wrap-around navigation). */
-export declare const SETTINGS_FIELD_COUNT = 45;
+/** Total number of settings rows (used for wrap-around navigation).
+ *  Indices 0–44 are the legacy auto-rebuilt Settings surface; 45..44+PANEL_IDS.length
+ *  are the per-panel position rows (one per PanelId in PANEL_IDS order)
+ *  added when the showAgentSwarmPanel tri-state was generalized into the
+ *  per-panel PanelPositionMap. Derived from PANEL_IDS.length so adding
+ *  a new panel id automatically extends the surface. */
+export declare const SETTINGS_FIELD_COUNT: number;
 /**
  * Field index of the "Thinking word" row. The reducer's per-field switch and
  * the app.tsx key handler both branch on this, so it lives next to the row
@@ -134,57 +140,12 @@ export declare const THINKING_WORD_PRESETS: readonly ['thinking', 'random', 'wor
 export declare const CONFIG_SCOPES: readonly ['global', 'project'];
 export type ConfigScope = (typeof CONFIG_SCOPES)[number];
 /**
- * Partial patch for the configurable keys of the settings-picker state.
- * Excludes non-configurable keys (open, field, lastSettingsField, filter,
- * hint, thinkingWordEditing, thinkingWordDraft).
+ * Re-export of the canonical `SettingsPickerPatch` from `settings-contracts.ts`.
+ * That module is the single source of truth so that `Action['patch']` (in
+ * app-action-type.ts) and the helpers below stay in lock-step. Adding a new
+ * key here requires adding it there too — keep them in sync.
  */
-export type SettingsPickerPatch = Partial<{
-    mode: SettingsMode;
-    delayMs: number;
-    titleAnimation: boolean;
-    yolo: boolean;
-    fleetChat: FleetChatVerbosityTui;
-    chime: boolean;
-    confirmExit: boolean;
-    nextPrediction: boolean;
-    featureMcp: boolean;
-    featurePlugins: boolean;
-    featureMemory: boolean;
-    featureSkills: boolean;
-    featureModelsRegistry: boolean;
-    tokenSavingTier: TokenSavingTierTui;
-    allowOutsideProjectRoot: boolean;
-    contextAutoCompact: boolean;
-    contextStrategy: CompactorStrategy;
-    contextMode: ContextMode;
-    maxConcurrent: number;
-    logLevel: LogLevel;
-    auditLevel: AuditLevel;
-    indexOnStart: boolean;
-    multiDiffSummaryThreshold: number;
-    maxIterations: number;
-    autoProceedMaxIterations: number;
-    enhanceDelayMs: number;
-    preRefineSeconds: number;
-    enhanceEnabled: boolean;
-    enhanceLanguage: EnhanceLanguage;
-    debugStream: boolean;
-    statuslineMode: StatuslineMode;
-    reasoningMode: ReasoningMode;
-    reasoningEffort: ReasoningEffort;
-    reasoningPreserve: boolean;
-    thinkingWord: string;
-    cacheTtl: CacheTtl;
-    configScope: ConfigScope;
-    animationStyle: AnimationStyleChoice;
-    breakerEnabled: boolean;
-    breakerAutoKillResetMs: number;
-    showModelReasoning: boolean;
-    showAgentSwarmPanel: import('../app-settings-type.js').AgentSwarmPanelMode;
-    readSymbols: boolean;
-    showSageMemoryInject: boolean;
-    sageMemoryInjectThreshold: number;
-}>;
+export type { SettingsPickerPatch };
 /**
  * Human-readable labels for all settings fields (0–SETTINGS_FIELD_COUNT-1),
  * in picker row order. Used by `resolveSettingsFieldValue` for confirmation

package/dist/components/settings-picker.d.ts

@@ -75,6 +75,11 @@ export interface SettingsPickerProps {
     sageMemoryInjectThreshold: number;
     /** When true, read tool includes codebase-index symbols alongside file content. */
     readSymbols: boolean;
+    /**
+     * Per-panel placement map (F-key bottom vs right sidebar). One picker row
+     * per PanelId in PANEL_IDS order; each row cycles 'bottom' ↔ 'sidebar'.
+     */
+    panelPositions: import('../ui-contracts.js').PanelPositionMap;
     /** Raw SSE stream debugging toggle — hex-dump every byte received from providers. */
     debugStream: boolean;
     /** Statusline density: minimum single-line or detailed multi-line. */
@@ -97,5 +102,5 @@ export interface SettingsPickerProps {
     filter?: string | undefined;
     hint?: string | undefined;
 }
-export declare function SettingsPicker({ field, filter, mode, delayMs, titleAnimation, yolo, fleetChat, chime, confirmExit, nextPrediction, featureMcp, featurePlugins, featureMemory, featureSkills, featureModelsRegistry, tokenSavingTier, allowOutsideProjectRoot, maxIterations, autoProceedMaxIterations, enhanceDelayMs, enhanceEnabled, enhanceLanguage, preRefineSeconds, indexOnStart, multiDiffSummaryThreshold, thinkingWord, thinkingWordEditing, thinkingWordDraft, reasoningMode, reasoningEffort, reasoningPreserve, cacheTtl, contextAutoCompact, contextStrategy, contextMode, maxConcurrent, logLevel, auditLevel, debugStream, statuslineMode, configScope, profileConfigPath, animationStyle, breakerEnabled, breakerAutoKillResetMs, showModelReasoning, showAgentSwarmPanel, showSageMemoryInject, sageMemoryInjectThreshold, readSymbols, hint, }: SettingsPickerProps): React.ReactElement;
+export declare function SettingsPicker({ field, filter, mode, delayMs, titleAnimation, yolo, fleetChat, chime, confirmExit, nextPrediction, featureMcp, featurePlugins, featureMemory, featureSkills, featureModelsRegistry, tokenSavingTier, allowOutsideProjectRoot, maxIterations, autoProceedMaxIterations, enhanceDelayMs, enhanceEnabled, enhanceLanguage, preRefineSeconds, indexOnStart, multiDiffSummaryThreshold, thinkingWord, thinkingWordEditing, thinkingWordDraft, reasoningMode, reasoningEffort, reasoningPreserve, cacheTtl, contextAutoCompact, contextStrategy, contextMode, maxConcurrent, logLevel, auditLevel, debugStream, statuslineMode, configScope, profileConfigPath, animationStyle, breakerEnabled, breakerAutoKillResetMs, showModelReasoning, showAgentSwarmPanel, showSageMemoryInject, sageMemoryInjectThreshold, readSymbols, panelPositions, hint, }: SettingsPickerProps): React.ReactElement;
 //# sourceMappingURL=settings-picker.d.ts.map

package/dist/components/sidebar-panel-frame.d.ts

@@ -0,0 +1,70 @@
+import type React from 'react';
+export interface SidebarPanelFrameProps {
+    /** Accent color for the rail, title, and separator. */
+    accent: string;
+    /** Header glyph, e.g. `glyphs.fleet` or `glyphs.sessions`. */
+    icon: string;
+    /** Uppercase title (e.g. "FLEET", "PLAN", "AGENTS"). */
+    title: string;
+    /**
+     * Width allocated to this routed panel inside RightSidebar. The outer shell
+     * owns the border and padding; this frame spends the full content width on
+     * hierarchy and data.
+     */
+    width: number;
+    /** Optional quiet subtitle hidden on narrow terminals. */
+    kicker?: string | undefined;
+    /** Optional right-aligned header content (status badge, counts, etc.). */
+    right?: React.ReactNode | undefined;
+    /** Footer content (key hints, footer note). Renders under the body. */
+    footer?: React.ReactNode | undefined;
+    /** Body content. The outer RightSidebar owns viewport clipping. */
+    children?: React.ReactNode | undefined;
+}
+/**
+ * Truncate a string to fit within `max` display columns, adding an ellipsis.
+ * Exported so sibling sidebar panel files can use the same string-fitting
+ * helper without pulling in sidebar-content.tsx's full implementation.
+ */
+export declare function trunc(s: string, max: number): string;
+/**
+ * A section header: colored glyph + bold uppercase label, a dotted leader
+ * filling the remaining width, and an optional right-aligned badge. Always
+ * renders exactly one row of exactly `innerWidth` columns — the badge is
+ * dropped gracefully when there is no room (narrow terminals).
+ */
+export declare function SidebarSectionHeader({ glyph, label, color, badge, badgeColor, innerWidth, }: {
+    glyph: string;
+    label: string;
+    color: string;
+    badge?: string | undefined;
+    badgeColor?: string | undefined;
+    innerWidth: number;
+}): React.ReactElement;
+/** A raised content band sized for a narrow rail. Section headers provide the
+ * accent, while the lifted surface groups related data without spending any
+ * horizontal columns on nested chrome. */
+export declare function SidebarPanelCard({ innerWidth, marginBottom, children, }: {
+    innerWidth: number;
+    marginBottom?: number | undefined;
+    children: React.ReactNode;
+}): React.ReactElement;
+/**
+ * SidebarPanelFrame — the standard chrome wrapper used by every sidebar
+ * panel variant. It renders an accent-led title and telemetry strip inside the
+ * existing RightSidebar shell, followed by a natural-height body and optional
+ * footer. Avoiding a second border preserves scarce horizontal space; the
+ * outer shell clips the combined routed-panel and persistent-content stack.
+ */
+export declare function SidebarPanelFrame({ accent, icon, title, width, kicker, right, footer, children, }: SidebarPanelFrameProps): React.ReactElement;
+/**
+ * useSidebarPanelSize — returns a sensible default width / height for a
+ * sidebar panel given the terminal dimensions. Width mirrors
+ * `computeSidebarWidth` from `sidebar.tsx`; height is the full terminal
+ * minus a small safety margin for the focus indicator row.
+ */
+export declare function useSidebarPanelSize(): {
+    width: number;
+    height: number;
+};
+//# sourceMappingURL=sidebar-panel-frame.d.ts.map

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

@@ -7,6 +7,15 @@ export declare const SIDEBAR_MIN_WIDTH = 20;
 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.

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