ink-prompt 0.1.4 → 0.1.5

package/dist/components/MultilineInput/TextBuffer.d.ts

@@ -32,6 +32,21 @@ export declare function insertNewLine(buffer: Buffer, cursor: Cursor): {
     buffer: Buffer;
     cursor: Cursor;
 };
+/**
+ * Information about a visual row within a wrapped line.
+ */
+interface VisualRowInfo {
+    /** Starting offset in the buffer line */
+    start: number;
+    /** Length of this visual row */
+    length: number;
+}
+/**
+ * Break a line into visual rows using word-aware wrapping.
+ * Words are kept intact when possible, breaking at spaces.
+ * Long words that exceed width are hard-wrapped.
+ */
+export declare function getVisualRows(line: string, width: number): VisualRowInfo[];
 /**
  * Move cursor in specified direction with bounds checking.
  * When width is provided, up/down movement is based on visual lines (accounting for wrapping).
@@ -50,3 +65,4 @@ export declare function getOffset(buffer: Buffer, cursor: Cursor): number;
  * Get the cursor position from a flat offset.
  */
 export declare function getCursor(buffer: Buffer, offset: number): Cursor;
+export {};

package/dist/components/MultilineInput/TextBuffer.js

@@ -119,46 +119,101 @@ export function insertNewLine(buffer, cursor) {
         cursor: { line: line + 1, column: 0 },
     };
 }
+/**
+ * Break a line into visual rows using word-aware wrapping.
+ * Words are kept intact when possible, breaking at spaces.
+ * Long words that exceed width are hard-wrapped.
+ */
+export function getVisualRows(line, width) {
+    const safeWidth = Math.max(1, width);
+    const rows = [];
+    if (line.length === 0) {
+        return [{ start: 0, length: 0 }];
+    }
+    let offset = 0;
+    let remaining = line;
+    while (remaining.length > 0) {
+        let chunkLength = safeWidth;
+        if (remaining.length <= safeWidth) {
+            chunkLength = remaining.length;
+        }
+        else {
+            // Find split point (last space within width)
+            let splitIndex = -1;
+            for (let i = safeWidth - 1; i >= 0; i--) {
+                if (remaining[i] === ' ') {
+                    splitIndex = i;
+                    break;
+                }
+            }
+            if (splitIndex !== -1) {
+                // Include the space in the chunk
+                chunkLength = splitIndex + 1;
+            }
+        }
+        rows.push({ start: offset, length: chunkLength });
+        remaining = remaining.slice(chunkLength);
+        offset += chunkLength;
+    }
+    return rows;
+}
 /**
  * Calculate which visual row (within a buffer line) the cursor is on,
  * and the column within that visual row.
+ * Uses word-aware wrapping.
  */
