prompt-language-shell 1.0.2 → 1.0.4

package/dist/Main.js

@@ -8,10 +8,19 @@ import { getMissingConfigKeys } from './configuration/schema.js';
 import { createConfigStepsFromSchema } from './configuration/steps.js';
 import { unflattenConfig } from './configuration/transformation.js';
 import { createAnthropicService } from './services/anthropic.js';
-import { createCommand, createConfig, createFeedback, createMessage, createWelcome, } from './services/components.js';
+import { createCommand, createConfig, createFeedback, createHelp, createMessage, createWelcome, } from './services/components.js';
 import { registerGlobalShortcut } from './services/keyboard.js';
 import { initializeLogger, setDebugLevel } from './services/logger.js';
 import { Workflow } from './components/Workflow.js';
+/**
+ * Check if command matches help variations (help, --help, -h)
+ */
+function isHelpCommand(cmd) {
+    if (!cmd)
+        return false;
+    const normalized = cmd.toLowerCase().trim();
+    return (normalized === 'help' || normalized === '--help' || normalized === '-h');
+}
 export const Main = ({ app, command, serviceFactory = createAnthropicService, }) => {
     const [service, setService] = useState(null);
     const [initialQueue, setInitialQueue] = useState(null);
@@ -106,6 +115,10 @@ export const Main = ({ app, command, serviceFactory = createAnthropicService, })
                 }),
             ]);
         }
