tmux-ide 2.9.0-beta.39 → 2.9.0-beta.40

package/bin/cli.js

@@ -11279,7 +11279,7 @@ var require_package = __commonJS({
   "package.json"(exports, module) {
     module.exports = {
       name: "tmux-ide",
-      version: "2.9.0-beta.39",
+      version: "2.9.0-beta.40",
       description: "A visual, agent-aware IDE for any tmux session, with optional workspace presets",
       type: "module",
       bin: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tmux-ide",
-  "version": "2.9.0-beta.39",
+  "version": "2.9.0-beta.40",
   "description": "A visual, agent-aware IDE for any tmux session, with optional workspace presets",
   "type": "module",
   "bin": {

package/packages/daemon/dist/tui/mirror/runtime/application-machine-sidebar.jsx

@@ -12,7 +12,6 @@ import { Surface } from "../ui/surface.jsx";
 import { useKeyboardRoute } from "../ui/keyboard-router.jsx";
 /** Pure machine navigation. All connection and session authority stays with the caller. */
 export function ApplicationMachineSidebar(props) {
-    const [showHelp, setShowHelp] = createSignal(false);
     const [localFocused, setLocalFocused] = createSignal(false);
     const focused = () => props.model.focused?.() ?? localFocused();
     const [localCollapsed, setCollapsed] = createSignal(new Set());
@@ -31,14 +30,12 @@ export function ApplicationMachineSidebar(props) {
         const start = Math.max(0, active - tabHeight() + 1);
         return tabs.slice(start, start + tabHeight());
     };
-    const helpHeight = () => showHelp() ? Math.min(5, Math.max(0, Math.floor(props.height / 3))) : 0;
     const machineHeight = () => Math.max(0, props.height -
         1 -
         (props.model.onAddMachine ? 1 : 0) -
         agentHeight() -
         controlsHeight() -
         searchHeight() -
-        helpHeight() -
         tabHeight());
     const active = (row) => row.group.id === props.model.activeMachineId() &&
         (row.agent
@@ -238,7 +235,7 @@ export function ApplicationMachineSidebar(props) {
         event.preventDefault();
         event.stopPropagation();
         if (key === "help") {
-            setShowHelp(!showHelp());
+            props.onHelp?.("keyboard");
             return true;
         }
         if (key === "search") {
@@ -246,10 +243,6 @@ export function ApplicationMachineSidebar(props) {
             return true;
         }
         if (key === "escape") {
-            if (showHelp()) {
-                setShowHelp(false);
-                return true;
-            }
             setLocalFocused(false);
             props.model.onBlur?.();
             return true;
@@ -309,7 +302,7 @@ export function ApplicationMachineSidebar(props) {
         <Show when={props.model.tabs?.().length && props.width >= 28}>
           <KeyHint theme={props.theme} keys="F9" label="Tabs" quiet/>
         </Show>
-        <KeyHint theme={props.theme} keys="?" label={props.width >= 20 ? "Help" : undefined} quiet button onPress={() => setShowHelp(!showHelp())}/>
+        <KeyHint theme={props.theme} keys="?" label={props.width >= 20 ? "Help" : undefined} quiet button onPress={() => props.onHelp?.("mouse")}/>
       </box>
       <For each={visibleTabs()}>
         {(tab) => (<box height={1} flexDirection="row">
@@ -416,11 +409,6 @@ export function ApplicationMachineSidebar(props) {
             {props.agents}
           </scrollbox>)}
       </For>
-      <Show when={helpHeight() > 0}>
-        <text height={helpHeight()} fg={props.theme.roles.text.secondary}>
-          {"j/k ↑↓ move · g/G ends\nPgUp/Dn · Ctrl-U/D half\nh/l ←→ collapse/expand\nEnter open · / search\nf favorite · Esc terminal"}
-        </text>
-      </Show>
       <Show when={props.model.onOpenSwitcher}>
         <KeyHint theme={props.theme} keys="F6" label="Sessions" width={props.width} quiet button onPress={() => props.model.onOpenSwitcher?.()}/>
       </Show>

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

@@ -117,8 +117,8 @@ export function ApplicationMachineSidebar(props: {
   readonly theme: SemanticThemeSnapshot;
   readonly agents?: JSX.Element;
   readonly agentRows?: number;
+  readonly onHelp?: (source: "keyboard" | "mouse") => void;
 }) {
-  const [showHelp, setShowHelp] = createSignal(false);
   const [localFocused, setLocalFocused] = createSignal(false);
   const focused = () => props.model.focused?.() ?? localFocused();
   const [localCollapsed, setCollapsed] = createSignal<ReadonlySet<string>>(new Set());
@@ -141,8 +141,6 @@ export function ApplicationMachineSidebar(props: {
     const start = Math.max(0, active - tabHeight() + 1);
     return tabs.slice(start, start + tabHeight());
   };
-  const helpHeight = () =>
-    showHelp() ? Math.min(5, Math.max(0, Math.floor(props.height / 3))) : 0;
   const machineHeight = () =>
     Math.max(
       0,
@@ -152,7 +150,6 @@ export function ApplicationMachineSidebar(props: {
         agentHeight() -
         controlsHeight() -
         searchHeight() -
-        helpHeight() -
         tabHeight(),
     );
   const active = (row: Row) =>
@@ -378,7 +375,7 @@ export function ApplicationMachineSidebar(props: {
     event.preventDefault();
     event.stopPropagation();
     if (key === "help") {
-      setShowHelp(!showHelp());
+      props.onHelp?.("keyboard");
       return true;
     }
     if (key === "search") {
@@ -386,10 +383,6 @@ export function ApplicationMachineSidebar(props: {
       return true;
     }
     if (key === "escape") {
-      if (showHelp()) {
-        setShowHelp(false);
-        return true;
-      }
       setLocalFocused(false);
       props.model.onBlur?.();
       return true;
@@ -471,7 +464,7 @@ export function ApplicationMachineSidebar(props: {
           label={props.width >= 20 ? "Help" : undefined}
           quiet
           button
-          onPress={() => setShowHelp(!showHelp())}
+          onPress={() => props.onHelp?.("mouse")}
         />
       </box>
       <For each={visibleTabs()}>
@@ -657,13 +650,6 @@ export function ApplicationMachineSidebar(props: {
           </scrollbox>
         )}
       </For>
-      <Show when={helpHeight() > 0}>
-        <text height={helpHeight()} fg={props.theme.roles.text.secondary}>
-          {
-            "j/k ↑↓ move · g/G ends\nPgUp/Dn · Ctrl-U/D half\nh/l ←→ collapse/expand\nEnter open · / search\nf favorite · Esc terminal"
-          }
-        </text>
-      </Show>
       <Show when={props.model.onOpenSwitcher}>
         <KeyHint
           theme={props.theme}

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

@@ -39,7 +39,7 @@ export function createApplicationPaletteCommandOwner(options: {
   readonly disabledReason?: (command: ApplicationPaletteCommand) => string | null;
   readonly targetKey?: () => string;
 }) {
-  const [referencePage, setReferencePage] = createSignal<"shortcuts" | "changes">();
+  const [referencePage, setReferencePage] = createSignal<"shortcuts" | "changes" | "help">();
   const [closeArmed, setCloseArmed] = createSignal(false);
   const [busy, setBusy] = createSignal(false);
   let armedTarget: string | undefined;

package/packages/daemon/src/tui/mirror/runtime/application-reference-sheet.tsx

@@ -44,7 +44,7 @@ const releases = [
 type Row = { kind: "heading" | "text" | "action" | "gap"; label: string; detail?: string };
 
 export function ApplicationReferenceSheet(props: {
-  page: "shortcuts" | "changes";
+  page: "shortcuts" | "changes" | "help";
   width: number;
   height: number;
   theme: SemanticThemeSnapshot;
@@ -78,7 +78,48 @@ export function ApplicationReferenceSheet(props: {
       }
       if (!result.length) result.push({ kind: "text", label: "No matching shortcuts" });
     } else {
-      for (const release of releases) {
+      const sections =
+        page() === "help"
+          ? [
+              {
+                version: "Find your work",
+                lines: [
+                  "Machines are your local computer and connected SSH hosts. Each session contains terminal windows and panes.",
+                  "Open a session or agent in the sidebar to jump to its terminal. Home brings agents from your connected machines together.",
+                ],
+              },
+              {
+                version: "Move around",
+                lines: [
+                  "F1 Home · F2 Terminals · F6 Sessions · F7 Attention",
+                  "F10 shows or hides the sidebar. F5 opens Commands for actions, appearance and keyboard shortcuts.",
+                ],
+              },
+              {
+                version: "Use the sidebar",
+                lines: [
+                  "Click a row to open it. With the sidebar focused, use ↑↓ or j/k to move and Enter to open.",
+                  "←→ or h/l collapse/expand machines. / searches sessions. f toggles a session favorite. Esc returns to the terminal.",
+                  "PgUp/PgDn scroll a page; Ctrl-U/D scroll half a page. g/G jump to the first or last row.",
+                ],
+              },
+              {
+                version: "Follow your agents",
+                lines: [
+                  "On Home, search by name and choose All, Working or Needs attention. Select an agent and press Enter to open its pane.",
+                  "Unavailable means the connection or observation is missing; it does not mean the agent has stopped.",
+                ],
+              },
+              {
+                version: "Connect another machine",
+                lines: [
+                  "Choose Add machine in the sidebar and enter an SSH alias or user@host. Set up SSH key access and host trust first.",
+                  "Run tmux-ide --headless on the remote machine before connecting.",
+                ],
+              },
+            ]
+          : releases;
+      for (const release of sections) {
         if (result.length) result.push({ kind: "gap", label: "" });
         result.push({ kind: "heading", label: release.version });
         for (const line of release.lines) {
@@ -139,8 +180,18 @@ export function ApplicationReferenceSheet(props: {
       viewportHeight={props.height}
       width={metrics().width}
       height={metrics().height}
-      title={page() === "shortcuts" ? "Keyboard shortcuts" : "What's new"}
-      footer="Tab switch sheet · ↑↓ scroll · Esc back"
+      title={
+        page() === "help"
+          ? "Using tmux-ide"
+          : page() === "shortcuts"
+            ? "Keyboard shortcuts"
+            : "What's new"
+      }
+      footer={
+        page() === "help"
+          ? "Tab shortcuts · ↑↓ scroll · Esc back"
+          : "Tab switch sheet · ↑↓ scroll · Esc back"
+      }
       zIndex={100}
       onDismiss={props.onClose}
     >

package/packages/daemon/src/tui/mirror/runtime/application-shell-catalog.tsx

@@ -51,8 +51,8 @@ export interface ApplicationCatalogShellProps {
   readonly paletteSelection?: Accessor<number>;
   readonly palettePreviewActive?: Accessor<boolean>;
   readonly onPaletteModalChange?: (open: boolean) => void;
-  readonly paletteReferencePage?: Accessor<"shortcuts" | "changes" | undefined>;
-  readonly onPaletteReferenceChange?: (page: "shortcuts" | "changes" | undefined) => void;
+  readonly paletteReferencePage?: Accessor<"shortcuts" | "changes" | "help" | undefined>;
+  readonly onPaletteReferenceChange?: (page: "shortcuts" | "changes" | "help" | undefined) => void;
   readonly paletteKeyboardHint?: Accessor<string>;
   readonly paletteQuery?: Accessor<string>;
   readonly paletteDisabledReason?: (command: ApplicationPaletteCommand) => string | null;
@@ -418,6 +418,10 @@ export function ApplicationCatalogShell(props: ApplicationCatalogShellProps): JS
               {(model) => (
                 <ApplicationMachineSidebar
                   model={model()}
+                  onHelp={(source) => {
+                    props.onSetPaletteOpen(true, source);
+                    props.onPaletteReferenceChange?.("help");
+                  }}
                   width={chrome().sidebar.width}
                   height={chrome().sidebar.height}
                   theme={props.theme}

package/packages/daemon/src/tui/mirror/runtime/application-shell-overlays.tsx

@@ -106,8 +106,8 @@ export function MinimalPalette(props: {
   readonly title?: string;
   readonly onViewport?: (rows: number) => void;
   readonly onFavorite?: (command: ApplicationPaletteCommand) => void;
-  readonly referencePage?: "shortcuts" | "changes";
-  readonly onReferenceChange?: (page: "shortcuts" | "changes" | undefined) => void;
+  readonly referencePage?: "shortcuts" | "changes" | "help";
+  readonly onReferenceChange?: (page: "shortcuts" | "changes" | "help" | undefined) => void;
   readonly keyboardHint?: string;
   readonly previewActive?: boolean;
   readonly onModalChange?: (open: boolean) => void;
@@ -123,8 +123,8 @@ export function MinimalPalette(props: {
 }): JSX.Element {
   const [expanded, setExpanded] = createSignal(false);
   const [modal, setModal] = createSignal(false);
-  const [sheet, setSheet] = createSignal<"shortcuts" | "changes">();
-  const openSheet = (page: "shortcuts" | "changes" | undefined) => {
+  const [sheet, setSheet] = createSignal<"shortcuts" | "changes" | "help">();
+  const openSheet = (page: "shortcuts" | "changes" | "help" | undefined) => {
     props.onReferenceChange?.(page);
     setSheet(page);
     setModal(!!page);

package/packages/daemon/src/tui/mirror/runtime/application-shell-view.tsx

@@ -100,8 +100,8 @@ export interface ApplicationShellViewProps {
   readonly paletteOpen: Accessor<boolean>;
   readonly paneRenameDialog?: Accessor<ApplicationPaneRenameDraft | null>;
   readonly paletteSelection?: Accessor<number>;
-  readonly paletteReferencePage?: Accessor<"shortcuts" | "changes" | undefined>;
-  readonly onPaletteReferenceChange?: (page: "shortcuts" | "changes" | undefined) => void;
+  readonly paletteReferencePage?: Accessor<"shortcuts" | "changes" | "help" | undefined>;
+  readonly onPaletteReferenceChange?: (page: "shortcuts" | "changes" | "help" | undefined) => void;
   readonly paletteKeyboardHint?: Accessor<string>;
   readonly palettePreviewActive?: Accessor<boolean>;
   readonly onPaletteModalChange?: (open: boolean) => void;
@@ -455,6 +455,10 @@ export function ApplicationShellView(props: ApplicationShellViewProps): JSX.Elem
                   {(model) => (
                     <ApplicationMachineSidebar
                       model={model()}
+                      onHelp={(source) => {
+                        props.onSetPaletteOpen(true, source);
+                        props.onPaletteReferenceChange?.("help");
+                      }}
                       agentRows={
                         model()
                           .groups()