ink-prompt 0.3.0 → 0.3.2

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

@@ -1,6 +1,6 @@
 import { type Key, type Buffer, type Cursor } from './types.js';
 import { type UseTextInputResult } from './useTextInput.js';
-export interface KeyHandlerActions extends Omit<UseTextInputResult, 'value' | 'cursor' | 'cursorOffset' | 'setCursorOffset' | 'buffer' | 'blockState' | 'insertImage' | 'images' | 'getImages' | 'setImages'> {
+export interface KeyHandlerActions extends Omit<UseTextInputResult, 'value' | 'cursor' | 'cursorOffset' | 'setCursorOffset' | 'buffer' | 'blockState' | 'insertImage' | 'images' | 'getImages' | 'setImages' | 'syncExternalState'> {
     submit: () => void;
     onBoundaryArrow?: (direction: 'up' | 'down' | 'left' | 'right') => void;
     paste?: () => void;

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { describe, it, expect, vi } from 'vitest';
-import { render } from '@testing-library/react';
+import { render, waitFor } from '@testing-library/react';
 import { MultilineInputCore } from '../index.js';
 /**
  * Integration tests for MultilineInputCore.
@@ -66,6 +66,15 @@ describe('MultilineInputCore', () => {
         });
     });
     describe('Controlled component behavior', () => {
+        it('applies simultaneous value and cursorOverride updates against the new value', async () => {
+            const onCursorChange = vi.fn();
+            const { rerender } = render(_jsx(MultilineInputCore, { value: "x", cursorOverride: 1, onCursorChange: onCursorChange }));
+            onCursorChange.mockClear();
+            rerender(_jsx(MultilineInputCore, { value: "abcde", cursorOverride: 4, onCursorChange: onCursorChange }));
+            await waitFor(() => {
+                expect(onCursorChange).toHaveBeenLastCalledWith(4);
+            });
+        });
         it('does NOT call onChange when value prop is updated by parent', () => {
             // This tests the controlled component pattern:
             // onChange should only fire for user-initiated changes, not prop updates

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

@@ -32,6 +32,7 @@ export interface MultilineInputProps {
     maxImageCount?: number;
     acceptedMimeTypes?: string[];
     maxHeight?: number;
+    ignoreInput?: (input: string, key: any) => boolean;
 }
 export interface MultilineInputCoreProps {
     value?: string;

package/dist/components/MultilineInput/index.js

@@ -9,13 +9,13 @@ import { TextRenderer } from './TextRenderer.js';
 import { useClipboardPaste } from './useClipboardPaste.js';
 import { log } from '../../utils/logger.js';
 export const MultilineInputCore = ({ value, onChange, placeholder, showCursor = true, width = 80, onCursorChange, cursorOverride, undoDebounceMs, pasteThreshold, formatPastePlaceholder, images, onImagesChange, maxHeight, }) => {
-    const textInput = useTextInput({ initialValue: value ?? '', undoDebounceMs, pasteThreshold, formatPastePlaceholder });
+    const textInput = useTextInput({
+        initialValue: value ?? '',
+        undoDebounceMs,
+        pasteThreshold,
+        formatPastePlaceholder,
+    });
     const isSyncingFromProps = useRef(false);
-    useEffect(() => {
-        if (cursorOverride !== undefined) {
-            textInput.setCursorOffset(cursorOverride);
-        }
-    }, [cursorOverride]);
     const onCursorChangeRef = useRef(onCursorChange);
     useEffect(() => {
         onCursorChangeRef.current = onCursorChange;
@@ -28,9 +28,9 @@ export const MultilineInputCore = ({ value, onChange, placeholder, showCursor =
     useEffect(() => {
         if (value !== undefined && value !== textInput.value) {
             isSyncingFromProps.current = true;
-            textInput.setText(value);
         }
-    }, [value]);
+        textInput.syncExternalState({ value, cursorOffset: cursorOverride });
+    }, [value, cursorOverride]);
     const onChangeRef = useRef(onChange);
     useEffect(() => {
         onChangeRef.current = onChange;
@@ -64,14 +64,20 @@ export const MultilineInputCore = ({ value, onChange, placeholder, showCursor =
     const effectiveMaxHeight = maxHeight ?? defaultMaxHeight;
     return (_jsx(TextRenderer, { buffer: textInput.buffer, cursor: textInput.cursor, width: width, showCursor: showCursor, blockState: textInput.blockState, maxHeight: effectiveMaxHeight }));
 };
-export const MultilineInput = ({ value, onChange, onSubmit, placeholder, showCursor = true, width, isActive = true, onCursorChange, cursorOverride, onBoundaryArrow, undoDebounceMs, pasteThreshold, formatPastePlaceholder, images, onImagesChange, onPasteError, enableImagePaste = false, maxImageSizeBytes, maxImageCount, acceptedMimeTypes, maxHeight, }) => {
+export const MultilineInput = ({ value, onChange, onSubmit, placeholder, showCursor = true, width, isActive = true, onCursorChange, cursorOverride, onBoundaryArrow, undoDebounceMs, pasteThreshold, formatPastePlaceholder, images, onImagesChange, onPasteError, enableImagePaste = false, maxImageSizeBytes, maxImageCount, acceptedMimeTypes, maxHeight, ignoreInput, }) => {
     const terminalWidth = useTerminalWidth(width);
     const { stdin } = useStdin();
     const lastRawInput = useRef('');
     const pasteActive = useRef(false);
     const pasteBuffer = useRef('');
     const suppressNextInput = useRef(false);
-    const textInput = useTextInput({ initialValue: value ?? '', width: terminalWidth, undoDebounceMs, pasteThreshold, formatPastePlaceholder });
+    const textInput = useTextInput({
+        initialValue: value ?? '',
+        width: terminalWidth,
+        undoDebounceMs,
+        pasteThreshold,
+        formatPastePlaceholder,
+    });
     const textInputRef = useRef(textInput);
     useEffect(() => {
         textInputRef.current = textInput;
@@ -134,11 +140,6 @@ export const MultilineInput = ({ value, onChange, onSubmit, placeholder, showCur
         existingImages: textInput.images,
         onPasteError,
     });
-    useEffect(() => {
-        if (cursorOverride !== undefined) {
-            textInput.setCursorOffset(cursorOverride);
-        }
-    }, [cursorOverride]);
     const onCursorChangeRef = useRef(onCursorChange);
     useEffect(() => {
         onCursorChangeRef.current = onCursorChange;
@@ -150,9 +151,9 @@ export const MultilineInput = ({ value, onChange, onSubmit, placeholder, showCur
     useEffect(() => {
         if (value !== undefined && value !== textInput.value) {
             isSyncingFromProps.current = true;
-            textInput.setText(value);
         }
-    }, [value]);
+        textInput.syncExternalState({ value, cursorOffset: cursorOverride });
+    }, [value, cursorOverride]);
     const onChangeRef = useRef(onChange);
     useEffect(() => {
         onChangeRef.current = onChange;
@@ -209,22 +210,26 @@ export const MultilineInput = ({ value, onChange, onSubmit, placeholder, showCur
         paste: handlePaste,
     };
     useInput((input, key) => {
+        if (ignoreInput?.(input, key)) {
+            return;
+        }
         if (suppressNextInput.current) {
             // This stdin chunk is part of a bracketed paste — already handled by the
             // raw 'data' listener. Don't dispatch as keystrokes.
             suppressNextInput.current = false;
             return;
         }
-        log(`[USEINPUT] input="${input.replace(/[\x00-\x1F\x7F-]/g, c => `\\x${c.charCodeAt(0).toString(16)}`)}" key=${JSON.stringify(key)} rawLen=${lastRawInput.current?.length || 0}`);
+        log(`[USEINPUT] input='${input.replace(/[\x00-\x1F\x7F-]/g, (c) => `\\x${c.charCodeAt(0).toString(16)}`)}' key=${JSON.stringify(key)} rawLen=${lastRawInput.current?.length || 0}`);
         // Detect if this is an Alt keypress for symbol keys (like Alt+\ or Alt+/)
         // Standard Alt keypresses send ESC (\x1b) followed by the character.
         // We check if it is a 2-character sequence starting with ESC, excluding CSI/SS3 prefixes ('[' or 'O')
         const raw = lastRawInput.current;
-        const isMeta = key.meta || (raw &&
-            raw.length === 2 &&
-            raw.startsWith('\x1b') &&
-            raw[1] !== '[' &&
-            raw[1] !== 'O');
+        const isMeta = key.meta ||
+            (raw &&
+                raw.length === 2 &&
+                raw.startsWith('\x1b') &&
+                raw[1] !== '[' &&
+                raw[1] !== 'O');
         const updatedKey = isMeta ? { ...key, meta: true } : key;
         handleKey(updatedKey, input, textInput.buffer, actions, textInput.cursor, lastRawInput.current, terminalWidth);
     }, { isActive });

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

@@ -22,6 +22,10 @@ export interface UseTextInputResult {
     undo: () => void;
     redo: () => void;
     setText: (text: string) => void;
+    syncExternalState: (state: {
+        value?: string;
+        cursorOffset?: number;
+    }) => void;
     cursorOffset: number;
     setCursorOffset: (offset: number) => void;
     blockState: BlockState;

package/dist/components/MultilineInput/useTextInput.js

@@ -4,6 +4,13 @@ import { createBlockState, createPasteBlockEntry, createImageBlockEntry, removeB
 import { findAtomicBlockBefore, findAtomicBlockAfter } from './AtomicBlocks.js';
 import { log } from '../../utils/logger.js';
 const defaultFormatPlaceholder = (displayNumber) => `[Paste text #${displayNumber}]`;
+function getEndCursor(text) {
+    const lines = text.split('\n');
+    return {
+        line: lines.length - 1,
+        column: lines[lines.length - 1].length,
+    };
+}
 export function useTextInput({ initialValue = '', width, historyLimit = 100, undoDebounceMs = 200, pasteThreshold, formatPastePlaceholder = defaultFormatPlaceholder, } = {}) {
     const [buffer, setBuffer] = useState(() => createBuffer(initialValue));
     const [cursor, setCursor] = useState(() => {
@@ -188,8 +195,7 @@ export function useTextInput({ initialValue = '', width, historyLimit = 100, und
         applyEdit(() => {
             setBlockState(createBlockState());
             const newBuffer = createBuffer(text);
-            const lines = text.split('\n');
-            const newCursor = { line: lines.length - 1, column: lines[lines.length - 1].length };
+            const newCursor = getEndCursor(text);
             return { buffer: newBuffer, cursor: newCursor };
         });
     }, [applyEdit]);
@@ -202,6 +208,25 @@ export function useTextInput({ initialValue = '', width, historyLimit = 100, und
     }, [applyEdit, buffer, cursor, blockState]);
     const value = useMemo(() => getValue(buffer.lines, blockState.entries), [buffer.lines, blockState.entries]);
     const cursorOffset = useMemo(() => getValueCursorOffset(buffer.lines, cursor, blockState.entries), [buffer.lines, cursor, blockState.entries]);
+    const syncExternalState = useCallback(({ value: externalValue, cursorOffset: externalCursorOffset }) => {
+        const shouldSyncValue = externalValue !== undefined && externalValue !== value;
+        const shouldSyncCursor = externalCursorOffset !== undefined && externalCursorOffset !== cursorOffset;
+        if (!shouldSyncValue && !shouldSyncCursor)
+            return;
+        flushPendingInsertBatch();
+        const nextBlockState = shouldSyncValue ? createBlockState() : blockState;
+        const nextBuffer = shouldSyncValue ? createBuffer(externalValue) : buffer;
+        const nextCursor = externalCursorOffset !== undefined
+            ? getCursorFromValueOffset(nextBuffer.lines, externalCursorOffset, nextBlockState.entries)
+            : shouldSyncValue
+                ? getEndCursor(externalValue)
+                : cursor;
+        if (shouldSyncValue) {
+            setBlockState(nextBlockState);
+            setBuffer(nextBuffer);
+        }
+        setCursor(nextCursor);
+    }, [blockState, buffer, cursor, cursorOffset, flushPendingInsertBatch, value]);
     const imagesList = useMemo(() => {
         const result = [];
         for (const entry of blockState.entries.values()) {
@@ -256,6 +281,7 @@ export function useTextInput({ initialValue = '', width, historyLimit = 100, und
         undo,
         redo,
         setText,
+        syncExternalState,
         cursorOffset,
         setCursorOffset: useCallback((offset) => {
             flushPendingInsertBatch();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ink-prompt",
-  "version": "0.3.0",
+  "version": "0.3.2",
   "description": "A React Ink component for prompts",
   "type": "module",
   "main": "./dist/index.js",
@@ -21,7 +21,7 @@
     "dev": "tsc --watch",
     "type-check": "tsc --noEmit",
     "clean": "rm -rf dist",
-    "test": "vitest run",
+    "test": "vitest run --reporter=minimal",
     "test:ui": "vitest --ui",
     "test:watch": "vitest",
     "release": "bash scripts/release.sh"
@@ -44,14 +44,14 @@
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",
-    "@types/node": "^20.0.0",
+    "@types/node": "^20.19.41",
     "@types/react": "^19.0.0",
-    "@vitest/ui": "^4.0.15",
+    "@vitest/ui": "^4.1.9",
     "happy-dom": "^20.0.11",
     "ink": "^7.0.0",
     "react": "^19.2.1",
     "react-dom": "^19.2.1",
     "typescript": "^5.0.0",
-    "vitest": "^4.0.15"
+    "vitest": "^4.1.9"
   }
 }