@unscientificjszhai/howto 1.0.0 → 1.0.1

package/dist/config.js

@@ -11,7 +11,6 @@ export function hasExplicitAiProvider(options, env, fileConfig = {}) {
     return (pickConfigValue(options.aiProvider, env.HOWTO_AI_PROVIDER, fileConfig.aiProvider) !== undefined);
 }
 export function loadConfig(options, env, fileConfig = {}) {
-    var _a, _b, _c;
     const aiProviderValue = pickConfigValue(options.aiProvider, env.HOWTO_AI_PROVIDER, fileConfig.aiProvider);
     if (aiProviderValue === undefined) {
         throw new ConfigError("AI provider is not configured. Set --ai-provider or HOWTO_AI_PROVIDER, or run howto in an interactive terminal to initialize it.");
@@ -21,11 +20,14 @@ export function loadConfig(options, env, fileConfig = {}) {
         aiProvider,
         gemini: {
             apiKey: pickConfigValue(options.geminiApiKey, env.HOWTO_GEMINI_API_KEY, fileConfig.geminiApiKey),
-            model: (_a = pickConfigValue(options.geminiModel, env.HOWTO_GEMINI_MODEL, fileConfig.geminiModel)) !== null && _a !== void 0 ? _a : DEFAULT_GEMINI_MODEL,
+            model: pickConfigValue(options.geminiModel, env.HOWTO_GEMINI_MODEL, fileConfig.geminiModel) ??
+                DEFAULT_GEMINI_MODEL,
         },
         openai: {
-            apiKey: (_b = pickConfigValue(options.openaiApiKey, env.HOWTO_OPENAI_API_KEY, fileConfig.openaiApiKey)) !== null && _b !== void 0 ? _b : "",
-            model: (_c = pickConfigValue(options.openaiModel, env.HOWTO_OPENAI_MODEL, fileConfig.openaiModel)) !== null && _c !== void 0 ? _c : DEFAULT_OPENAI_MODEL,
+            apiKey: pickConfigValue(options.openaiApiKey, env.HOWTO_OPENAI_API_KEY, fileConfig.openaiApiKey) ??
+                "",
+            model: pickConfigValue(options.openaiModel, env.HOWTO_OPENAI_MODEL, fileConfig.openaiModel) ??
+                DEFAULT_OPENAI_MODEL,
             baseUrl: pickConfigValue(options.openaiApiUrl, env.HOWTO_OPENAI_API_URL, fileConfig.openaiApiUrl),
         },
         structuredOutput: parseStructuredOutput(pickConfigValue(options.structuredOutput, env.HOWTO_STRUCTURED_OUTPUT, fileConfig.structuredOutput)),
@@ -36,8 +38,7 @@ export function loadConfig(options, env, fileConfig = {}) {
     return config;
 }
 function pickConfigValue(cliValue, envValue, fileValue) {
-    var _a;
-    return (_a = cliValue !== null && cliValue !== void 0 ? cliValue : envValue) !== null && _a !== void 0 ? _a : fileValue;
+    return cliValue ?? envValue ?? fileValue;
 }
 function parseAiProvider(value) {
     if (value === "openai" || value === "gemini") {

package/dist/errors.js

@@ -4,7 +4,16 @@ import { ConfigError } from "./config.js";
 import { AiResponseValidationError } from "./validation/ai-response.js";
 import { InteractionCancelledError, InteractiveTtyError } from "./ui/tty.js";
 import { PlaceholderResolutionError } from "./ui/placeholder-logic.js";
+import { sanitizeUserVisibleErrorMessage } from "./user-visible-error.js";
+export { sanitizeUserVisibleErrorMessage };
+export function getUserVisibleErrorMessage(error) {
+    if (error instanceof AiProviderError) {
+        return `AI provider request failed (provider: ${error.provider}, model: ${sanitizeUserVisibleErrorMessage(error.model)})`;
+    }
+    return sanitizeUserVisibleErrorMessage(error.message);
+}
 export class AppError extends Error {
+    exitCode;
     constructor(message, exitCode) {
         super(message);
         this.name = "AppError";
@@ -13,30 +22,30 @@ export class AppError extends Error {
 }
 export function toAppError(error) {
     if (error instanceof AppError) {
-        return error;
+        return new AppError(sanitizeUserVisibleErrorMessage(error.message), error.exitCode);
     }
     if (error instanceof CliParseError) {
-        return new AppError(`Error: ${error.message}\n${USAGE}`, 2);
+        return new AppError(`Error: ${sanitizeUserVisibleErrorMessage(error.message)}\n${USAGE}`, 2);
     }
     if (error instanceof ConfigError) {
-        return new AppError(`Configuration error: ${error.message}`, 2);
+        return new AppError(`Configuration error: ${sanitizeUserVisibleErrorMessage(error.message)}`, 2);
     }
     if (error instanceof AiProviderError) {
-        return new AppError(error.message, 1);
+        return new AppError(getUserVisibleErrorMessage(error), 1);
     }
     if (error instanceof AiResponseValidationError) {
-        return new AppError(`AI response format error: ${error.message}`, 2);
+        return new AppError(`AI response format error: ${sanitizeUserVisibleErrorMessage(error.message)}`, 2);
     }
     if (error instanceof InteractiveTtyError) {
-        return new AppError(`Error: ${error.message}`, 2);
+        return new AppError(`Error: ${sanitizeUserVisibleErrorMessage(error.message)}`, 2);
     }
     if (error instanceof PlaceholderResolutionError) {
-        return new AppError(`Error: ${error.message}`, 2);
+        return new AppError(`Error: ${sanitizeUserVisibleErrorMessage(error.message)}`, 2);
     }
     if (error instanceof InteractionCancelledError) {
         return new AppError("", 130);
     }
-    return new AppError(`Error: ${sanitizeErrorMessage(getErrorMessage(error))}`, 1);
+    return new AppError(`Error: ${sanitizeUserVisibleErrorMessage(getErrorMessage(error))}`, 1);
 }
 function getErrorMessage(error) {
     if (error instanceof Error && error.message.trim() !== "") {
@@ -47,11 +56,3 @@ function getErrorMessage(error) {
     }
     return "unknown error";
 }
-function sanitizeErrorMessage(message) {
-    const singleLine = message.replace(/\s+/g, " ").trim();
-    const redacted = singleLine
-        .replace(/Bearer\s+[A-Za-z0-9._~+/=-]+/gi, "Bearer [redacted]")
-        .replace(/(api[-_ ]?key["'\s:=]+)[A-Za-z0-9._~+/=-]+/gi, "$1[redacted]")
-        .replace(/(authorization["'\s:=]+)[A-Za-z0-9._~+/=-]+/gi, "$1[redacted]");
-    return redacted.length > 220 ? `${redacted.slice(0, 217)}...` : redacted;
-}

package/dist/execute.js

@@ -1,38 +1,25 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import { spawn } from "child_process";
 import { constants as osConstants } from "os";
-export function executeCommand(command_1) {
-    return __awaiter(this, arguments, void 0, function* (command, options = {}) {
-        var _a, _b, _c;
-        const env = (_a = options.env) !== null && _a !== void 0 ? _a : process.env;
-        const platform = (_b = options.platform) !== null && _b !== void 0 ? _b : process.platform;
-        const spawnCommand = (_c = options.spawnCommand) !== null && _c !== void 0 ? _c : spawnCommandWithNodeSpawn;
-        const child = platform === "win32"
-            ? spawnCommand(command, { shell: env.SHELL || true, stdio: "inherit" }, { stdio: "inherit" })
-            : spawnCommand(resolveShell(env), ["-lc", `exec ${command}`], { stdio: "inherit" });
-        return new Promise((resolve, reject) => {
-            child.once("error", reject);
-            child.once("close", (code, signal) => {
-                resolve(resolveProcessExitCode(code, signal));
-            });
+export async function executeCommand(command, options = {}) {
+    const env = options.env ?? process.env;
+    const platform = options.platform ?? process.platform;
+    const spawnCommand = options.spawnCommand ?? spawnCommandWithNodeSpawn;
+    const child = platform === "win32"
+        ? spawnCommand(command, { shell: env.SHELL || true, stdio: "inherit" }, { stdio: "inherit" })
+        : spawnCommand(resolveShell(env), ["-c", command], { stdio: "inherit" });
+    return new Promise((resolve, reject) => {
+        child.once("error", reject);
+        child.once("close", (code, signal) => {
+            resolve(resolveProcessExitCode(code, signal));
         });
     });
 }
 export function resolveProcessExitCode(code, signal) {
-    var _a;
     if (typeof code === "number") {
         return code;
     }
     if (signal !== null) {
-        return 128 + ((_a = osConstants.signals[signal]) !== null && _a !== void 0 ? _a : 1);
+        return 128 + (osConstants.signals[signal] ?? 1);
     }
     return 1;
 }

package/dist/index.js

@@ -1,17 +1,6 @@
 #!/usr/bin/env node
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import React from "react";
 import { realpathSync } from "node:fs";
 import { fileURLToPath } from "node:url";
-import { render } from "ink";
 import { CliParseError, parseCliArgs } from "./cli.js";
 import { ConfigError, hasExplicitAiProvider, loadConfig } from "./config.js";
 import { readUserConfigFile } from "./config-file.js";
@@ -20,102 +9,102 @@ import { buildCommandGenerationPrompt, createProviderPromptRequest } from "./pro
 import { checkCommandInPath } from "./validation/command-tool.js";
 import { generateValidatedCommandCandidates } from "./validation/generated-commands.js";
 import { ensureInteractiveTty } from "./ui/tty.js";
-import { executeCommand } from "./execute.js";
 import { toAppError } from "./errors.js";
-import { App } from "./ui/App.js";
+import { createInteractiveSession } from "./ui/interactive-session.js";
+import { runInteractiveCommand } from "./ui/run-interactive-command.js";
 import { initializeConfig } from "./init/index.js";
-function run(argv) {
-    return __awaiter(this, void 0, void 0, function* () {
-        try {
-            const parsedCli = parseCliArgs(argv);
-            if (parsedCli.options.init) {
-                ensureInteractiveTty(process.stdin, process.stdout);
-                yield initializeConfig({
-                    cliOptions: parsedCli.options,
-                    env: process.env,
-                    input: process.stdin,
-                    output: process.stdout,
-                });
-                return { exitCode: 0 };
-            }
-            const fileConfig = yield readUserConfigFile();
-            if (parsedCli.question === undefined) {
-                throw new CliParseError("missing question");
-            }
-            if (!hasExplicitAiProvider(parsedCli.options, process.env, fileConfig)) {
-                if (parsedCli.options.print) {
-                    throw new ConfigError("AI provider is not configured. --print cannot run initialization; run howto --init or set --ai-provider, HOWTO_AI_PROVIDER, or ~/.howto/config.json.");
-                }
-                ensureInteractiveTty(process.stdin, process.stdout);
-            }
-            const config = hasExplicitAiProvider(parsedCli.options, process.env, fileConfig)
-                ? loadConfig(parsedCli.options, process.env, fileConfig)
-                : yield initializeConfig({
-                    cliOptions: parsedCli.options,
-                    env: process.env,
-                    input: process.stdin,
-                    output: process.stdout,
-                });
-            const useCommandPathCheck = parsedCli.useCommand === undefined
-                ? undefined
-                : checkCommandInPath(parsedCli.useCommand, process.env);
-            if (!parsedCli.options.print) {
-                ensureInteractiveTty(process.stdin, process.stdout);
-            }
-            const promptRequest = createProviderPromptRequest({
-                question: parsedCli.question,
-                arguments: parsedCli.arguments,
-                useCommand: parsedCli.useCommand,
-                structuredOutput: config.structuredOutput,
+import { renderTerminalSafeText } from "./terminal-text.js";
+import { readPackageVersion } from "./version.js";
+async function run(argv) {
+    let session;
+    const getSession = () => {
+        ensureInteractiveTty(process.stdin, process.stdout);
+        session ??= createInteractiveSession({ input: process.stdin, output: process.stdout });
+        return session;
+    };
+    try {
+        const parsedCli = parseCliArgs(argv);
+        if (parsedCli.options.version) {
+            console.log(readPackageVersion());
+            return { exitCode: 0 };
+        }
+        if (parsedCli.options.init) {
+            ensureInteractiveTty(process.stdin, process.stdout);
+            await initializeConfig({
+                cliOptions: parsedCli.options,
+                env: process.env,
+                session: getSession(),
             });
-            const { systemPrompt, userPrompt } = buildCommandGenerationPrompt(promptRequest);
-            const provider = createCommandProvider(config);
+            return { exitCode: 0 };
+        }
+        const fileConfig = await readUserConfigFile();
+        if (parsedCli.question === undefined) {
+            throw new CliParseError("missing question");
+        }
+        if (!hasExplicitAiProvider(parsedCli.options, process.env, fileConfig)) {
             if (parsedCli.options.print) {
-                const candidates = yield generateValidatedCommandCandidates(provider, Object.assign(Object.assign({}, promptRequest), { systemPrompt,
-                    userPrompt }));
-                candidates.forEach((candidate) => {
-                    console.log(candidate.command);
-                });
-                return { exitCode: 0 };
-            }
-            if (useCommandPathCheck !== undefined && !useCommandPathCheck.found) {
-                console.error(`Warning: requested command "${useCommandPathCheck.command}" was not found in PATH. Review before executing any generated command.`);
+                throw new ConfigError("AI provider is not configured. --print cannot run initialization; run howto --init or set --ai-provider, HOWTO_AI_PROVIDER, or ~/.howto/config.json.");
             }
-            let finalCommand;
-            let appError;
-            const { waitUntilExit, unmount, clear } = render(React.createElement(App, { provider: provider, request: Object.assign(Object.assign({}, promptRequest), { systemPrompt, userPrompt }), onSuccess: (command) => {
-                    finalCommand = command;
-                    clear();
-                    unmount();
-                }, onError: (error) => {
-                    appError = error;
-                    clear();
-                    unmount();
-                } }));
-            yield waitUntilExit();
-            if (appError) {
-                throw appError;
-            }
-            if (finalCommand === undefined) {
-                return { exitCode: 1 };
-            }
-            const exitCode = yield executeCommand(finalCommand);
-            return { exitCode };
+            ensureInteractiveTty(process.stdin, process.stdout);
         }
-        catch (error) {
-            const appError = toAppError(error);
-            if (appError.message !== "") {
-                console.error(appError.message);
-            }
-            return { exitCode: appError.exitCode };
+        const config = hasExplicitAiProvider(parsedCli.options, process.env, fileConfig)
+            ? loadConfig(parsedCli.options, process.env, fileConfig)
+            : await initializeConfig({
+                cliOptions: parsedCli.options,
+                env: process.env,
+                session: getSession(),
+            });
+        const useCommandPathCheck = parsedCli.useCommand === undefined
+            ? undefined
+            : checkCommandInPath(parsedCli.useCommand, process.env);
+        if (!parsedCli.options.print) {
+            ensureInteractiveTty(process.stdin, process.stdout);
         }
-    });
+        const promptRequest = createProviderPromptRequest({
+            question: parsedCli.question,
+            arguments: parsedCli.arguments,
+            useCommand: parsedCli.useCommand,
+            structuredOutput: config.structuredOutput,
+        });
+        const { systemPrompt, userPrompt } = buildCommandGenerationPrompt(promptRequest);
+        const provider = createCommandProvider(config);
+        if (parsedCli.options.print) {
+            const candidates = await generateValidatedCommandCandidates(provider, {
+                ...promptRequest,
+                systemPrompt,
+                userPrompt,
+            });
+            candidates.forEach((candidate) => {
+                console.log(candidate.command);
+            });
+            return { exitCode: 0 };
+        }
+        if (useCommandPathCheck !== undefined && !useCommandPathCheck.found) {
+            console.error(`Warning: requested command "${renderTerminalSafeText(useCommandPathCheck.command)}" was not found in PATH. Review before executing any generated command.`);
+        }
+        const exitCode = await runInteractiveCommand({
+            session: getSession(),
+            provider,
+            request: { ...promptRequest, systemPrompt, userPrompt },
+        });
+        return { exitCode };
+    }
+    catch (error) {
+        const appError = toAppError(error);
+        if (appError.message !== "") {
+            console.error(appError.message);
+        }
+        return { exitCode: appError.exitCode };
+    }
+    finally {
+        session?.dispose();
+    }
 }
 function resolveEntrypointPath(path) {
     try {
         return realpathSync(path);
     }
-    catch (_a) {
+    catch {
         return path;
     }
 }

package/dist/init/InitializationApp.js

@@ -1,19 +1,41 @@
-import React, { useState } from "react";
-import { Box, Text, useInput } from "ink";
+import React, { useRef, useState } from "react";
+import { Box, Text } from "ink";
+import { getUserVisibleErrorMessage } from "../errors.js";
+import { usePhysicalStdoutRows } from "../ui/resize-safe-output.js";
+import { toSingleLinePreview } from "../ui/single-line-preview.js";
+import { useInteractiveSession } from "../ui/InteractiveSessionProvider.js";
+import { usePasteAwareInput } from "../ui/use-paste-aware-input.js";
 import { applyInitializationInput, createInitialInitializationState, getProviderOptions, } from "./state.js";
+const RICH_LAYOUT_MIN_ROWS = 15;
 export const InitializationApp = ({ onSubmit, onComplete, onCancel, onError }) => {
+    const session = useInteractiveSession();
+    const rows = usePhysicalStdoutRows();
     const [state, setState] = useState(createInitialInitializationState);
+    const stateRef = useRef(state);
     const [submitStatus, setSubmitStatus] = useState("editing");
+    const submitStatusRef = useRef(submitStatus);
     const [errorMessage, setErrorMessage] = useState("");
-    useInput((input, key) => {
-        const update = applyInitializationInput(state, { input, key });
+    const frameRows = Math.max(0, rows - 1);
+    const handleInput = (event) => {
+        if (frameRows === 0) {
+            return;
+        }
+        if (submitStatusRef.current !== "editing") {
+            return;
+        }
+        const update = applyInitializationInput(stateRef.current, event);
+        stateRef.current = update.state;
         setState(update.state);
         if (update.cancelled) {
+            session.suspendViewInput();
+            submitStatusRef.current = "cancelled";
             setSubmitStatus("cancelled");
             onCancel();
             return;
         }
         if (update.completedValues !== undefined) {
+            session.suspendViewInput();
+            submitStatusRef.current = "saving";
             setSubmitStatus("saving");
             onSubmit(update.completedValues)
                 .then((config) => {
@@ -21,33 +43,72 @@ export const InitializationApp = ({ onSubmit, onComplete, onCancel, onError }) =
             })
                 .catch((error) => {
                 const appError = normalizeError(error);
-                setErrorMessage(appError.message);
+                setErrorMessage(getUserVisibleErrorMessage(appError));
+                submitStatusRef.current = "error";
                 setSubmitStatus("error");
                 onError(appError);
             });
         }
-    }, { isActive: submitStatus === "editing" });
+    };
+    usePasteAwareInput({
+        onInput: (input, key) => {
+            handleInput({ type: "keyboard", input, key });
+        },
+        onPaste: (input) => {
+            handleInput({ type: "paste", input });
+        },
+        isInputActive: frameRows === 0 || submitStatus === "editing",
+        isPasteActive: frameRows > 0 && submitStatus === "editing",
+    });
+    let content;
     if (submitStatus === "saving") {
-        return (React.createElement(Box, { flexDirection: "column", marginY: 1 },
-            React.createElement(Text, { color: "green" }, "Saving howto configuration...")));
+        content = (React.createElement(InitializationStatusLine, { frameRows: frameRows, message: "Saving howto configuration...", color: "green" }));
+    }
+    else if (submitStatus === "error") {
+        content = (React.createElement(InitializationStatusLine, { frameRows: frameRows, message: `Error: ${errorMessage}`, color: "red" }));
     }
-    if (submitStatus === "error") {
-        return (React.createElement(Box, { flexDirection: "column", marginY: 1 },
-            React.createElement(Text, { color: "red" },
-                "Error: ",
-                errorMessage)));
+    else if (submitStatus === "cancelled") {
+        content = (React.createElement(InitializationStatusLine, { frameRows: frameRows, message: "Initialization cancelled.", dimColor: true }));
     }
-    if (submitStatus === "cancelled") {
-        return (React.createElement(Box, { flexDirection: "column", marginY: 1 },
-            React.createElement(Text, { dimColor: true }, "Initialization cancelled.")));
+    else if (state.step === "provider") {
+        content = React.createElement(ProviderStep, { selectedIndex: state.selectedIndex, frameRows: frameRows });
     }
-    if (state.step === "provider") {
-        return React.createElement(ProviderStep, { selectedIndex: state.selectedIndex });
+    else {
+        content = React.createElement(InputStep, { state: state, frameRows: frameRows });
     }
-    return React.createElement(InputStep, { state: state });
+    return (React.createElement(Box, { display: frameRows > 0 ? "flex" : "none", flexDirection: "column", maxHeight: frameRows, overflowX: "hidden", overflowY: "hidden" }, content));
 };
-const ProviderStep = ({ selectedIndex }) => {
+const ClippedLine = ({ children, color, dimColor = false, prefix, prefixWidth }) => (React.createElement(Box, { width: "100%", height: 1, maxHeight: 1, overflowX: "hidden", overflowY: "hidden" }, prefix === undefined ? (React.createElement(Text, { color: color, dimColor: dimColor }, children)) : (React.createElement(React.Fragment, null,
+    React.createElement(Box, { width: prefixWidth, flexShrink: 0 },
+        React.createElement(Text, { color: color, dimColor: dimColor }, prefix)),
+    React.createElement(Box, { flexGrow: 1, flexShrink: 1, minWidth: 1, height: 1, maxHeight: 1, overflowX: "hidden", overflowY: "hidden" },
+        React.createElement(Text, { color: color, dimColor: dimColor }, children))))));
+const ProviderStep = ({ selectedIndex, frameRows, }) => {
     const providers = getProviderOptions();
+    const selectedProvider = selectedIndex === null ? undefined : providers[selectedIndex];
+    const providerSelectionLine = selectedProvider === "openai"
+        ? "> openai 2 gemini"
+        : selectedProvider === "gemini"
+            ? "1 openai > gemini"
+            : "1 openai 2 gemini";
+    if (frameRows < RICH_LAYOUT_MIN_ROWS) {
+        if (frameRows === 1) {
+            const compactSelection = selectedProvider === "openai" ? "O" : selectedProvider === "gemini" ? "G" : "-";
+            return (React.createElement(Box, { height: 1, maxHeight: 1, overflowX: "hidden", overflowY: "hidden" },
+                React.createElement(Text, null, `O/G:${compactSelection} UD Ent 1/2 Esc`)));
+        }
+        if (frameRows <= 3) {
+            return (React.createElement(Box, { flexDirection: "column", height: frameRows, maxHeight: frameRows, overflowX: "hidden", overflowY: "hidden" },
+                frameRows === 3 && React.createElement(Text, { color: "green" }, "? Choose provider"),
+                React.createElement(ClippedLine, null, providerSelectionLine),
+                React.createElement(Text, { dimColor: true }, "UD Enter 1/2 Esc")));
+        }
+        return (React.createElement(Box, { flexDirection: "column", maxHeight: 4, overflowX: "hidden", overflowY: "hidden" },
+            React.createElement(ClippedLine, null, "howto needs an AI provider before it can call AI."),
+            React.createElement(ClippedLine, { color: "green" }, "? Choose provider"),
+            React.createElement(ClippedLine, null, providerSelectionLine),
+            React.createElement(ClippedLine, { dimColor: true }, "UD Enter 1/2 Esc")));
+    }
     return (React.createElement(Box, { flexDirection: "column", marginY: 1 },
         React.createElement(Text, null, "howto needs an AI provider before it can call AI."),
         React.createElement(Box, { height: 1 },
@@ -65,27 +126,109 @@ const ProviderStep = ({ selectedIndex }) => {
         React.createElement(Box, { flexShrink: 0, marginTop: 1 },
             React.createElement(Text, { dimColor: true }, "Use Up/Down or 1/2 to choose, Enter to continue, Esc or Ctrl+C to cancel."))));
 };
-const InputStep = ({ state, }) => {
+const InputStep = ({ state, frameRows }) => {
     const currentField = state.fields[state.fieldIndex];
+    const shortLabel = getShortFieldLabel(currentField);
+    if (frameRows < RICH_LAYOUT_MIN_ROWS) {
+        const fieldValue = getFieldValuePreview(currentField);
+        const fieldLine = `${shortLabel}: ${fieldValue}`;
+        const statusLine = state.errorMessage === undefined ? fieldLine : `! ${shortLabel} required`;
+        if (frameRows === 1) {
+            const compactField = state.errorMessage === undefined
+                ? `${shortLabel}:${getCompactFieldValuePreview(currentField)}`
+                : `!${shortLabel}:req`;
+            return (React.createElement(Box, { height: 1, maxHeight: 1, overflowX: "hidden", overflowY: "hidden" },
+                React.createElement(Box, { flexGrow: 1, flexShrink: 1, minWidth: 1, height: 1, maxHeight: 1, overflowX: "hidden", overflowY: "hidden" },
+                    React.createElement(Text, null, compactField)),
+                React.createElement(Box, { flexShrink: 0 },
+                    React.createElement(Text, { dimColor: true }, " Ent Esc ^C"))));
+        }
+        if (frameRows <= 3) {
+            return (React.createElement(Box, { flexDirection: "column", height: frameRows, maxHeight: frameRows, overflowX: "hidden", overflowY: "hidden" },
+                frameRows === 3 && (React.createElement(ClippedLine, { color: state.errorMessage === undefined ? "green" : "red" }, state.errorMessage === undefined ? `? Configure ${state.provider}` : statusLine)),
+                frameRows === 3 || state.errorMessage === undefined ? (React.createElement(ClippedLine, { prefix: `${shortLabel}:`, prefixWidth: shortLabel.length + 2 }, fieldValue)) : (React.createElement(ClippedLine, null, statusLine)),
+                React.createElement(Text, { dimColor: true }, "Ent next Esc back ^C")));
+        }
+        const defaultPreview = currentField.defaultValue !== undefined && currentField.value === ""
+            ? `Default: ${toSingleLinePreview(currentField.defaultValue)}`
+            : undefined;
+        const guidance = defaultPreview ?? getFullFieldGuidance(currentField);
+        return (React.createElement(Box, { flexDirection: "column", maxHeight: 4, overflowX: "hidden", overflowY: "hidden" },
+            React.createElement(ClippedLine, { color: state.errorMessage === undefined ? "green" : "red" }, state.errorMessage === undefined ? `? Configure ${state.provider}` : statusLine),
+            React.createElement(ClippedLine, { prefix: `${shortLabel}:`, prefixWidth: shortLabel.length + 2 }, fieldValue),
+            guidance !== undefined && React.createElement(ClippedLine, { dimColor: true }, guidance),
+            React.createElement(ClippedLine, { dimColor: true }, "Ent next Esc back ^C")));
+    }
     return (React.createElement(Box, { flexDirection: "column", marginY: 1 },
         React.createElement(Text, { color: "green" },
             "? Configure ",
             state.provider),
         React.createElement(Box, { flexDirection: "column", marginTop: 1 }, state.fields.map((field, index) => (React.createElement(FieldRow, { key: field.name, field: field, isActive: index === state.fieldIndex })))),
-        currentField.defaultValue !== undefined && currentField.value === "" && (React.createElement(Text, { dimColor: true },
-            "Default: ",
-            currentField.defaultValue)),
-        state.errorMessage !== undefined && React.createElement(Text, { color: "red" }, state.errorMessage),
+        getFullFieldGuidance(currentField) !== undefined && (React.createElement(ClippedLine, { dimColor: true }, getFullFieldGuidance(currentField))),
+        currentField.defaultValue !== undefined && currentField.value === "" && (React.createElement(ClippedLine, { dimColor: true, prefix: "Default:", prefixWidth: 9 }, toSingleLinePreview(currentField.defaultValue))),
+        state.errorMessage !== undefined && (React.createElement(ClippedLine, { color: "red" }, toSingleLinePreview(state.errorMessage))),
         React.createElement(Box, { flexShrink: 0, marginTop: 1 },
             React.createElement(Text, { dimColor: true }, "Press Enter for next value, Esc to go back, Ctrl+C to cancel."))));
 };
-const FieldRow = ({ field, isActive, }) => (React.createElement(Box, null,
-    React.createElement(Text, { color: isActive ? "cyan" : undefined }, isActive ? "> " : "  "),
-    React.createElement(Text, null,
-        field.label,
-        ": "),
-    React.createElement(Text, null, field.value),
-    isActive && React.createElement(Text, { backgroundColor: "white" }, " ")));
+const FieldRow = ({ field, isActive, }) => {
+    const shortLabel = getShortFieldLabel(field);
+    return (React.createElement(Box, { height: 1, maxHeight: 1, overflowX: "hidden", overflowY: "hidden" },
+        React.createElement(Box, { width: 2, flexShrink: 0 },
+            React.createElement(Text, { color: isActive ? "cyan" : undefined }, isActive ? "> " : "  ")),
+        React.createElement(Box, { width: shortLabel.length + 2, flexShrink: 0 },
+            React.createElement(Text, null,
+                shortLabel,
+                ":")),
+        React.createElement(Box, { flexShrink: 1, minWidth: 1, height: 1, maxHeight: 1, overflowX: "hidden", overflowY: "hidden" },
+            React.createElement(Text, null, toSingleLinePreview(field.value))),
+        isActive && (React.createElement(Box, { width: 1, flexShrink: 0 },
+            React.createElement(Text, { backgroundColor: "white" }, " ")))));
+};
+const InitializationStatusLine = ({ frameRows, message, color, dimColor = false }) => {
+    const status = (React.createElement(ClippedLine, { color: color, dimColor: dimColor }, toSingleLinePreview(message)));
+    if (frameRows < 4) {
+        return status;
+    }
+    return (React.createElement(Box, { flexDirection: "column", marginY: 1 }, status));
+};
+function getShortFieldLabel(field) {
+    switch (field.name) {
+        case "apiKey":
+            return "Key";
+        case "model":
+            return "Model";
+        case "openaiBaseUrl":
+            return "URL";
+    }
+}
+function getFullFieldGuidance(field) {
+    switch (field.name) {
+        case "apiKey":
+            return field.required ? "Required." : "Optional; empty allowed.";
+        case "model":
+            return undefined;
+        case "openaiBaseUrl":
+            return "Empty uses official OpenAI URL.";
+    }
+}
+function getFieldValuePreview(field) {
+    if (field.value !== "") {
+        return toSingleLinePreview(field.value);
+    }
+    if (field.defaultValue !== undefined) {
+        return toSingleLinePreview(field.defaultValue);
+    }
+    return field.required ? "<required>" : "<empty>";
+}
+function getCompactFieldValuePreview(field) {
+    if (field.value !== "") {
+        return toSingleLinePreview(field.value);
+    }
+    if (field.defaultValue !== undefined) {
+        return toSingleLinePreview(field.defaultValue);
+    }
+    return field.required ? "req" : "-";
+}
 function normalizeError(error) {
     if (error instanceof Error) {
         return error;