+        else if (service && isHelpCommand(command)) {
+            // Help command - show help screen directly (no LLM)
+            setInitialQueue([createHelp({ app })]);
+        }
         else if (service && command) {
             // Valid service exists and command provided - execute command
             setInitialQueue([createCommand({ command, service })]);

package/dist/components/Component.js

@@ -16,6 +16,7 @@ import { Refinement, RefinementView } from './controllers/Refinement.js';
 import { Report } from './views/Report.js';
 import { Schedule, ScheduleView } from './controllers/Schedule.js';
 import { Validate, ValidateView } from './controllers/Validate.js';
+import { Help } from './views/Help.js';
 import { Welcome } from './views/Welcome.js';
 /**
  * Render a simple component (no lifecycle management)
@@ -26,6 +27,10 @@ export const SimpleComponent = memo(function SimpleComponent({ def, }) {
             const { props, status } = def;
             return _jsx(Welcome, { ...props, status: status });
         }
+        case ComponentName.Help: {
+            const { props, status } = def;
+            return _jsx(Help, { ...props, status: status });
+        }
         case ComponentName.Feedback: {
             const { props, status } = def;
             return _jsx(Feedback, { ...props, status: status });
@@ -157,6 +162,7 @@ export const TimelineComponent = ({ def, }) => {
     switch (def.name) {
         // Simple components render as-is
         case ComponentName.Welcome:
+        case ComponentName.Help:
         case ComponentName.Feedback:
         case ComponentName.Message:
         case ComponentName.Debug:

package/dist/components/controllers/Config.js

@@ -8,9 +8,31 @@ import { createConfigStepsFromSchema } from '../../configuration/steps.js';
 import { saveConfigLabels } from '../../configuration/labels.js';
 import { DebugLevel } from '../../configuration/types.js';
 import { useInput } from '../../services/keyboard.js';
-import { ConfigView, StepType } from '../views/Config.js';
+import { StepType } from '../views/Config.js';
+import { Setting } from './Setting.js';
 import { Spinner } from '../views/Spinner.js';
 export { ConfigView, StepType, } from '../views/Config.js';
+function isTextStep(step) {
+    return step.type === StepType.Text;
+}
+function isSelectionStep(step) {
+    return step.type === StepType.Selection;
+}
+function initializeStepValues(steps) {
+    const values = {};
+    for (const step of steps) {
+        const configKey = step.path || step.key;
+        if (isTextStep(step)) {
+            if (step.value !== null) {
+                values[configKey] = step.value;
+            }
+        }
+        else if (isSelectionStep(step)) {
+            values[configKey] = step.options[step.defaultIndex].value;
+        }
+    }
+    return values;
+}
 /**
  * Resolve query to config steps via CONFIGURE tool
  */
@@ -48,61 +70,19 @@ export function Config(props) {
     const isActive = status === ComponentStatus.Active;
     const [steps, setSteps] = useState(initialSteps || []);
     const [resolving, setResolving] = useState(!initialSteps?.length && !!query);
-    const [step, setStep] = useState(0);
-    const [values, setValues] = useState(() => {
-        const initial = {};
-        (initialSteps || []).forEach((stepConfig) => {
-            const configKey = stepConfig.path || stepConfig.key;
-            switch (stepConfig.type) {
-                case StepType.Text:
-                    if (stepConfig.value !== null) {
-                        initial[configKey] = stepConfig.value;
-                    }
-                    break;
-                case StepType.Selection:
-                    initial[configKey] =
-                        stepConfig.options[stepConfig.defaultIndex].value;
-                    break;
-            }
-        });
-        return initial;
-    });
-    const [inputValue, setInputValue] = useState('');
-    const [selectedIndex, setSelectedIndex] = useState(() => {
-        if (!initialSteps?.length)
-            return 0;
-        const first = initialSteps[0];
-        return first.type === StepType.Selection ? first.defaultIndex : 0;
-    });
-    // Resolve query to steps
+    const [currentStep, setCurrentStep] = useState(0);
+    const [values, setValues] = useState(() => initializeStepValues(initialSteps || []));
     useEffect(() => {
         if (!isActive || !query || !service || initialSteps?.length)
             return;
         resolveQueryToSteps(query, service)
             .then((result) => {
-            // Add debug components to timeline if present
             if (result.debug.length) {
                 workflowHandlers.addToTimeline(...result.debug);
             }
             setSteps(result.steps);
             setResolving(false);
-            // Initialize values for resolved steps
-            const initial = {};
-            result.steps.forEach((stepConfig) => {
-                const configKey = stepConfig.path || stepConfig.key;
-                switch (stepConfig.type) {
-                    case StepType.Text:
-                        if (stepConfig.value !== null) {
-                            initial[configKey] = stepConfig.value;
-                        }
-                        break;
-                    case StepType.Selection:
-                        initial[configKey] =
-                            stepConfig.options[stepConfig.defaultIndex].value;
-                        break;
-                }
-            });
-            setValues(initial);
+            setValues(initializeStepValues(result.steps));
         })
             .catch((err) => {
             setResolving(false);
@@ -119,96 +99,39 @@ export function Config(props) {
         lifecycleHandlers,
         workflowHandlers,
     ]);
-    // Update inputValue and selectedIndex when step changes
-    useEffect(() => {
-        if (isActive && step < steps.length) {
-            const stepConfig = steps[step];
-            const configKey = stepConfig.path || stepConfig.key;
-            setInputValue(values[configKey] || '');
-            if (stepConfig.type === StepType.Selection) {
-                setSelectedIndex(stepConfig.defaultIndex);
-            }
+    const handleEscape = () => {
+        requestHandlers.onCompleted({
+            values,
+            completedStep: currentStep,
+            selectedIndex: 0,
+            steps,
+        });
+        if (onAborted) {
+            onAborted('configuration');
+        }
+        else {
+            lifecycleHandlers.completeActive(createFeedback({
+                type: FeedbackType.Aborted,
+                message: 'Configuration cancelled.',
+            }));
         }
-    }, [step, isActive, steps, values]);
-    const normalizeValue = (value) => {
-        if (value === null || value === undefined)
-            return '';
-        return value.replace(/\n/g, '').trim();
     };
     useInput((_, key) => {
-        if (!isActive || step >= steps.length)
+        if (!isActive || currentStep >= steps.length)
             return;
-        const currentStepConfig = steps[step];
         if (key.escape) {
-            const configKey = currentStepConfig.path || currentStepConfig.key;
-            let currentValue = '';
-            switch (currentStepConfig.type) {
-                case StepType.Text:
-                    currentValue = inputValue || values[configKey] || '';
-                    break;
-                case StepType.Selection:
-                    currentValue = values[configKey] || '';
-                    break;
-            }
-            const finalValues = currentValue
-                ? { ...values, [configKey]: currentValue }
-                : values;
-            requestHandlers.onCompleted({
-                values: finalValues,
-                completedStep: step,
-                selectedIndex,
-                steps,
-            });
-            if (onAborted) {
-                onAborted('configuration');
-            }
-            else {
-                lifecycleHandlers.completeActive(createFeedback({
-                    type: FeedbackType.Aborted,
-                    message: 'Configuration cancelled.',
-                }));
-            }
-            return;
-        }
-        if (currentStepConfig.type === StepType.Selection) {
-            if (key.tab) {
-                setSelectedIndex((prev) => (prev + 1) % currentStepConfig.options.length);
-            }
-            else if (key.return) {
-                handleSubmit(currentStepConfig.options[selectedIndex].value);
-            }
+            handleEscape();
         }
     }, { isActive });
-    const handleSubmit = (value) => {
-        const currentStepConfig = steps[step];
-        let finalValue = '';
-        switch (currentStepConfig.type) {
-            case StepType.Selection:
-                finalValue = value;
-                break;
-            case StepType.Text: {
-                const normalizedInput = normalizeValue(value);
-                if (normalizedInput && currentStepConfig.validate(normalizedInput)) {
-                    finalValue = normalizedInput;
-                }
-                else if (currentStepConfig.value &&
-                    currentStepConfig.validate(currentStepConfig.value)) {
-                    finalValue = currentStepConfig.value;
-                }
-                break;
-            }
-        }
-        if (!finalValue)
-            return;
-        const configKey = currentStepConfig.path || currentStepConfig.key;
-        const newValues = { ...values, [configKey]: finalValue };
+    const handleEntrySubmit = (stepConfig, value) => {
+        const configKey = stepConfig.path || stepConfig.key;
+        const newValues = { ...values, [configKey]: value };
         setValues(newValues);
-        setInputValue('');
-        if (step === steps.length - 1) {
+        if (currentStep === steps.length - 1) {
             requestHandlers.onCompleted({
                 values: newValues,
                 completedStep: steps.length,
-                selectedIndex,
+                selectedIndex: 0,
                 steps,
             });
             try {
@@ -224,14 +147,25 @@ export function Config(props) {
                     message: error instanceof Error ? error.message : 'Configuration failed',
                 }));
             }
-            setStep(steps.length);
+            setCurrentStep(steps.length);
         }
         else {
-            setStep(step + 1);
+            setCurrentStep(currentStep + 1);
         }
     };
     if (resolving) {
         return (_jsxs(Box, { marginLeft: 1, children: [_jsx(Text, { children: "Resolving configuration... " }), _jsx(Spinner, {})] }));
     }
-    return (_jsx(ConfigView, { steps: steps, state: { values, completedStep: step, selectedIndex }, status: status, debug: debug, onInputChange: setInputValue, onInputSubmit: handleSubmit }));
+    return (_jsx(Box, { flexDirection: "column", marginLeft: 1, children: steps.map((stepConfig, index) => {
+            const isStepActive = index === currentStep && isActive;
+            const isCompleted = index < currentStep;
+            const wasAborted = index === currentStep && !isActive;
+            const shouldShow = isCompleted || isStepActive || wasAborted;
+            if (!shouldShow)
+                return null;
+            const configKey = stepConfig.path || stepConfig.key;
+            return (_jsx(Box, { marginTop: index === 0 ? 0 : 1, children: _jsx(Setting, { step: stepConfig, initialValue: values[configKey] || '', isActive: isStepActive, debug: debug, onSubmit: (value) => {
+                        handleEntrySubmit(stepConfig, value);
+                    } }) }, configKey));
+        }) }));
 }

package/dist/components/controllers/Confirm.js

@@ -19,7 +19,7 @@ export function Confirm({ message, status, requestHandlers, onConfirmed, onCance
             requestHandlers.onCompleted(finalState);
             onCancelled();
         }
-        else if (key.tab) {
+        else if (key.tab || key.leftArrow || key.rightArrow) {
             // Toggle between Yes (0) and No (1)
             setSelectedIndex((prev) => (prev === 0 ? 1 : 0));
         }

package/dist/components/controllers/Execute.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback, useEffect, useReducer, useRef } from 'react';
-import { ComponentStatus, } from '../../types/components.js';
+import { useCallback, useEffect, useReducer, useRef, useState } from 'react';
+import { ComponentStatus, OutputSource, } from '../../types/components.js';
 import { useInput } from '../../services/keyboard.js';
 import { formatErrorMessage, getExecutionErrorMessage, } from '../../services/messages.js';
-import { ExecutionStatus } from '../../services/shell.js';
+import { ExecutionStatus, killCurrentProcess, writeStdin, } from '../../services/shell.js';
 import { ELAPSED_UPDATE_INTERVAL, ensureMinimumTime, } from '../../services/timing.js';
 import { handleTaskCompletion, handleTaskFailure, } from '../../execution/handlers.js';
 import { processTasks } from '../../execution/processing.js';
@@ -43,6 +43,9 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
     });
     // Ref to track if current task execution is cancelled
     const cancelledRef = useRef(false);
+    // Toggle stdin input visibility with / key
+    const [showStdinInput, setShowStdinInput] = useState(false);
+    const showStdinInputRef = useRef(false);
     const { error, tasks, message, hasProcessed, completionMessage, summary } = localState;
     // Derive current task index from tasks
     const currentTaskIndex = getCurrentTaskIndex(tasks);
@@ -75,9 +78,17 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
             clearInterval(interval);
         };
     }, [runningTask?.startTime, isExecuting, currentTaskIndex]);
-    // Handle cancel - state already in reducer, just need to update final output
+    // Hide stdin input when not executing
+    useEffect(() => {
+        if (!isExecuting) {
+            showStdinInputRef.current = false;
+            setShowStdinInput(false);
+        }
+    }, [isExecuting]);
+    // Handle cancel - kill the running process and update final output
     const handleCancel = useCallback(() => {
         cancelledRef.current = true;
+        killCurrentProcess();
         dispatch({ type: ExecuteActionType.CancelExecution });
         // Build final state with current output for the running task
         const updatedTasks = tasks.map((task) => {
@@ -103,9 +114,30 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
         requestHandlers.onCompleted(finalState);
         requestHandlers.onAborted('execution');
     }, [message, summary, tasks, requestHandlers]);
-    useInput((_, key) => {
+    // Handle stdin submission: write the line to the running process
+    const handleStdinSubmit = useCallback((value) => {
+        writeStdin(value + '\n');
+        outputRef.current.chunks.push({
+            text: `\n> ${value}\n`,
+            timestamp: Date.now(),
+            source: OutputSource.Stdin,
+        });
+        showStdinInputRef.current = false;
+        setShowStdinInput(false);
+    }, []);
+    useInput((input, key) => {
         if (key.escape && (isLoading || isExecuting)) {
-            handleCancel();
+            if (showStdinInputRef.current) {
+                showStdinInputRef.current = false;
+                setShowStdinInput(false);
+            }
+            else {
+                handleCancel();
+            }
+        }
+        if (input === '/' && isExecuting && !showStdinInputRef.current) {
+            showStdinInputRef.current = true;
+            setShowStdinInput(true);
         }
     }, { isActive: (isLoading || isExecuting) && isActive });
     // Process tasks to get commands from AI
@@ -210,6 +242,8 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
         });
         // Reset output ref for new task
         outputRef.current = { chunks: [], currentMemory: undefined };
+        showStdinInputRef.current = false;
+        setShowStdinInput(false);
         // Merge workdir into command
         const command = workdirRef.current
             ? { ...currentTask.command, workdir: workdirRef.current }
@@ -217,8 +251,10 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
         void executeTask(command, currentTaskIndex, {
             onUpdate: (output) => {
                 if (!cancelledRef.current) {
+                    // Preserve stdin chunks that were added locally
+                    const stdinChunks = outputRef.current.chunks.filter((c) => c.source === OutputSource.Stdin);
                     outputRef.current = {
-                        chunks: output.chunks,
+                        chunks: [...output.chunks, ...stdinChunks],
                         currentMemory: output.currentMemory,
                     };
                 }
@@ -230,11 +266,13 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
                 if (execOutput.workdir) {
                     workdirRef.current = execOutput.workdir;
                 }
+                // Preserve stdin chunks in final output
+                const stdinChunks = outputRef.current.chunks.filter((c) => c.source === OutputSource.Stdin);
                 const tasksWithOutput = tasks.map((task, i) => i === currentTaskIndex
                     ? {
                         ...task,
                         output: {
-                            chunks: execOutput.chunks,
+                            chunks: [...execOutput.chunks, ...stdinChunks],
                         },
                     }
                     : task);
@@ -256,11 +294,13 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
                 if (execOutput.workdir) {
                     workdirRef.current = execOutput.workdir;
                 }
+                // Preserve stdin chunks in final output
+                const stdinChunks = outputRef.current.chunks.filter((c) => c.source === OutputSource.Stdin);
                 const tasksWithOutput = tasks.map((task, i) => i === currentTaskIndex
                     ? {
                         ...task,
                         output: {
-                            chunks: execOutput.chunks,
+                            chunks: [...execOutput.chunks, ...stdinChunks],
                         },
                         error: execOutput.error || undefined,
                     }
@@ -287,5 +327,5 @@ export function Execute({ tasks: inputTasks, status, service, upcoming, label, r
         lifecycleHandlers,
         workflowHandlers,
     ]);
-    return (_jsx(ExecuteView, { isLoading: isLoading, isExecuting: isExecuting, isActive: isActive, error: error, message: message, tasks: tasks, completionMessage: completionMessage, showTasks: showTasks, upcoming: upcoming, label: label }));
+    return (_jsx(ExecuteView, { isLoading: isLoading, isExecuting: isExecuting, isActive: isActive, error: error, message: message, tasks: tasks, completionMessage: completionMessage, showTasks: showTasks, upcoming: upcoming, label: label, onStdinSubmit: showStdinInput ? handleStdinSubmit : undefined }));
 }

package/dist/components/controllers/Schedule.js

@@ -61,21 +61,13 @@ export function Schedule({ message, tasks, status, debug = DebugLevel.None, requ
             requestHandlers.onAborted('task selection');
             return;
         }
-        if (key.downArrow) {
-            setHighlightedIndex((prev) => {
-                if (prev === null) {
-                    return 0; // Select first
-                }
-                return (prev + 1) % optionsCount; // Wrap around
-            });
+        if (key.downArrow || key.rightArrow || key.tab) {
+            setHighlightedIndex((prev) => prev === null ? 0 : (prev + 1) % optionsCount);
         }
-        else if (key.upArrow) {
-            setHighlightedIndex((prev) => {
-                if (prev === null) {
-                    return optionsCount - 1; // Select last
-                }
-                return (prev - 1 + optionsCount) % optionsCount; // Wrap around
-            });
+        else if (key.upArrow || key.leftArrow) {
+            setHighlightedIndex((prev) => prev === null
+                ? optionsCount - 1
+                : (prev - 1 + optionsCount) % optionsCount);
         }
         else if (key.return && highlightedIndex !== null) {
             // Record the selection for this group

package/dist/components/controllers/Setting.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useInput } from '../../services/keyboard.js';
+import { StepType } from '../views/Config.js';
+import { SettingView } from '../views/Setting.js';
+function isSelectionStep(step) {
+    return step.type === StepType.Selection;
+}
+function normalizeTextValue(value) {
+    if (value === null || value === undefined)
+        return '';
+    return value.replace(/\n/g, '').trim();
+}
+export function Setting({ step, initialValue, isActive, debug, onSubmit, }) {
+    const [inputValue, setInputValue] = useState(initialValue);
+    const [selectedIndex, setSelectedIndex] = useState(() => {
+        if (isSelectionStep(step)) {
+            const index = step.options.findIndex((opt) => opt.value === initialValue);
+            return index >= 0 ? index : step.defaultIndex;
+        }
+        return 0;
+    });
+    const handleInputChange = (value) => {
+        setInputValue(value);
+    };
+    const submitValue = (value) => {
+        setInputValue(value);
+        onSubmit(value);
+    };
+    const handleInputSubmit = (value) => {
+        if (step.type === StepType.Text) {
+            const normalizedInput = normalizeTextValue(value);
+            if (normalizedInput && step.validate(normalizedInput)) {
+                submitValue(normalizedInput);
+                return;
+            }
+            if (step.value && step.validate(step.value)) {
+                submitValue(step.value);
+                return;
+            }
+        }
+        else {
+            submitValue(value);
+        }
+    };
+    const handleSelectionNavigation = (key) => {
+        if (!isSelectionStep(step))
+            return;
+        const len = step.options.length;
+        if (key.tab || key.rightArrow) {
+            setSelectedIndex((prev) => (prev + 1) % len);
+        }
+        else if (key.leftArrow) {
+            setSelectedIndex((prev) => (prev - 1 + len) % len);
+        }
+        else if (key.return) {
+            submitValue(step.options[selectedIndex].value);
+        }
+    };
+    useInput((_, key) => {
+        if (!isActive || !isSelectionStep(step))
+            return;
+        handleSelectionNavigation(key);
+    }, { isActive: isActive && isSelectionStep(step) });
+    return (_jsx(SettingView, { step: step, value: inputValue, selectedIndex: selectedIndex, isActive: isActive, debug: debug, onInputChange: handleInputChange, onInputSubmit: handleInputSubmit }));
+}

package/dist/components/views/Config.js

@@ -1,106 +1,19 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { Box, Text, useFocus } from 'ink';
-import TextInput from 'ink-text-input';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box } from 'ink';
 import { ComponentStatus } from '../../types/components.js';
-import { Colors } from '../../services/colors.js';
 import { DebugLevel } from '../../configuration/types.js';
-import { useInput } from '../../services/keyboard.js';
-/**
- * Get postfix with debug brackets if debug is enabled
- * Info: {key} | Verbose: {key} entry
- */
-function getPostfix(text, debugLevel) {
-    if (debugLevel === DebugLevel.None || !text) {
-        return '';
-    }
-    if (debugLevel === DebugLevel.Info) {
-        return `{${text}}`;
-    }
-    return `{${text}} entry`;
-}
+import { SettingView } from './Setting.js';
 export var StepType;
 (function (StepType) {
     StepType["Text"] = "text";
     StepType["Selection"] = "selection";
 })(StepType || (StepType = {}));
-function TextStep({ value, placeholder, validate, onChange, onSubmit, }) {
-    const [inputValue, setInputValue] = useState(value);
-    const [validationFailed, setValidationFailed] = useState(false);
-    const { isFocused } = useFocus({ autoFocus: true });
-    // Sync internal state with prop changes
-    useEffect(() => {
-        setInputValue(value);
-    }, [value]);
-    const handleChange = (newValue) => {
-        setInputValue(newValue);
-        onChange(newValue);
-        if (validationFailed) {
-            setValidationFailed(false);
-        }
-    };
-    const handleSubmit = (value) => {
-        // Use placeholder if input is empty
-        const finalValue = value || placeholder || '';
-        if (!validate(finalValue)) {
-            setValidationFailed(true);
-            return;
-        }
-        onSubmit(finalValue);
-    };
-    // Handle input manually when validation fails
-    useInput((input, key) => {
-        if (!validationFailed)
-            return;
-        if (key.return) {
-            handleSubmit(inputValue);
-        }
-        else if (key.backspace || key.delete) {
-            const newValue = inputValue.slice(0, -1);
-            handleChange(newValue);
-        }
-        else if (!key.ctrl && !key.meta && input) {
-            const newValue = inputValue + input;
-            handleChange(newValue);
-        }
-    }, { isActive: validationFailed });
-    // When validation fails, show colored text
-    if (validationFailed) {
-        return (_jsxs(Text, { color: Colors.Status.Error, children: [inputValue || placeholder, isFocused && _jsx(Text, { inverse: true, children: " " })] }));
-    }
-    return (_jsx(TextInput, { value: inputValue, onChange: handleChange, onSubmit: handleSubmit, placeholder: placeholder }));
-}
-function SelectionStep({ options, selectedIndex, isCurrentStep, }) {
-    return (_jsx(Box, { children: options.map((option, optIndex) => {
-            const isSelected = optIndex === selectedIndex;
-            return (_jsx(Box, { marginRight: 2, children: _jsx(Text, { dimColor: !isSelected || !isCurrentStep, bold: isSelected, children: option.label }) }, option.value));
-        }) }));
-}
-export const ConfigView = ({ steps, state, status, debug = DebugLevel.None, onInputChange, onInputSubmit, }) => {
+/**
+ * Config view: Multi-step configuration form for timeline display
+ */
+export const ConfigView = ({ steps, state, status, debug = DebugLevel.None, }) => {
     const isActive = status === ComponentStatus.Active;
     const { values, completedStep, selectedIndex } = state;
-    const renderStepInput = (stepConfig, isCurrentStep) => {
-        const configKey = stepConfig.path || stepConfig.key;
-        const displayValue = values[configKey];
-        switch (stepConfig.type) {
-            case StepType.Text:
-                if (isCurrentStep && onInputChange && onInputSubmit) {
-                    return (_jsx(TextStep, { value: values[configKey] || '', placeholder: stepConfig.value || undefined, validate: stepConfig.validate, onChange: onInputChange, onSubmit: onInputSubmit }));
-                }
-                return (_jsx(Text, { dimColor: true, wrap: "truncate-end", children: displayValue || '' }));
-            case StepType.Selection: {
-                if (!isCurrentStep) {
-                    const option = stepConfig.options.find((opt) => opt.value === displayValue);
-                    return _jsx(Text, { dimColor: true, children: option?.label || '' });
-                }
-                return (_jsx(SelectionStep, { options: stepConfig.options, selectedIndex: selectedIndex, isCurrentStep: true }));
-            }
-            default: {
-                const _exhaustiveCheck = stepConfig;
-                throw new Error('Unsupported step type');
-            }
-        }
-    };
     return (_jsx(Box, { flexDirection: "column", marginLeft: 1, children: steps.map((stepConfig, index) => {
             const isCurrentStep = index === completedStep && isActive;
             const isCompleted = index < completedStep;
@@ -109,7 +22,7 @@ export const ConfigView = ({ steps, state, status, debug = DebugLevel.None, onIn
             if (!shouldShow) {
                 return null;
             }
-            const postfix = getPostfix(stepConfig.path, debug);
-            return (_jsxs(Box, { flexDirection: "column", marginTop: index === 0 ? 0 : 1, children: [_jsxs(Box, { children: [_jsx(Text, { children: stepConfig.description }), _jsx(Text, { children: ": " }), postfix && _jsx(Text, { color: Colors.Type.Config, children: postfix })] }), _jsxs(Box, { children: [_jsx(Text, { children: " " }), _jsx(Text, { color: Colors.Action.Select, dimColor: !isCurrentStep, children: ">" }), _jsx(Text, { children: " " }), renderStepInput(stepConfig, isCurrentStep)] })] }, stepConfig.path || stepConfig.key));
+            const configKey = stepConfig.path || stepConfig.key;
+            return (_jsx(Box, { flexDirection: "column", marginTop: index === 0 ? 0 : 1, children: _jsx(SettingView, { step: stepConfig, value: values[configKey] || '', selectedIndex: selectedIndex, isActive: isCurrentStep, debug: debug }) }, configKey));
         }) }));
 };