-function getVisualPosition(bufferColumn, lineLength, width) {
-    if (lineLength <= width) {
-        return { visualRow: 0, visualCol: bufferColumn };
+function getVisualPosition(bufferColumn, line, width) {
+    const rows = getVisualRows(line, width);
+    for (let i = 0; i < rows.length; i++) {
+        const row = rows[i];
+        const rowEnd = row.start + row.length;
+        if (bufferColumn >= row.start && bufferColumn < rowEnd) {
+            return { visualRow: i, visualCol: bufferColumn - row.start };
+        }
+        // Handle cursor at the very end of this row
+        if (bufferColumn === rowEnd && i === rows.length - 1) {
+            return { visualRow: i, visualCol: row.length };
+        }
     }
-    const visualRow = Math.floor(bufferColumn / width);
-    const visualCol = bufferColumn % width;
-    return { visualRow, visualCol };
+    // Cursor at wrap point - belongs to the next row
+    for (let i = 0; i < rows.length; i++) {
+        const row = rows[i];
+        if (bufferColumn === row.start + row.length && i < rows.length - 1) {
+            return { visualRow: i + 1, visualCol: 0 };
+        }
+    }
+    // Fallback: cursor at end of line
+    const lastRow = rows[rows.length - 1];
+    return { visualRow: rows.length - 1, visualCol: lastRow.length };
 }
 /**
  * Calculate how many visual rows a buffer line takes.
+ * Uses word-aware wrapping.
  */
-function getVisualRowCount(lineLength, width) {
-    if (lineLength === 0)
-        return 1;
-    return Math.ceil(lineLength / width);
+function getVisualRowCount(line, width) {
+    return getVisualRows(line, width).length;
 }
 /**
  * Convert visual position back to buffer column.
+ * Uses word-aware wrapping.
  */
-function visualToBufferColumn(visualRow, visualCol, lineLength, width) {
-    const bufferColumn = visualRow * width + visualCol;
-    return Math.min(bufferColumn, lineLength);
+function visualToBufferColumn(visualRow, visualCol, line, width) {
+    const rows = getVisualRows(line, width);
+    if (visualRow >= rows.length) {
+        return line.length;
+    }
+    const row = rows[visualRow];
+    return Math.min(row.start + visualCol, line.length);
 }
 /**
  * Get the length of a specific visual row within a buffer line.
+ * Uses word-aware wrapping.
  */
-function getVisualRowLength(lineLength, visualRow, width) {
-    const totalVisualRows = getVisualRowCount(lineLength, width);
-    if (visualRow >= totalVisualRows)
+function getVisualRowLength(line, visualRow, width) {
+    const rows = getVisualRows(line, width);
+    if (visualRow >= rows.length)
         return 0;
-    if (visualRow === totalVisualRows - 1) {
-        // Last visual row - might be shorter
-        const remaining = lineLength - visualRow * width;
-        return remaining;
-    }
-    return width;
+    return rows[visualRow].length;
 }
 /**
  * Move cursor in specified direction with bounds checking.
@@ -190,23 +245,23 @@ export function moveCursor(buffer, cursor, direction, width) {
             return cursor;
         case 'up':
             if (width !== undefined) {
-                // Visual-aware movement
-                const { visualRow, visualCol } = getVisualPosition(column, currentLine.length, width);
+                // Visual-aware movement (word-aware wrapping)
+                const { visualRow, visualCol } = getVisualPosition(column, currentLine, width);
                 if (visualRow > 0) {
                     // Move to previous visual row within the same buffer line
                     const targetVisualRow = visualRow - 1;
-                    const targetVisualRowLength = getVisualRowLength(currentLine.length, targetVisualRow, width);
+                    const targetVisualRowLength = getVisualRowLength(currentLine, targetVisualRow, width);
                     const targetVisualCol = Math.min(visualCol, targetVisualRowLength);
-                    return { line, column: visualToBufferColumn(targetVisualRow, targetVisualCol, currentLine.length, width) };
+                    return { line, column: visualToBufferColumn(targetVisualRow, targetVisualCol, currentLine, width) };
                 }
                 // At first visual row of current line - move to last visual row of previous buffer line
                 if (line > 0) {
                     const prevLine = buffer.lines[line - 1];
-                    const prevLineVisualRows = getVisualRowCount(prevLine.length, width);
+                    const prevLineVisualRows = getVisualRowCount(prevLine, width);
                     const targetVisualRow = prevLineVisualRows - 1;
-                    const targetVisualRowLength = getVisualRowLength(prevLine.length, targetVisualRow, width);
+                    const targetVisualRowLength = getVisualRowLength(prevLine, targetVisualRow, width);
                     const targetVisualCol = Math.min(visualCol, targetVisualRowLength);
-                    return { line: line - 1, column: visualToBufferColumn(targetVisualRow, targetVisualCol, prevLine.length, width) };
+                    return { line: line - 1, column: visualToBufferColumn(targetVisualRow, targetVisualCol, prevLine, width) };
                 }
                 return cursor;
             }
@@ -218,20 +273,20 @@ export function moveCursor(buffer, cursor, direction, width) {
             return cursor;
         case 'down':
             if (width !== undefined) {
-                // Visual-aware movement
-                const { visualRow, visualCol } = getVisualPosition(column, currentLine.length, width);
-                const currentLineVisualRows = getVisualRowCount(currentLine.length, width);
+                // Visual-aware movement (word-aware wrapping)
+                const { visualRow, visualCol } = getVisualPosition(column, currentLine, width);
+                const currentLineVisualRows = getVisualRowCount(currentLine, width);
                 if (visualRow < currentLineVisualRows - 1) {
                     // Move to next visual row within the same buffer line
                     const targetVisualRow = visualRow + 1;
-                    const targetVisualRowLength = getVisualRowLength(currentLine.length, targetVisualRow, width);
+                    const targetVisualRowLength = getVisualRowLength(currentLine, targetVisualRow, width);
                     const targetVisualCol = Math.min(visualCol, targetVisualRowLength);
-                    return { line, column: visualToBufferColumn(targetVisualRow, targetVisualCol, currentLine.length, width) };
+                    return { line, column: visualToBufferColumn(targetVisualRow, targetVisualCol, currentLine, width) };
                 }
                 // At last visual row of current line - move to first visual row of next buffer line
                 if (line < lineCount - 1) {
                     const nextLine = buffer.lines[line + 1];
-                    const targetVisualRowLength = getVisualRowLength(nextLine.length, 0, width);
+                    const targetVisualRowLength = getVisualRowLength(nextLine, 0, width);
                     const targetVisualCol = Math.min(visualCol, targetVisualRowLength);
                     return { line: line + 1, column: Math.min(targetVisualCol, nextLine.length) };
                 }

package/dist/components/MultilineInput/TextRenderer.d.ts

@@ -21,4 +21,4 @@ export declare function wrapLines(buffer: Buffer, cursor: Cursor, width: number)
 /**
  * TextRenderer component for displaying buffer content with cursor
  */
-export declare function TextRenderer({ buffer, cursor, width, showCursor, }: TextRendererProps): React.ReactElement;
+export declare function TextRenderer({ buffer, cursor, width: propWidth, showCursor, }: TextRendererProps): React.ReactElement;

package/dist/components/MultilineInput/TextRenderer.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
+import { useTerminalWidth } from '../../hooks/useTerminalWidth.js';
 /**
  * Wrap buffer lines to fit within a given width.
  * Returns visual lines and maps cursor position to visual coordinates.
@@ -8,40 +9,75 @@ export function wrapLines(buffer, cursor, width) {
     const visualLines = [];
     let cursorVisualRow = 0;
     let cursorVisualCol = 0;
+    // Ensure width is at least 1 to avoid infinite loops
+    const safeWidth = Math.max(1, width);
     let visualRowIndex = 0;
     for (let lineIndex = 0; lineIndex < buffer.lines.length; lineIndex++) {
         const line = buffer.lines[lineIndex];
         const isCursorLine = lineIndex === cursor.line;
-        if (line.length <= width) {
-            // Line fits, no wrapping needed
-            visualLines.push(line);
+        // Handle empty line case
+        if (line.length === 0) {
+            visualLines.push('');
             if (isCursorLine) {
                 cursorVisualRow = visualRowIndex;
-                cursorVisualCol = cursor.column;
+                cursorVisualCol = 0;
             }
             visualRowIndex++;
+            continue;
         }
-        else {
-            // Line needs to be wrapped
-            let offset = 0;
-            while (offset < line.length) {
-                const chunk = line.slice(offset, offset + width);
-                visualLines.push(chunk);
-                if (isCursorLine) {
-                    // Check if cursor falls within this chunk
-                    if (cursor.column >= offset && cursor.column < offset + width) {
-                        cursorVisualRow = visualRowIndex;
-                        cursorVisualCol = cursor.column - offset;
+        let remaining = line;
+        let offset = 0;
+        while (remaining.length > 0) {
+            let chunkLength = safeWidth;
+            if (remaining.length <= safeWidth) {
+                chunkLength = remaining.length;
+            }
+            else {
+                // Find split point (last space within width)
+                let splitIndex = -1;
+                for (let i = safeWidth - 1; i >= 0; i--) {
+                    if (remaining[i] === ' ') {
+                        splitIndex = i;
+                        break;
                     }
-                    else if (cursor.column === line.length && offset + chunk.length === line.length) {
-                        // Cursor at end of line
+                }
+                if (splitIndex !== -1) {
+                    // Include the space in the chunk
+                    chunkLength = splitIndex + 1;
+                }
+            }
+            const chunk = remaining.slice(0, chunkLength);
+            visualLines.push(chunk);
+            if (isCursorLine) {
+                // Check if cursor falls within this chunk
+                // Cursor is at `cursor.column` (relative to line start)
+                // Current chunk covers `offset` to `offset + chunkLength`
+                if (cursor.column >= offset && cursor.column < offset + chunkLength) {
+                    cursorVisualRow = visualRowIndex;
+                    cursorVisualCol = cursor.column - offset;
+                }
+                else if (cursor.column === offset + chunkLength) {
+                    // Cursor is at the end of this chunk
+                    if (offset + chunkLength === line.length) {
+                        // End of line
                         cursorVisualRow = visualRowIndex;
-                        cursorVisualCol = chunk.length;
+                        cursorVisualCol = chunkLength;
+                    }
+                    else {
+                        // Wrap point - cursor should be at start of next line
+                        // We'll let the next iteration handle it (it will be index 0 of next chunk)
+                        // But wait, if we are at the wrap point, the next iteration will see:
+                        // offset = oldOffset + chunkLength.
+                        // cursor.column == offset.
+                        // So it enters the first `if` block: cursor.column >= offset.
+                        // cursorVisualCol = cursor.column - offset = 0.
+                        // This is correct.
                     }
                 }
-                offset += width;
-                visualRowIndex++;
             }
+            remaining = remaining.slice(chunkLength);
+            offset += chunkLength;
+            visualRowIndex++;
         }
     }
     return { visualLines, cursorVisualRow, cursorVisualCol };
@@ -69,7 +105,8 @@ function renderLineWithCursor(line, cursorCol, showCursor) {
 /**
  * TextRenderer component for displaying buffer content with cursor
  */
-export function TextRenderer({ buffer, cursor, width = 80, showCursor = true, }) {
+export function TextRenderer({ buffer, cursor, width: propWidth, showCursor = true, }) {
+    const width = useTerminalWidth(propWidth);
     const { visualLines, cursorVisualRow, cursorVisualCol } = wrapLines(buffer, cursor, width);
     return (_jsx(Box, { flexDirection: "column", children: visualLines.map((line, index) => {
             const isCursorRow = index === cursorVisualRow;

package/dist/components/MultilineInput/__tests__/TextBuffer.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { createBuffer, insertText, deleteChar, deleteCharForward, insertNewLine, moveCursor, getTextContent, } from '../TextBuffer.js';
+import { createBuffer, insertText, deleteChar, deleteCharForward, insertNewLine, moveCursor, getTextContent, getVisualRows, } from '../TextBuffer.js';
 describe('TextBuffer', () => {
     describe('createBuffer', () => {
         it('creates empty buffer with single empty line', () => {
@@ -447,4 +447,127 @@ describe('TextBuffer', () => {
             expect(getTextContent(buffer)).toBe('hello\n\nworld');
         });
     });
+    describe('getVisualRows (word-aware wrapping)', () => {
+        it('returns single row for short line', () => {
+            const rows = getVisualRows('hello', 10);
+            expect(rows).toEqual([{ start: 0, length: 5 }]);
+        });
+        it('returns single row for empty line', () => {
+            const rows = getVisualRows('', 10);
+            expect(rows).toEqual([{ start: 0, length: 0 }]);
+        });
+        it('wraps at space boundary', () => {
+            const rows = getVisualRows('hello world', 7);
+            // "hello " (6) fits, "world" (5) on next row
+            expect(rows).toEqual([
+                { start: 0, length: 6 }, // "hello "
+                { start: 6, length: 5 }, // "world"
+            ]);
+        });
+        it('hard-wraps long words that exceed width', () => {
+            const rows = getVisualRows('supercalifragilistic', 5);
+            expect(rows).toEqual([
+                { start: 0, length: 5 }, // "super"
+                { start: 5, length: 5 }, // "calif"
+                { start: 10, length: 5 }, // "ragil"
+                { start: 15, length: 5 }, // "istic"
+            ]);
+        });
+        it('wraps mixed content correctly', () => {
+            const rows = getVisualRows('a very longwordthatwraps', 10);
+            expect(rows).toEqual([
+                { start: 0, length: 7 }, // "a very "
+                { start: 7, length: 10 }, // "longwordth"
+                { start: 17, length: 7 }, // "atwraps"
+            ]);
+        });
+        it('handles multiple spaces', () => {
+            const rows = getVisualRows('hello   world', 8);
+            // "hello   " (8) fits exactly
+            expect(rows).toEqual([
+                { start: 0, length: 8 }, // "hello   "
+                { start: 8, length: 5 }, // "world"
+            ]);
+        });
+        it('handles leading space', () => {
+            const rows = getVisualRows(' hello world', 7);
+            // " hello " (7) fits exactly
+            expect(rows).toEqual([
+                { start: 0, length: 7 }, // " hello "
+                { start: 7, length: 5 }, // "world"
+            ]);
+        });
+    });
+    describe('moveCursor with word-aware wrapping', () => {
+        describe('up/down in word-wrapped lines', () => {
+            it('moves up within word-wrapped line respecting word boundaries', () => {
+                // "hello world" with width 7 wraps as ["hello ", "world"]
+                const buffer = createBuffer('hello world');
+                const cursor = { line: 0, column: 8 }; // at 'r' in 'world'
+                const result = moveCursor(buffer, cursor, 'up', 7);
+                // Visual row 1, col 2 -> visual row 0
+                // Visual row 0 is "hello " (6 chars), col 2 is 'l'
+                expect(result).toEqual({ line: 0, column: 2 });
+            });
+            it('moves down within word-wrapped line respecting word boundaries', () => {
+                // "hello world" with width 7 wraps as ["hello ", "world"]
+                const buffer = createBuffer('hello world');
+                const cursor = { line: 0, column: 2 }; // at first 'l' in 'hello'
+                const result = moveCursor(buffer, cursor, 'down', 7);
+                // Visual row 0, col 2 -> visual row 1, col 2
+                // Visual row 1 starts at offset 6, so target = 6 + 2 = 8
+                expect(result).toEqual({ line: 0, column: 8 });
+            });
+            it('clamps column when moving to shorter word-wrapped row', () => {
+                // "hello world" width 7: ["hello ", "world"] (row 0: 6 chars, row 1: 5 chars)
+                const buffer = createBuffer('hello world');
+                const cursor = { line: 0, column: 5 }; // at the space after 'hello'
+                const result = moveCursor(buffer, cursor, 'down', 7);
+                // Visual row 0, col 5 -> visual row 1, but row 1 only has 5 chars
+                // So col should clamp to 5 (end of "world")
+                // Target = 6 + 5 = 11 = line length
+                expect(result).toEqual({ line: 0, column: 11 });
+            });
+            it('moves between buffer lines with word-wrapping', () => {
+                // Line 0: "hello world" wraps as ["hello ", "world"]
+                // Line 1: "test"
+                const buffer = createBuffer('hello world\ntest');
+                const cursor = { line: 0, column: 8 }; // 'r' in 'world'
+                const result = moveCursor(buffer, cursor, 'down', 7);
+                // From visual row 1 (bottom of line 0) to line 1, visual row 0
+                // "test" row 0 is 4 chars, col 2 requested, result = col 2
+                expect(result).toEqual({ line: 1, column: 2 });
+            });
+            it('handles cursor at word wrap boundary going up', () => {
+                // "hello world" width 7: ["hello ", "world"]
+                // Cursor at position 6 (start of "world")
+                const buffer = createBuffer('hello world');
+                const cursor = { line: 0, column: 6 };
+                const result = moveCursor(buffer, cursor, 'up', 7);
+                // Should go from visual row 1, col 0 to visual row 0, col 0
+                expect(result).toEqual({ line: 0, column: 0 });
+            });
+        });
+        describe('cursor position calculation at word boundaries', () => {
+            it('cursor in middle of first word-wrapped row', () => {
+                // "a very longword" width 10: ["a very ", "longword"]
+                const buffer = createBuffer('a very longword');
+                const cursor = { line: 0, column: 3 }; // at 'e' in 'very'
+                const result = moveCursor(buffer, cursor, 'down', 10);
+                // From row 0, col 3 to row 1, col 3 -> offset 7 + 3 = 10
+                expect(result).toEqual({ line: 0, column: 10 });
+            });
+            it('preserves column when navigating up then down', () => {
+                // "hello world test" width 7: ["hello ", "world ", "test"]
+                const buffer = createBuffer('hello world test');
+                const cursor = { line: 0, column: 9 }; // 'r' in 'world'
+                // Move up
+                const afterUp = moveCursor(buffer, cursor, 'up', 7);
+                expect(afterUp).toEqual({ line: 0, column: 3 });
+                // Move back down
+                const afterDown = moveCursor(buffer, afterUp, 'down', 7);
+                expect(afterDown).toEqual({ line: 0, column: 9 });
+            });
+        });
+    });
 });

package/dist/components/MultilineInput/__tests__/TextRenderer_enhanced.test.d.ts

@@ -0,0 +1 @@
+export {};