revspec 0.8.3 → 0.8.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "revspec",
-  "version": "0.8.3",
+  "version": "0.8.4",
   "description": "Terminal-based spec review tool with real-time AI conversation",
   "type": "module",
   "license": "MIT",

package/src/tui/app.ts

@@ -108,6 +108,12 @@ export async function runTui(
   rootBox.add(bottomBar.box);
   renderer.root.add(rootBox);
 
+  // Wrap mode state
+  let wrapEnabled = false;
+  function currentWrapWidth(): number {
+    return wrapEnabled ? renderer.width : 0;
+  }
+
   // 7. Initial render
   function refreshPager(): void {
     // Spec mutation guard
@@ -118,7 +124,7 @@ export async function runTui(
       }
     } catch {}
 
-    buildPagerNodes(pager.lineNode, state, searchQuery, state.unreadThreadIds);
+    buildPagerNodes(pager.lineNode, state, searchQuery, state.unreadThreadIds, currentWrapWidth());
     buildTopBar(topBar, specFile, state, state.unreadCount(), specMtimeChanged);
     // Don't overwrite transient messages (welcome hint, warnings) during navigation
     if (!messageTimer) {
@@ -171,7 +177,7 @@ export async function runTui(
   // Map visual row back to spec line number (for H/M/L)
   function visualRowToSpecLine(targetRow: number): number {
     for (let i = 0; i < state.specLines.length; i++) {
-      const row = i + countExtraVisualLines(state.specLines, i);
+      const row = i + countExtraVisualLines(state.specLines, i, currentWrapWidth());
       if (row >= targetRow) return i + 1;
     }
     return state.lineCount;
@@ -219,7 +225,7 @@ export async function runTui(
   // Helper: scroll pager to ensure cursor line is visible
   function ensureCursorVisible(): void {
     // Map spec line to visual row, accounting for table border extra lines
-    const extra = countExtraVisualLines(state.specLines, state.cursorLine - 1);
+    const extra = countExtraVisualLines(state.specLines, state.cursorLine - 1, currentWrapWidth());
     const cursorRow = state.cursorLine - 1 + extra;
     const viewportHeight = Math.max(1, renderer.height - 2); // minus top + bottom bar
 
@@ -254,6 +260,13 @@ export async function runTui(
       exitTui(resolve, "session-end");
       return "exit";
     }
+    // :wrap — toggle line wrapping
+    if (cmd === "wrap") {
+      wrapEnabled = !wrapEnabled;
+      refreshPager();
+      showTransient(wrapEnabled ? "Line wrap on" : "Line wrap off", "info");
+      return "stay";
+    }
     // :{N} — jump to line number
     const lineNum = parseInt(cmd, 10);
     if (!isNaN(lineNum) && lineNum > 0) {
@@ -636,7 +649,7 @@ export async function runTui(
           refreshPager();
           break;
         case "center-cursor": {
-          const extra = countExtraVisualLines(state.specLines, state.cursorLine - 1);
+          const extra = countExtraVisualLines(state.specLines, state.cursorLine - 1, currentWrapWidth());
           const cursorRow = state.cursorLine - 1 + extra;
           const halfView = Math.floor(pageSize() / 2);
           pager.scrollBox.scrollTo(Math.max(0, cursorRow - halfView));

package/src/tui/help.ts

@@ -114,6 +114,7 @@ export function createHelp(opts: {
     "  :q/:wq    Quit (warns if unresolved)",
     "  :q!       Force quit",
     "  :{N}      Jump to line N",
+    "  :wrap     Toggle line wrapping",
     "  Ctrl+C    Force quit",
   ]);
 

package/src/tui/pager.ts

@@ -53,13 +53,33 @@ export function buildPagerContent(state: ReviewState, searchQuery?: string | nul
  * Inline markdown is parsed and styled per line.
  * Line numbers and thread hints are dimmed.
  */
-export function buildPagerNodes(lineNode: TextRenderable, state: ReviewState, searchQuery?: string | null, unreadThreadIds?: ReadonlySet<string>): void {
+/**
+ * Word-wrap a string at the given width, breaking at word boundaries.
+ */
+function wordWrap(text: string, width: number): string[] {
+  if (width <= 0 || text.length <= width) return [text];
+  const lines: string[] = [];
+  let remaining = text;
+  while (remaining.length > width) {
+    let breakAt = remaining.lastIndexOf(" ", width);
+    if (breakAt <= 0) breakAt = width; // no space found — hard break
+    lines.push(remaining.slice(0, breakAt));
+    remaining = remaining.slice(breakAt).replace(/^ /, ""); // trim leading space on continuation
+  }
+  if (remaining.length > 0) lines.push(remaining);
+  return lines;
+}
+
+export function buildPagerNodes(lineNode: TextRenderable, state: ReviewState, searchQuery?: string | null, unreadThreadIds?: ReadonlySet<string>, wrapWidth?: number): void {
   lineNode.clear();
 
   // Calculate dynamic gutter width based on total line count
   const numWidth = Math.max(String(state.lineCount).length, 3);
-  // Blank gutter for table borders: prefix(1) + indicator(1) + numWidth + spaces(2)
-  const gutterBlank = " ".repeat(2 + numWidth + 2);
+  const gutterWidth = 2 + numWidth + 2; // prefix(1) + indicator(1) + numWidth + spaces(2)
+  // Blank gutter for table borders and wrap continuations
+  const gutterBlank = " ".repeat(gutterWidth);
+  // Available content width for wrapping
+  const contentWidth = wrapWidth && wrapWidth > gutterWidth ? wrapWidth - gutterWidth : 0;
 
   // Pre-scan for table blocks so we can calculate column widths
   const tableBlocks = new Map<number, TableBlock>();
@@ -179,6 +199,17 @@ export function buildPagerNodes(lineNode: TextRenderable, state: ReviewState, se
           lineNode.add(TextNodeRenderable.fromString(part, { fg: theme.text, bg: isCursor ? theme.backgroundElement : undefined }));
         }
       }
+    } else if (contentWidth > 0 && specText.length > contentWidth) {
+      // Wrap long lines — first chunk gets markdown, continuations get blank gutter + markdown
+      const chunks = wordWrap(specText, contentWidth);
+      const segments = parseMarkdownLine(chunks[0]);
+      addSegments(lineNode, segments, theme.text, isCursor ? theme.backgroundElement : undefined);
+      for (let c = 1; c < chunks.length; c++) {
+        lineNode.add(TextNodeRenderable.fromString("\n", {}));
+        lineNode.add(TextNodeRenderable.fromString(gutterBlank, { fg: theme.textDim }));
+        const contSegments = parseMarkdownLine(chunks[c]);
+        addSegments(lineNode, contSegments, theme.text, isCursor ? theme.backgroundElement : undefined);
+      }
     } else {
       // Parse and render inline markdown
       const segments = parseMarkdownLine(specText);
@@ -195,10 +226,14 @@ export function buildPagerNodes(lineNode: TextRenderable, state: ReviewState, se
 // --- Visual row offset calculation ---
 
 /**
- * Count extra visual lines (table borders) before a given spec line index.
+ * Count extra visual lines (table borders + word wrap) before a given spec line index.
  * Used to map spec line numbers to actual visual rows in the rendered content.
  */
-export function countExtraVisualLines(specLines: string[], cursorIndex: number): number {
+export function countExtraVisualLines(specLines: string[], cursorIndex: number, wrapWidth?: number): number {
+  const numWidth = Math.max(String(specLines.length).length, 3);
+  const gutterWidth = 2 + numWidth + 2;
+  const contentWidth = wrapWidth && wrapWidth > gutterWidth ? wrapWidth - gutterWidth : 0;
+
   let extra = 0;
   let i = 0;
   while (i < specLines.length) {
@@ -215,6 +250,10 @@ export function countExtraVisualLines(specLines: string[], cursorIndex: number):
       if (cursorIndex >= tableEnd) extra++;
       continue;
     }
+    // Word wrap: count extra continuation lines
+    if (contentWidth > 0 && i < cursorIndex && specLines[i].length > contentWidth) {
+      extra += wordWrap(specLines[i], contentWidth).length - 1;
+    }
     i++;
   }
   return extra;
@@ -243,7 +282,7 @@ export function createPager(renderer: CliRenderer): PagerComponents {
     width: "100%",
     flexGrow: 1,
     scrollY: true,
-    scrollX: true,
+    scrollX: false,
     backgroundColor: theme.base,
   });
 

package/src/tui/ui/markdown.ts

@@ -82,7 +82,7 @@ export function parseMarkdownLine(line: string): StyledSegment[] {
   const headingMatch = line.match(/^(#{1,6})\s+(.*)/);
   if (headingMatch) {
     const level = headingMatch[1].length;
-    const color = level <= 2 ? theme.blue : theme.mauve;
+    const color = level <= 2 ? theme.blue : level === 3 ? theme.mauve : theme.textMuted;
     // Parse inline markdown within heading text
     const inner = parseInlineMarkdown(headingMatch[2]);
     return inner.map((s) => ({