@qduc/term2 0.7.2 → 0.8.0

package/dist/components/InputBox.test.js

@@ -1,46 +1,60 @@
-import test from 'ava';
-import React, { useEffect, useRef } from 'react';
-import { render } from 'ink-testing-library';
+// @ts-ignore
+globalThis.IS_REACT_ACT_ENVIRONMENT = true;
+import { it, expect, vi } from 'vitest';
+import React, { useEffect, useRef, act } from 'react';
 import { Box, Text } from 'ink';
-import InputBox, { calculateInputWidth } from './InputBox.js';
-import ModelSelectionMenu from './ModelSelectionMenu.js';
-import SettingsSelectionMenu from './SettingsSelectionMenu.js';
-import { computeModelInsertion } from './Input/insertions.js';
-import { SETTINGS_TRIGGER } from './Input/triggers.js';
+import InputBox, { getProviderWizardPromptLabel } from './InputBox.js';
+import ModelSelectionMenu from './menu/ModelSelectionMenu.js';
+import SettingsSelectionMenu from './menu/SettingsSelectionMenu.js';
+import { computeModelInsertion } from './input/insertions.js';
+import { SETTINGS_TRIGGER } from './input/triggers.js';
 import { InputProvider, useInputContext } from '../context/InputContext.js';
-import { createMockSettingsService } from '../services/settings-service.mock.js';
+import { createMockSettingsService } from '../services/settings/settings-service.mock.js';
 import { registerProvider, unregisterProvider } from '../providers/index.js';
 import { clearModelCache } from '../services/model-service.js';
 import { useModelSelection } from '../hooks/use-model-selection.js';
 import { useSettingsCompletion } from '../hooks/use-settings-completion.js';
+import { renderInAct, toVisibleText } from '../test-helpers/ink-testing.js';
+vi.mock('../services/file-service.js', () => ({
+    getWorkspaceEntries: vi.fn(async () => [{ path: 'mock/path', type: 'file' }]),
+    refreshWorkspaceEntries: vi.fn(async () => [{ path: 'mock/path', type: 'file' }]),
+    getWorkspaceEntriesMeta: vi.fn(() => ({
+        lastLoadedAt: null,
+        totalEntries: 1,
+        truncated: false,
+        truncatedByTotalLimit: false,
+        limit: 10_000,
+    })),
+}));
 // Mock slash commands
 const mockSlashCommands = [
     { name: '/clear', description: 'Clear screen', action: () => { } },
     { name: '/quit', description: 'Quit app', action: () => { } },
 ];
-// Default props for InputBox (only the actual props it accepts)
+const createMockLoggingService = () => ({
+    info: () => { },
+    warn: () => { },
+    error: () => { },
+    debug: () => { },
+    security: () => { },
+    setCorrelationId: () => { },
+    getCorrelationId: () => undefined,
+    clearCorrelationId: () => { },
+});
+const createMockHistoryService = () => ({
+    getMessages: () => [],
+    getTurns: () => [],
+    addMessage: () => { },
+    clear: () => { },
+});
+// Default props for InputBox
 const defaultProps = {
     onSubmit: () => { },
     slashCommands: mockSlashCommands,
     isShellMode: false,
     settingsService: createMockSettingsService(),
-    loggingService: {
-        info: () => { },
-        warn: () => { },
-        error: () => { },
-        debug: () => { },
-        security: () => { },
-        setCorrelationId: () => { },
-        clearCorrelationId: () => { },
-    },
-    historyService: {
-        getMessages: () => [],
-        getTurns: () => [],
-        addMessage: () => { },
-        clear: () => { },
-    },
-    onHistoryUp: () => { },
-    onHistoryDown: () => { },
+    loggingService: createMockLoggingService(),
+    historyService: createMockHistoryService(),
 };
 // Helper to wrap InputBox with InputProvider
 const TestInputBox = (props) => (React.createElement(InputProvider, null,
@@ -59,69 +73,111 @@ const getCursorFromFrame = (frame) => {
     const match = frame?.match(/Cursor:(\d+)/);
     return match ? Number(match[1]) : null;
 };
-const flushReactUpdates = async (iterations = 1) => {
-    for (let i = 0; i < iterations; i++) {
-        await new Promise((resolve) => setImmediate(resolve));
+/**
+ * Poll `lastFrame()` until `predicate` returns true, or the timeout elapses.
+ * Replaces arbitrary `act` / `setImmediate` iteration loops with a deterministic wait.
+ */
+const waitFor = async (lastFrame, predicate, { timeoutMs = 2000, intervalMs = 10 } = {}) => {
+    const deadline = Date.now() + timeoutMs;
+    let frame = lastFrame() ?? '';
+    while (!predicate(frame)) {
+        if (Date.now() > deadline) {
+            throw new Error(`waitFor timed out after ${timeoutMs}ms. Last frame:\n${frame}`);
+        }
+        await act(async () => {
+            await new Promise((resolve) => setTimeout(resolve, intervalMs));
+        });
+        frame = lastFrame() ?? '';
+    }
+    return frame;
+};
+/**
+ * Poll an arbitrary getter until `predicate` returns true, or the timeout elapses.
+ * Use for non-frame conditions (e.g., settings values, callback invocation flags).
+ */
+const waitForCondition = async (getter, predicate, { timeoutMs = 3000, intervalMs = 10 } = {}) => {
+    const deadline = Date.now() + timeoutMs;
+    let value = getter();
+    while (!predicate(value)) {
+        if (Date.now() > deadline) {
+            throw new Error(`waitForCondition timed out after ${timeoutMs}ms. Last value: ${JSON.stringify(value)}`);
+        }
+        await act(async () => {
+            await new Promise((resolve) => setTimeout(resolve, intervalMs));
+        });
+        value = getter();
     }
+    return value;
+};
+const flushReactUpdates = async (iterations = 5) => {
+    await act(async () => {
+        for (let i = 0; i < iterations; i++) {
+            await new Promise((resolve) => setImmediate(resolve));
+        }
+    });
+};
+const renderAndFlush = async (element, context) => {
+    const result = await renderInAct(element, context);
+    await flushReactUpdates(10);
+    return result;
 };
+/** Write input to stdin and flush pending updates for Ink to process it. */
 const writeInput = async (stdin, input) => {
-    stdin.write(input);
-    await flushReactUpdates(2);
+    await act(async () => {
+        stdin.write(input);
+        for (let i = 0; i < 10; i++) {
+            await new Promise((resolve) => setImmediate(resolve));
+        }
+    });
 };
-test('InputBox renders without crashing', (t) => {
-    const { lastFrame } = render(React.createElement(TestInputBox, { ...defaultProps }));
-    t.truthy(lastFrame());
-});
-test('InputBox shows the input prompt', (t) => {
-    const { lastFrame } = render(React.createElement(TestInputBox, { ...defaultProps }));
+it.sequential('InputBox shows the input prompt', async () => {
+    const { lastFrame } = await renderAndFlush(React.createElement(TestInputBox, { ...defaultProps }));
     const output = lastFrame();
-    t.truthy(output);
     // Should show the prompt character
-    t.true(output.includes('❯'));
+    expect(output.includes('❯')).toBe(true);
 });
-test('InputBox shows the shell prompt when in shell mode', (t) => {
-    const { lastFrame } = render(React.createElement(TestInputBox, { ...defaultProps, isShellMode: true }));
+it.sequential('InputBox shows the shell prompt when in shell mode', async () => {
+    const { lastFrame } = await renderAndFlush(React.createElement(TestInputBox, { ...defaultProps, isShellMode: true }));
     const output = lastFrame();
-    t.truthy(output);
-    t.true(output.includes('$'));
+    expect(output).toBeTruthy();
+    expect(output.includes('$')).toBe(true);
+});
+it.sequential('getProviderWizardPromptLabel maps provider wizard phases to prompt labels', () => {
+    expect(getProviderWizardPromptLabel('wizard_name')).toBe('Enter Provider Name: ');
+    expect(getProviderWizardPromptLabel('wizard_url')).toBe('Enter Base API URL: ');
+    expect(getProviderWizardPromptLabel('wizard_key')).toBe('Enter API Key: ');
+    expect(getProviderWizardPromptLabel('list')).toBe(undefined);
 });
-test('InputBox can be submitted', (t) => {
+it.sequential('InputBox renders the provided prompt label', async () => {
+    const { lastFrame } = await renderAndFlush(React.createElement(TestInputBox, { ...defaultProps, promptLabel: "Enter Provider Name: " }));
+    const output = lastFrame();
+    expect(output).toBeTruthy();
+    expect(output.includes('Enter Provider Name:')).toBe(true);
+});
+it.sequential('InputBox onSubmit is not called on empty input when allowEmptySubmit is false', async () => {
     let submitted = false;
     const onSubmit = () => {
         submitted = true;
     };
-    render(React.createElement(TestInputBox, { ...defaultProps, onSubmit: onSubmit }));
-    // Note: We can't easily test actual submission in this unit test
-    // because it requires user input simulation which is complex with MultilineInput
-    // This test just verifies the component renders with the onSubmit prop
-    t.false(submitted);
-    t.pass();
-});
-test('InputBox accepts slash commands prop', (t) => {
-    const customCommands = [{ name: '/test', description: 'Test command', action: () => { } }];
-    const { lastFrame } = render(React.createElement(TestInputBox, { ...defaultProps, slashCommands: customCommands }));
-    t.truthy(lastFrame());
-    t.pass();
+    const { stdin } = await renderAndFlush(React.createElement(TestInputBox, { ...defaultProps, onSubmit: onSubmit, allowEmptySubmit: false }));
+    await writeInput(stdin, '\r');
+    expect(submitted).toBe(false);
 });
-test('InputBox accepts history callbacks', (t) => {
-    let historyUpCalled = false;
-    let historyDownCalled = false;
-    const onHistoryUp = () => {
-        historyUpCalled = true;
-    };
-    const onHistoryDown = () => {
-        historyDownCalled = true;
+it.sequential('InputBox onSubmit is called on empty input when allowEmptySubmit is true', async () => {
+    let submitted = false;
+    let submittedTurn = null;
+    const onSubmit = (turn) => {
+        submitted = true;
+        submittedTurn = turn;
     };
-    render(React.createElement(TestInputBox, { ...defaultProps, onHistoryUp: onHistoryUp, onHistoryDown: onHistoryDown }));
-    // Note: We can't easily trigger history navigation in this unit test
-    // This test just verifies the component accepts the callbacks
-    t.false(historyUpCalled);
-    t.false(historyDownCalled);
-    t.pass();
+    const { stdin } = await renderAndFlush(React.createElement(TestInputBox, { ...defaultProps, onSubmit: onSubmit, allowEmptySubmit: true }));
+    await writeInput(stdin, '\r');
+    expect(submitted).toBe(true);
+    expect(submittedTurn).toEqual({ text: '' });
 });
-test('InputBox keeps cursor fixed when left arrow switches model provider', async (t) => {
+it.sequential('InputBox keeps cursor fixed when left arrow switches model provider', async () => {
     const initialValue = '/model gpt-5';
-    const { lastFrame, stdin } = render(React.createElement(TestInputBoxWithCursorState, { ...defaultProps, slashCommands: [
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(TestInputBoxWithCursorState, { ...defaultProps, slashCommands: [
             ...mockSlashCommands,
             {
                 name: '/model',
@@ -131,20 +187,116 @@ test('InputBox keeps cursor fixed when left arrow switches model provider', asyn
             },
         ] }));
     await writeInput(stdin, initialValue);
-    await flushReactUpdates(20);
     const beforeCursor = getCursorFromFrame(lastFrame());
     await writeInput(stdin, '\u001B[D');
-    await flushReactUpdates(5);
-    t.is(getCursorFromFrame(lastFrame()), beforeCursor, lastFrame());
+    expect(getCursorFromFrame(lastFrame()), lastFrame()).toBe(beforeCursor);
 });
-test('calculateInputWidth uses default prompt width for normal mode', (t) => {
-    t.is(calculateInputWidth({ terminalColumns: 80, waitingForRejectionReason: false, isShellMode: false }), 74);
+const PathCompletionHarness = () => {
+    const { setInput, setMode, setCursorOffset, setTriggerIndex, mode } = useInputContext();
+    const didSetupRef = useRef(false);
+    useEffect(() => {
+        if (didSetupRef.current)
+            return;
+        didSetupRef.current = true;
+        setInput('before @after');
+        setCursorOffset(8);
+        setTriggerIndex(7);
+        setMode('path_completion');
+    }, [setInput, setCursorOffset, setTriggerIndex, setMode]);
+    // Keep the harness rendered until insertion completes so it does not re-run setup.
+    return React.createElement(Text, null, mode);
+};
+it.sequential('path completion keeps cursor at end of inserted path in middle of input', async () => {
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(CursorState, null),
+        React.createElement(InputBox, { ...defaultProps }),
+        React.createElement(PathCompletionHarness, null)));
+    // Wait for path completion popup and the mocked entry to load.
+    await waitFor(lastFrame, (f) => f.includes('mock/path'), { timeoutMs: 3000 });
+    await flushReactUpdates(10);
+    // Press Enter to insert the selected path with a trailing space.
+    await writeInput(stdin, '\r');
+    // Wait for the popup to close and cursor to stabilize.
+    await waitFor(lastFrame, (f) => !f.includes('mock/path'), { timeoutMs: 3000 });
+    await flushReactUpdates(10);
+    // "before /mock/path after" -> cursor should be at 17 (after inserted path + trailing space),
+    // not at the end of the input (22).
+    const cursor = getCursorFromFrame(lastFrame());
+    expect(cursor).toBe(17);
 });
-test('calculateInputWidth uses default prompt width for shell mode', (t) => {
-    t.is(calculateInputWidth({ terminalColumns: 80, waitingForRejectionReason: false, isShellMode: true }), 74);
+const SettingsCompletionHarness = () => {
+    const { setInput, setMode, setCursorOffset, setTriggerIndex, mode } = useInputContext();
+    const didSetupRef = useRef(false);
+    useEffect(() => {
+        if (didSetupRef.current)
+            return;
+        didSetupRef.current = true;
+        const initial = '/settings logging.logLevel';
+        setInput(initial);
+        setCursorOffset(initial.length);
+        setTriggerIndex(SETTINGS_TRIGGER.length);
+        setMode('settings_completion');
+    }, [setInput, setMode, setCursorOffset, setTriggerIndex]);
+    return React.createElement(Text, null, mode);
+};
+it.sequential('settings completion keeps cursor at end of inserted key + trailing space', async () => {
+    const settingsSlashCommand = {
+        name: '/settings',
+        description: 'Settings',
+        expectsArgs: true,
+        action: () => { },
+        completion: { type: 'settings', trigger: SETTINGS_TRIGGER, resetTrigger: '/settings reset ' },
+    };
+    const slashCommands = [...mockSlashCommands, settingsSlashCommand];
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(CursorState, null),
+        React.createElement(InputBox, { ...defaultProps, slashCommands: slashCommands }),
+        React.createElement(SettingsCompletionHarness, null)));
+    // Wait for the settings completion popup to show logging.logLevel.
+    await waitFor(lastFrame, (f) => f.includes('logging.logLevel'), { timeoutMs: 3000 });
+    await flushReactUpdates(10);
+    // Press Enter to insert the selected setting key.
+    await writeInput(stdin, '\r');
+    // Wait for the cursor to move to the end of the inserted key + trailing space.
+    const expectedValue = '/settings logging.logLevel ';
+    const cursor = await waitForCondition(() => getCursorFromFrame(lastFrame()), (c) => c === expectedValue.length, { timeoutMs: 3000 });
+    expect(cursor).toBe(expectedValue.length);
 });
-test('calculateInputWidth uses rejection prompt width for rejection mode', (t) => {
-    t.is(calculateInputWidth({ terminalColumns: 80, waitingForRejectionReason: true, isShellMode: false }), 71);
+const SettingsValueTriggerHarness = () => {
+    const { setInput, setCursorOffset } = useInputContext();
+    const didSetupRef = useRef(false);
+    useEffect(() => {
+        if (didSetupRef.current)
+            return;
+        didSetupRef.current = true;
+        const initial = '/settings agent.reasoningEffort ';
+        setInput(initial);
+        setCursorOffset(initial.length);
+    }, [setInput, setCursorOffset]);
+    return null;
+};
+it.sequential('settings value completion keeps cursor at end of inserted value', async () => {
+    const settingsSlashCommand = {
+        name: '/settings',
+        description: 'Settings',
+        expectsArgs: true,
+        action: () => { },
+        completion: { type: 'settings', trigger: SETTINGS_TRIGGER, resetTrigger: '/settings reset ' },
+    };
+    const slashCommands = [...mockSlashCommands, settingsSlashCommand];
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(CursorState, null),
+        React.createElement(InputBox, { ...defaultProps, slashCommands: slashCommands }),
+        React.createElement(SettingsValueTriggerHarness, null)));
+    // Wait for the value menu to open with the current value (default) selected.
+    await waitFor(lastFrame, (f) => f.includes('default'), { timeoutMs: 3000 });
+    await flushReactUpdates(10);
+    // Press Tab to insert the selected value.
+    await writeInput(stdin, '\t');
+    // Wait for the cursor to move to the end of the inserted value.
+    const expectedValue = '/settings agent.reasoningEffort default';
+    const cursor = await waitForCondition(() => getCursorFromFrame(lastFrame()), (c) => c === expectedValue.length, { timeoutMs: 3000 });
+    expect(cursor).toBe(expectedValue.length);
 });
 const StateDisplay = () => {
     const { input, mode } = useInputContext();
@@ -154,7 +306,17 @@ const StateDisplay = () => {
         "|Mode:",
         mode));
 };
-const noopLoggingService = defaultProps.loggingService;
+const InputCursorStateDisplay = () => {
+    const { input, mode, cursorOffset } = useInputContext();
+    return (React.createElement(Text, null,
+        "Input:",
+        input,
+        "|Mode:",
+        mode,
+        "|Cursor:",
+        cursorOffset));
+};
+const noopLoggingService = createMockLoggingService();
 const ModelSelectionSubmitHarness = ({ trigger, settingsService, onSubmit, }) => {
     const { setInput, setMode, setCursorOffset, setTriggerIndex, input, mode } = useInputContext();
     const settings = useSettingsCompletion(settingsService);
@@ -241,7 +403,7 @@ const SettingsValueCommitHarness = ({ settingsService, reset, }) => {
         React.createElement(StateDisplay, null),
         React.createElement(SettingsSelectionMenu, { items: settings.filteredEntries, selectedIndex: settings.selectedIndex, scrollOffset: settings.scrollOffset, query: settings.query, activeCategoryId: settings.activeCategoryId, categories: settings.categories })));
 };
-test('settings-backed model selection restores settings menu after submit', async (t) => {
+it.sequential('settings-backed model selection restores settings menu after submit', async () => {
     clearModelCache();
     const mockProviderId = `mock-provider-${Date.now()}-${Math.random()}`;
     registerProvider({
@@ -249,23 +411,22 @@ test('settings-backed model selection restores settings menu after submit', asyn
         label: 'Mock Provider',
         fetchModels: async () => [{ id: 'gpt-test', name: 'GPT Test' }],
     });
-    t.teardown(() => {
-        clearModelCache();
-        unregisterProvider(mockProviderId);
-    });
     const settingsService = createMockSettingsService({
         'agent.provider': mockProviderId,
     });
-    const { lastFrame } = render(React.createElement(InputProvider, null,
+    const { lastFrame } = await renderAndFlush(React.createElement(InputProvider, null,
         React.createElement(ModelSelectionSubmitHarness, { trigger: "/settings agent.model ", settingsService: settingsService, onSubmit: () => { } })));
-    await flushReactUpdates(40);
-    const frame = lastFrame() ?? '';
-    t.is(settingsService.get('agent.model'), 'gpt-test');
-    t.is(settingsService.get('agent.provider'), mockProviderId);
-    t.true(frame.includes('Input:/settings '), `Input should be restored to settings trigger, got: ${frame}`);
-    t.true(frame.includes('▶ agent.model'), `Selection should target agent.model, got: ${frame}`);
+    const frame = await waitFor(lastFrame, (f) => f.includes('agent.model'));
+    const visibleFrame = toVisibleText(frame);
+    expect(settingsService.get('agent.model')).toBe('gpt-test');
+    expect(settingsService.get('agent.provider')).toBe(mockProviderId);
+    expect(visibleFrame.includes('Input:/settings ')).toBe(true);
+    expect(visibleFrame.includes('▶ agent.model')).toBe(true);
+    // Cleanup after test
+    clearModelCache();
+    unregisterProvider(mockProviderId);
 });
-test('command-backed model selection still submits after selection', async (t) => {
+it.sequential('command-backed model selection still submits after selection', async () => {
     clearModelCache();
     const mockProviderId = `mock-provider-2-${Date.now()}-${Math.random()}`;
     registerProvider({
@@ -273,92 +434,246 @@ test('command-backed model selection still submits after selection', async (t) =
         label: 'Mock Provider 2',
         fetchModels: async () => [{ id: 'gpt-test-2', name: 'GPT Test 2' }],
     });
-    t.teardown(() => {
-        clearModelCache();
-        unregisterProvider(mockProviderId);
-    });
     let submitted = false;
     const settingsService = createMockSettingsService({
         'agent.provider': mockProviderId,
     });
-    render(React.createElement(InputProvider, null,
+    await renderAndFlush(React.createElement(InputProvider, null,
         React.createElement(ModelSelectionSubmitHarness, { trigger: "/model ", settingsService: settingsService, onSubmit: () => {
                 submitted = true;
             } })));
-    await flushReactUpdates(40);
-    t.true(submitted, 'onSubmit should be called for command-backed model selection');
-    t.is(settingsService.get('agent.provider'), mockProviderId);
+    await waitForCondition(() => submitted, (v) => v);
+    expect(submitted).toBe(true);
+    expect(settingsService.get('agent.provider')).toBe(mockProviderId);
+    // Cleanup after test
+    clearModelCache();
+    unregisterProvider(mockProviderId);
 });
-test('settings value completion saves setting and reopens settings menu targeting the saved key', async (t) => {
+it.sequential('settings value completion saves setting and reopens settings menu targeting the saved key', async () => {
     const settingsService = createMockSettingsService({
         'shell.timeout': 120000,
     });
-    const { lastFrame } = render(React.createElement(InputProvider, null,
+    const { lastFrame } = await renderAndFlush(React.createElement(InputProvider, null,
         React.createElement(SettingsValueCommitHarness, { settingsService: settingsService, reset: false })));
-    await flushReactUpdates(40);
+    const frame = await waitFor(lastFrame, (f) => f.includes('shell.timeout'));
+    const visibleFrame = toVisibleText(frame);
     // The setting should be updated to 60000
-    t.is(settingsService.get('shell.timeout'), 60000);
+    expect(settingsService.get('shell.timeout')).toBe(60000);
     // The menu should be restored targeting 'shell.timeout'
-    const frame = lastFrame() ?? '';
-    t.true(frame.includes('Input:/settings'), `Input should be restored to settings trigger, got: ${frame}`);
-    t.true(frame.includes('▶ shell.timeout'), `Selection should remain on shell.timeout, got: ${frame}`);
+    expect(visibleFrame.includes('Input:/settings')).toBe(true);
+    expect(visibleFrame.includes('▶ shell.timeout')).toBe(true);
+});
+it.sequential('settings key insertion advances cursor before reopening value completion', async () => {
+    const settingsService = createMockSettingsService();
+    const mockSettingsCommand = {
+        name: '/settings',
+        description: 'Settings',
+        action: () => { },
+        completion: {
+            type: 'settings',
+            trigger: '/settings ',
+            resetTrigger: '/settings reset ',
+        },
+    };
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(InputCursorStateDisplay, null),
+        React.createElement(InputBox, { ...defaultProps, settingsService: settingsService, slashCommands: [...mockSlashCommands, mockSettingsCommand] })));
+    await writeInput(stdin, '/settings shell.timeout');
+    await writeInput(stdin, '\r');
+    const expectedInput = '/settings shell.timeout ';
+    const frame = await waitFor(lastFrame, (f) => f.includes(`Input:${expectedInput}`), { timeoutMs: 3000 });
+    expect(frame.includes('Mode:settings_value_completion'), frame).toBe(true);
+    expect(frame.includes(`Cursor:${expectedInput.length}`), frame).toBe(true);
 });
-test('settings value completion resets setting and reopens settings menu targeting the reset key', async (t) => {
+it.sequential('settings value completion resets setting and reopens settings menu targeting the reset key', async () => {
     const settingsService = createMockSettingsService({
         'shell.timeout': 60000,
     });
-    const { lastFrame } = render(React.createElement(InputProvider, null,
+    const { lastFrame } = await renderAndFlush(React.createElement(InputProvider, null,
         React.createElement(SettingsValueCommitHarness, { settingsService: settingsService, reset: true })));
-    await flushReactUpdates(40);
+    const frame = await waitFor(lastFrame, (f) => f.includes('shell.timeout'));
+    const visibleFrame = toVisibleText(frame);
     // The setting should be reset to default (120000)
-    t.is(settingsService.get('shell.timeout'), 120000);
+    expect(settingsService.get('shell.timeout')).toBe(120000);
     // The menu should be restored targeting 'shell.timeout'
-    const frame = lastFrame() ?? '';
-    t.true(frame.includes('Input:/settings'), `Input should be restored to settings trigger, got: ${frame}`);
-    t.true(frame.includes('▶ shell.timeout'), `Selection should remain on shell.timeout, got: ${frame}`);
+    expect(visibleFrame.includes('Input:/settings')).toBe(true);
+    expect(visibleFrame.includes('▶ shell.timeout')).toBe(true);
+});
+it.sequential('settings value completion prefers typed custom numeric value over the selected current value', async () => {
+    const settingsService = createMockSettingsService({
+        'shell.timeout': 120000,
+    });
+    const mockSettingsCommand = {
+        name: '/settings',
+        description: 'Settings',
+        action: () => { },
+        completion: {
+            type: 'settings',
+            trigger: '/settings ',
+            resetTrigger: '/settings reset ',
+        },
+    };
+    const { stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(InputBox, { ...defaultProps, settingsService: settingsService, slashCommands: [...mockSlashCommands, mockSettingsCommand] })));
+    await writeInput(stdin, '/settings shell.timeout 60000');
+    await writeInput(stdin, '\r');
+    await waitForCondition(() => settingsService.get('shell.timeout'), (v) => v === 60000);
+    expect(settingsService.get('shell.timeout')).toBe(60000);
+});
+it.sequential('settings value completion persists startup-only settings for the next session', async () => {
+    const settingsService = createMockSettingsService({
+        'agent.maxTurns': 100,
+    });
+    const mockSettingsCommand = {
+        name: '/settings',
+        description: 'Settings',
+        action: () => { },
+        completion: {
+            type: 'settings',
+            trigger: '/settings ',
+            resetTrigger: '/settings reset ',
+        },
+    };
+    const { stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(InputBox, { ...defaultProps, settingsService: settingsService, slashCommands: [...mockSlashCommands, mockSettingsCommand] })));
+    await writeInput(stdin, '/settings agent.maxTurns 30');
+    await writeInput(stdin, '\r');
+    await waitForCondition(() => settingsService.get('agent.maxTurns'), (v) => v === 30);
+    expect(settingsService.get('agent.maxTurns')).toBe(30);
+});
+it.sequential('settings value completion shows restart notice for startup-only settings', async () => {
+    const settingsService = createMockSettingsService({
+        'agent.maxTurns': 100,
+    });
+    const systemMessages = [];
+    const mockSettingsCommand = {
+        name: '/settings',
+        description: 'Settings',
+        action: () => { },
+        completion: {
+            type: 'settings',
+            trigger: '/settings ',
+            resetTrigger: '/settings reset ',
+        },
+    };
+    const { stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(InputBox, { ...defaultProps, settingsService: settingsService, slashCommands: [...mockSlashCommands, mockSettingsCommand], onSystemMessage: (text) => {
+                systemMessages.push(text);
+            } })));
+    await writeInput(stdin, '/settings agent.maxTurns 30');
+    await writeInput(stdin, '\r');
+    await waitForCondition(() => systemMessages, (msgs) => msgs.length > 0);
+    expect(systemMessages).toEqual(['Saved agent.maxTurns = 30. This setting applies after restart.']);
 });
-test('InputBox ignores focus sequences when not in text mode', async (t) => {
+it.sequential('InputBox ignores focus sequences when not in text mode', async () => {
     const TestHarness = () => (React.createElement(InputProvider, null,
         React.createElement(StateDisplay, null),
         React.createElement(InputBox, { ...defaultProps })));
-    const { lastFrame, stdin } = render(React.createElement(TestHarness, null));
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(TestHarness, null));
     // Trigger slash commands mode by writing "/"
     await writeInput(stdin, '/');
-    await flushReactUpdates(20);
-    let frame = lastFrame() ?? '';
-    t.true(frame.includes('Input:/|Mode:slash_commands'), frame);
-    // Write focus-in sequence
+    let frame = await waitFor(lastFrame, (f) => f.includes('slash_commands'));
+    expect(frame.includes('Input:/|Mode:slash_commands')).toBe(true);
+    // Write focus-in sequence — should be ignored
     await writeInput(stdin, '\x1b[I');
-    await flushReactUpdates(20);
+    await flushReactUpdates(10);
     frame = lastFrame() ?? '';
-    // Input should still be "/"
-    t.true(frame.includes('Input:/|Mode:slash_commands'), frame);
-    // Write focus-out sequence
+    expect(frame.includes('Input:/|Mode:slash_commands')).toBe(true);
+    // Write focus-out sequence — should be ignored
     await writeInput(stdin, '\x1b[O');
-    await flushReactUpdates(20);
+    await flushReactUpdates(10);
     frame = lastFrame() ?? '';
     // Input should still be "/"
-    t.true(frame.includes('Input:/|Mode:slash_commands'), frame);
+    expect(frame.includes('Input:/|Mode:slash_commands')).toBe(true);
 });
-test('InputBox ignores focus sequences when in text mode', async (t) => {
+it.sequential('InputBox ignores focus sequences when in text mode', async () => {
     const TestHarness = () => (React.createElement(InputProvider, null,
         React.createElement(StateDisplay, null),
         React.createElement(InputBox, { ...defaultProps })));
-    const { lastFrame, stdin } = render(React.createElement(TestHarness, null));
-    await flushReactUpdates(5);
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(TestHarness, null));
     let frame = lastFrame() ?? '';
-    t.true(frame.includes('Input:|Mode:text'), frame);
-    // Write focus-in sequence
+    expect(frame.includes('Input:|Mode:text')).toBe(true);
+    // Write focus-in sequence — should be ignored
     await writeInput(stdin, '\x1b[I');
-    await flushReactUpdates(20);
+    await flushReactUpdates(10);
     frame = lastFrame() ?? '';
     // Input should still be empty
-    t.true(frame.includes('Input:|Mode:text'), frame);
-    // Write focus-out sequence
+    expect(frame.includes('Input:|Mode:text')).toBe(true);
+    // Write focus-out sequence — should be ignored
     await writeInput(stdin, '\x1b[O');
-    await flushReactUpdates(20);
+    await flushReactUpdates(10);
     frame = lastFrame() ?? '';
     // Input should still be empty
-    t.true(frame.includes('Input:|Mode:text'), frame);
+    expect(frame.includes('Input:|Mode:text')).toBe(true);
+});
+it.sequential('settings value completion shows current custom settings value in suggestions list', async () => {
+    const originalColumns = process.stdout.columns;
+    process.stdout.columns = 80;
+    // Cleanup after test
+    process.stdout.columns = originalColumns;
+    const settingsService = createMockSettingsService({
+        'agent.maxTurns': 35,
+    });
+    const mockSettingsCommand = {
+        name: '/settings',
+        description: 'Settings',
+        action: () => { },
+        completion: {
+            type: 'settings',
+            trigger: '/settings ',
+            resetTrigger: '/settings reset ',
+        },
+    };
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(InputBox, { ...defaultProps, settingsService: settingsService, slashCommands: [...mockSlashCommands, mockSettingsCommand] })));
+    // Write trigger value to enter settings value completion mode
+    await writeInput(stdin, '/settings agent.maxTurns ');
+    const frame = await waitFor(lastFrame, (f) => f.includes('Current value'), { timeoutMs: 5000 });
+    const visibleFrame = toVisibleText(frame);
+    expect(visibleFrame.includes('35 — Current value')).toBe(true);
+});
+it.sequential('InputBox allows backspace and delete keys to modify input in provider wizard phases', async () => {
+    const providersMenuRef = { current: null };
+    const settingsService = createMockSettingsService();
+    const { lastFrame, stdin } = await renderAndFlush(React.createElement(InputProvider, null,
+        React.createElement(StateDisplay, null),
+        React.createElement(InputBox, { ...defaultProps, settingsService: settingsService, providersMenuRef: providersMenuRef })));
+    const pressKey = async (keyStr) => {
+        await act(async () => {
+            stdin.write(keyStr);
+            for (let i = 0; i < 10; i++) {
+                await new Promise((resolve) => setImmediate(resolve));
+            }
+        });
+    };
+    // Open the providers menu
+    await act(async () => {
+        providersMenuRef.current.open();
+    });
+    await flushReactUpdates(10);
+    // Navigate up to "Add Custom Provider" (wrapping to the second-to-last item) and press Enter
+    await pressKey('\u001B[A'); // Up Arrow (wraps to Reorder Providers)
+    await pressKey('\u001B[A'); // Up Arrow (moves to Add Custom Provider)
+    await pressKey('\r'); // Enter
+    let frame = await waitFor(lastFrame, (f) => f.includes('provider_selection'));
+    expect(frame.includes('Mode:provider_selection')).toBe(true);
+    expect(frame.includes('Step 1: Provider Name')).toBe(true);
+    // Type character 'a'
+    await pressKey('a');
+    frame = lastFrame() ?? '';
+    expect(frame.includes('Input:a')).toBe(true);
+    // Press Backspace (\x7f)
+    await pressKey('\x7f');
+    frame = lastFrame() ?? '';
+    expect(frame.includes('Input:|')).toBe(true);
+    // Type character 'b'
+    await pressKey('b');
+    frame = lastFrame() ?? '';
+    expect(frame.includes('Input:b')).toBe(true);
+    // Move cursor left (\u001B[D) and press Delete (\u001B[3~)
+    await pressKey('\u001B[D'); // Left arrow
+    await pressKey('\u001B[3~'); // Delete
+    frame = lastFrame() ?? '';
+    expect(frame.includes('Input:|')).toBe(true);
 });
 //# sourceMappingURL=InputBox.test.js.map