@outputai/cli 0.8.2-next.e1cd79b.0 → 0.8.2-next.e658cc2.0

package/dist/views/dev/modals/run_modal.js

@@ -9,26 +9,40 @@ import { startWorkflow } from '#views/dev/services/run_workflow.js';
 import { readScenario, writeScenario } from '#views/dev/services/scenario_io.js';
 import { JsonEditor } from '#views/dev/utils/json_editor.js';
 import { ModalFrame } from '#views/dev/modals/modal_frame.js';
-const CUSTOM_SEED = { '': '' };
 const SCENARIO_NAME_RE = /^[a-zA-Z0-9_-]+$/;
-const buildEntries = (scenarios) => {
+// Seed for a brand-new input — an empty "": "" pair reads friendlier than a bare {}.
+const CUSTOM_SEED = { '': '' };
+export const buildEntries = (scenarios) => {
     const list = scenarios.map(s => ({
         kind: 'scenario',
         label: s,
         scenarioName: s
     }));
-    list.push({ kind: 'custom', label: '[Create new scenario]' });
+    list.push({ kind: 'custom', label: '[Enter input]' });
     return list;
 };
+export const validateScenarioName = (raw, existing) => {
+    const name = raw.trim();
+    if (!name) {
+        return 'Scenario name cannot be empty.';
+    }
+    if (!SCENARIO_NAME_RE.test(name)) {
+        return 'Use letters, numbers, dashes, and underscores only.';
+    }
+    if (existing.includes(name)) {
+        return `A scenario named '${name}' already exists.`;
+    }
+    return null;
+};
 const SELECT_SHORTCUTS = [
     ['↑/↓', 'navigate'],
     ['enter', 'run'],
     ['d', 'duplicate'],
     ['esc', 'cancel']
 ];
-const NAME_SHORTCUTS = [
-    ['enter', 'next'],
-    ['esc', 'back']
+const SAVE_SHORTCUTS = [
+    ['enter', 'save & run'],
+    ['esc', 'back to editor']
 ];
 const ERROR_SHORTCUTS = [
     { key: 'enter', label: 'return' },
@@ -41,9 +55,11 @@ export const RunModal = ({ workflowName, workflowPath }) => {
     const entries = useMemo(() => buildEntries(scenarios), [scenarios]);
     const [mode, setMode] = useState('select');
     const [index, setIndex] = useState(0);
-    const [editName, setEditName] = useState('');
-    const [editSeed, setEditSeed] = useState(CUSTOM_SEED);
+    const [editSeed, setEditSeed] = useState({});
     const [editFrameTitle, setEditFrameTitle] = useState('');
+    const [defaultSaveName, setDefaultSaveName] = useState('');
+    const [editName, setEditName] = useState('');
+    const [pendingValue, setPendingValue] = useState(null);
     const [nameError, setNameError] = useState(null);
     const [errorMessage, setErrorMessage] = useState(null);
     const closeWith = (message, tone = 'info') => {
@@ -76,63 +92,55 @@ export const RunModal = ({ workflowName, workflowPath }) => {
             setMode('error');
         }
     };
+    // Custom + duplicate both open the editor first; saving a scenario is opt-in (ctrl+s).
+    const startCustom = () => {
+        setEditSeed(CUSTOM_SEED);
+        setDefaultSaveName('');
+        setEditFrameTitle('Enter input');
+        setMode('edit_content');
+    };
     const startDuplicate = async (scenarioName) => {
         try {
             const sourceContent = await readScenario(workflowName, scenarioName, workflowPath);
-            setEditName(`${scenarioName}_copy`);
             setEditSeed(sourceContent);
+            setDefaultSaveName(`${scenarioName}_copy`);
             setEditFrameTitle(`Duplicate '${scenarioName}'`);
-            setNameError(null);
-            setMode('edit_name');
+            setMode('edit_content');
         }
         catch (err) {
             setErrorMessage(err instanceof Error ? err.message : String(err));
             setMode('error');
         }
     };
-    const startCustom = () => {
-        setEditName('');
-        setEditSeed(CUSTOM_SEED);
-        setEditFrameTitle('New scenario');
-        setNameError(null);
-        setMode('edit_name');
+    // ctrl+r in the editor: run the payload as-is, nothing written to disk.
+    const runEphemeral = (value) => {
+        void submit(value, defaultSaveName || 'input');
     };
-    const validateName = (raw) => {
-        const name = raw.trim();
-        if (!name) {
-            return 'Scenario name cannot be empty.';
-        }
-        if (!SCENARIO_NAME_RE.test(name)) {
-            return 'Use letters, numbers, dashes, and underscores only.';
-        }
-        if (scenarios.includes(name)) {
-            return `A scenario named '${name}' already exists.`;
-        }
-        return null;
+    // ctrl+s in the editor: keep the payload and ask for a name before saving + running.
+    const beginSave = (value) => {
+        setPendingValue(value);
+        setEditSeed(value);
+        setEditName(defaultSaveName);
+        setNameError(null);
+        setMode('name_for_save');
     };
-    const handleEditorSubmit = async (value) => {
-        const name = editName.trim();
-        const writeError = validateName(editName);
-        if (writeError) {
-            setNameError(writeError);
-            setMode('edit_name');
+    const confirmSave = async () => {
+        const validationError = validateScenarioName(editName, scenarios);
+        if (validationError) {
+            setNameError(validationError);
             return;
         }
         setMode('submitting');
         try {
-            const writtenPath = await writeScenario(workflowName, name, value, workflowPath);
+            const writtenPath = await writeScenario(workflowName, editName.trim(), pendingValue, workflowPath);
             ui.pushToast(`Saved scenario at ${writtenPath}`, 'info');
-            await submit(value, name);
+            await submit(pendingValue, editName.trim());
         }
         catch (err) {
             setErrorMessage(err instanceof Error ? err.message : String(err));
             setMode('error');
         }
     };
-    const handleEditorCancel = () => {
-        // Bring the user back to the name step so they can adjust it or bail.
-        setMode('edit_name');
-    };
     useInput((input, key) => {
         if (mode === 'edit_content' || mode === 'submitting') {
             return;
@@ -168,19 +176,13 @@ export const RunModal = ({ workflowName, workflowPath }) => {
             }
             return;
         }
-        if (mode === 'edit_name') {
+        if (mode === 'name_for_save') {
             if (key.escape) {
-                setMode('select');
+                setMode('edit_content');
                 return;
             }
             if (key.return) {
-                const err = validateName(editName);
-                if (err) {
-                    setNameError(err);
-                    return;
-                }
-                setNameError(null);
-                setMode('edit_content');
+                void confirmSave();
                 return;
             }
             if (key.backspace || key.delete) {
@@ -206,12 +208,10 @@ export const RunModal = ({ workflowName, workflowPath }) => {
         }
     });
     if (mode === 'edit_content') {
-        return (_jsx(ModalFrame, { title: editFrameTitle, children: _jsx(JsonEditor, { seed: editSeed, title: `${editName}.json`, isActive: true, onSubmit: value => {
-                    void handleEditorSubmit(value);
-                }, onCancel: handleEditorCancel }) }));
+        return (_jsx(ModalFrame, { title: editFrameTitle, children: _jsx(JsonEditor, { seed: editSeed, title: defaultSaveName ? `${defaultSaveName}.json` : 'input', isActive: true, onSubmit: runEphemeral, onSave: beginSave, onCancel: () => setMode('select') }) }));
     }
-    if (mode === 'edit_name') {
-        return (_jsxs(ModalFrame, { title: editFrameTitle, shortcuts: NAME_SHORTCUTS, children: [_jsx(TextPrompt, { label: "Scenario name:", value: editName }), nameError ? (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "red", children: nameError }) })) : null] }));
+    if (mode === 'name_for_save') {
+        return (_jsxs(ModalFrame, { title: "Save & run", shortcuts: SAVE_SHORTCUTS, children: [_jsx(TextPrompt, { label: "Scenario name:", value: editName }), nameError ? (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "red", children: nameError }) })) : null] }));
     }
     if (mode === 'submitting') {
         return (_jsxs(ModalFrame, { title: `Run ${workflowName}`, children: [_jsx(Text, { color: "yellow", children: _jsx(Spinner, { type: "dots" }) }), _jsx(Text, { children: "\u00A0Starting workflow\u2026" })] }));
@@ -219,5 +219,5 @@ export const RunModal = ({ workflowName, workflowPath }) => {
     if (mode === 'error') {
         return (_jsx(ModalFrame, { title: `Run workflow "${workflowName}"`, shortcuts: ERROR_SHORTCUTS, children: _jsxs(Text, { color: "red", bold: true, children: ["\u2717 ", errorMessage ?? 'Something went wrong.'] }) }));
     }
-    return (_jsx(ModalFrame, { title: `Run ${workflowName}`, shortcuts: SELECT_SHORTCUTS, children: _jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsx(Text, { dimColor: true, children: scenarios.length === 0 ? 'No scenarios found. Create a new one:' : 'Select scenarios:' }), _jsx(Box, { flexDirection: "column", children: entries.map((entry, i) => (_jsxs(Box, { children: [_jsx(SelectionIndicator, { selected: i === index }), _jsxs(Text, { bold: i === index, children: ["\u00A0", entry.label] })] }, `${entry.kind}-${entry.scenarioName ?? i}`))) })] }) }));
+    return (_jsx(ModalFrame, { title: `Run ${workflowName}`, shortcuts: SELECT_SHORTCUTS, children: _jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsx(Text, { dimColor: true, children: scenarios.length === 0 ? 'No saved scenarios. Enter input to run:' : 'Select a scenario:' }), _jsx(Box, { flexDirection: "column", children: entries.map((entry, i) => (_jsxs(Box, { children: [_jsx(SelectionIndicator, { selected: i === index }), _jsxs(Text, { bold: i === index, children: ["\u00A0", entry.label] })] }, `${entry.kind}-${entry.scenarioName ?? i}`))) })] }) }));
 };

package/dist/views/dev/modals/run_modal.spec.d.ts

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

package/dist/views/dev/modals/run_modal.spec.js

@@ -0,0 +1,34 @@
+import { describe, expect, it } from 'vitest';
+import { buildEntries, validateScenarioName } from './run_modal.js';
+describe('buildEntries', () => {
+    it('lists scenarios then the custom-JSON entry', () => {
+        const entries = buildEntries(['basic', 'edge']);
+        expect(entries.map(e => e.label)).toEqual(['basic', 'edge', '[Enter input]']);
+        expect(entries[0]).toMatchObject({ kind: 'scenario', scenarioName: 'basic' });
+        expect(entries.at(-1)).toMatchObject({ kind: 'custom' });
+    });
+    it('offers the custom entry even with no saved scenarios', () => {
+        const entries = buildEntries([]);
+        expect(entries).toHaveLength(1);
+        expect(entries[0].kind).toBe('custom');
+    });
+});
+describe('validateScenarioName', () => {
+    it('rejects empty or whitespace-only names', () => {
+        expect(validateScenarioName('', [])).toMatch(/cannot be empty/);
+        expect(validateScenarioName('   ', [])).toMatch(/cannot be empty/);
+    });
+    it('rejects names with unsupported characters', () => {
+        expect(validateScenarioName('has space', [])).toMatch(/letters, numbers/);
+        expect(validateScenarioName('bad/name', [])).toMatch(/letters, numbers/);
+    });
+    it('rejects names that already exist', () => {
+        expect(validateScenarioName('basic', ['basic'])).toMatch(/already exists/);
+    });
+    it('trims before checking for duplicates', () => {
+        expect(validateScenarioName('  basic  ', ['basic'])).toMatch(/already exists/);
+    });
+    it('accepts a unique name with allowed characters', () => {
+        expect(validateScenarioName('edge_case-1', ['basic'])).toBeNull();
+    });
+});

package/dist/views/dev/panels/help_panel.js

@@ -10,7 +10,7 @@ const DOCS_URL = 'https://docs.output.ai';
 export const Section = ({ children, title, direction = 'v' }) => (_jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsx(Text, { bold: true, children: title }), _jsx(Box, { flexDirection: direction === 'v' ? 'column' : 'row', gap: 1, flexWrap: 'wrap', children: children })] }));
 export const SubSection = ({ children, title }) => (_jsxs(Box, { flexDirection: "column", gap: 1, borderStyle: "single", borderColor: "blackBright", paddingLeft: 1, paddingRight: 1, children: [_jsx(Text, { italic: true, dimColor: true, children: title }), _jsx(Box, { flexDirection: "column", children: children })] }));
 const KV = ({ label, value }) => (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 26, children: _jsx(Text, { children: label }) }), _jsx(Text, { bold: true, children: value })] }));
-const RunFromCli = () => (_jsxs(Section, { title: "Running a workflow", children: [_jsxs(SubSection, { title: "From the CLI", children: [_jsx(InlineSnippet, { content: "npx output workflow run blog_evaluator paulgraham_hwh" }), _jsx(InlineSnippet, { content: 'npx output workflow run simple --input {"values":[1,2,3]}' }), _jsx(InlineSnippet, { content: "npx output workflow run simple --input scenario.json" })] }), _jsxs(SubSection, { title: "From the TUI", children: [_jsxs(Text, { children: ["Open Workflows tab, hover a workflow, press ", _jsx(Text, { bold: true, children: "r" }), "."] }), _jsx(Text, { children: "Create a custom input from the TUI using the editor with live JSON validation or select an existing scenario." })] })] }));
+const RunFromCli = () => (_jsxs(Section, { title: "Running a workflow", children: [_jsxs(SubSection, { title: "From the CLI", children: [_jsx(InlineSnippet, { content: "npx output workflow run blog_evaluator paulgraham_hwh" }), _jsx(InlineSnippet, { content: 'npx output workflow run simple --input {"values":[1,2,3]}' }), _jsx(InlineSnippet, { content: "npx output workflow run simple --input scenario.json" })] }), _jsxs(SubSection, { title: "From the TUI", children: [_jsxs(Text, { children: ["Open Workflows tab, hover a workflow, press ", _jsx(Text, { bold: true, children: "r" }), "."] }), _jsx(Text, { children: "Pick a saved scenario, or edit JSON with live validation." }), _jsxs(Text, { children: ["Press ", _jsx(Text, { bold: true, children: "ctrl+r" }), " to run as-is, or ", _jsx(Text, { bold: true, children: "ctrl+s" }), " to save it as a scenario first."] })] })] }));
 const ServiceUrls = () => (_jsx(Section, { title: "Service URLs", children: _jsxs(SubSection, { title: "Where the services are available", children: [_jsx(KV, { label: "Temporal gRPC", value: "localhost:7233" }), _jsx(KV, { label: "Temporal UI", value: "http://localhost:8080" }), _jsx(KV, { label: "API server", value: "localhost:3001" }), _jsx(KV, { label: "Redis", value: "localhost:6379" })] }) }));
 const UpdatingMigrating = () => (_jsxs(Section, { title: "Updating / Migrating", children: [_jsxs(SubSection, { title: "Update", children: [_jsx(Text, { wrap: "wrap", children: "Update the CLI to the latest published version:" }), _jsx(InlineSnippet, { content: "output update" })] }), _jsxs(SubSection, { title: "Migrate", children: [_jsx(Text, { wrap: "wrap", children: "Migrate a workflow project to the SDK version this CLI ships with:" }), _jsx(InlineSnippet, { content: "output migrate" }), _jsx(Text, { wrap: "wrap", children: "The migration walks `package.json` and project files, updates `@outputai/*` deps, and applies any code-mod steps the SDK ships with the new version." })] })] }));
 const ClaudePlugins = () => (_jsx(Section, { title: "Claude Plugins", children: _jsxs(SubSection, { title: "Reinstall", children: [_jsx(Text, { wrap: "wrap", children: "Command `output init` already installs the Claude Code plugins (skills, commands, agents) into your project during scaffolding." }), _jsx(Text, { wrap: "wrap", children: "But if it is necessary to reinstall it, use the update command:" }), _jsx(InlineSnippet, { content: "output update --agents" }), _jsx(Text, { children: "This pulls the latest plugin bundle that ships with the installed CLI version." })] }) }));

package/dist/views/dev/utils/json_editor.d.ts

@@ -11,11 +11,13 @@ export declare const tryParseJson: (text: string) => {
     ok: false;
     error: string;
 };
+export declare const initialCursor: (buffer: string) => number;
 export declare const JsonEditor: React.FC<{
     seed: unknown;
     title: string;
     isActive?: boolean;
     onSubmit: (value: unknown) => void;
+    onSave?: (value: unknown) => void;
     onCancel: () => void;
 }>;
 export {};

package/dist/views/dev/utils/json_editor.js

@@ -25,11 +25,17 @@ export const tryParseJson = (text) => {
         return { ok: false, error: err instanceof Error ? err.message : String(err) };
     }
 };
+// Start the cursor inside the first empty "" pair (e.g. the key of a fresh `{ "": "" }`
+// seed) so the user can type immediately; otherwise sit at the end of the buffer.
+export const initialCursor = (buffer) => {
+    const emptyPair = buffer.indexOf('""');
+    return emptyPair === -1 ? buffer.length : emptyPair + 1;
+};
 const VISIBLE_BUFFER = 6;
-export const JsonEditor = ({ seed, title, isActive = true, onSubmit, onCancel }) => {
+export const JsonEditor = ({ seed, title, isActive = true, onSubmit, onSave, onCancel }) => {
     const initial = JSON.stringify(seed ?? {}, null, 2);
     const [buffer, setBuffer] = useState(initial);
-    const [cursor, setCursor] = useState(initial.length);
+    const [cursor, setCursor] = useState(() => initialCursor(initial));
     const [status, setStatus] = useState(() => tryParseJson(initial));
     const [submitMessage, setSubmitMessage] = useState(null);
     useEffect(() => {
@@ -46,23 +52,30 @@ export const JsonEditor = ({ seed, title, isActive = true, onSubmit, onCancel })
         setBuffer(b => b.slice(0, cursor - 1) + b.slice(cursor));
         setCursor(c => Math.max(0, c - 1));
     };
+    const commit = (handler) => {
+        const parsed = tryParseJson(buffer);
+        if (!parsed.ok) {
+            setSubmitMessage(`Invalid JSON — ${parsed.error}`);
+            return;
+        }
+        try {
+            handler(JSON.parse(buffer));
+        }
+        catch (err) {
+            setSubmitMessage(err instanceof Error ? err.message : String(err));
+        }
+    };
     useInput((input, key) => {
         if (key.escape) {
             onCancel();
             return;
         }
-        if (key.ctrl && input === 's') {
-            const parsed = tryParseJson(buffer);
-            if (!parsed.ok) {
-                setSubmitMessage(`Cannot submit — ${parsed.error}`);
-                return;
-            }
-            try {
-                onSubmit(JSON.parse(buffer));
-            }
-            catch (err) {
-                setSubmitMessage(err instanceof Error ? err.message : String(err));
-            }
+        if (key.ctrl && input === 'r') {
+            commit(onSubmit);
+            return;
+        }
+        if (key.ctrl && input === 's' && onSave) {
+            commit(onSave);
             return;
         }
         if (key.return) {
@@ -113,5 +126,5 @@ export const JsonEditor = ({ seed, title, isActive = true, onSubmit, onCancel })
                     const at = line[cursorPos.col] ?? ' ';
                     const after = line.slice(cursorPos.col + 1);
                     return (_jsxs(Text, { bold: true, children: [_jsx(Text, { children: before }), _jsx(Text, { inverse: true, children: at }), _jsx(Text, { children: after })] }, lineIdx));
-                }) }), !status.ok && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "red", wrap: "truncate-end", children: status.error }) })), submitMessage && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "yellow", children: submitMessage }) })), _jsxs(Box, { marginTop: 1, columnGap: 2, children: [_jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "ctrl+s" }), _jsx(Text, { dimColor: true, children: "submit" })] }), _jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "esc" }), _jsx(Text, { dimColor: true, children: "cancel" })] }), _jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "\u2191\u2193\u2190\u2192" }), _jsx(Text, { dimColor: true, children: "move" })] }), _jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "tab" }), _jsx(Text, { dimColor: true, children: "indent" })] })] })] }));
+                }) }), !status.ok && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "red", wrap: "truncate-end", children: status.error }) })), submitMessage && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "yellow", children: submitMessage }) })), _jsxs(Box, { marginTop: 1, columnGap: 2, children: [_jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "ctrl+r" }), _jsx(Text, { dimColor: true, children: "run" })] }), onSave ? (_jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "ctrl+s" }), _jsx(Text, { dimColor: true, children: "save & run" })] })) : null, _jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "esc" }), _jsx(Text, { dimColor: true, children: "cancel" })] }), _jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "\u2191\u2193\u2190\u2192" }), _jsx(Text, { dimColor: true, children: "move" })] }), _jsxs(Box, { columnGap: 1, children: [_jsx(Text, { bold: true, children: "tab" }), _jsx(Text, { dimColor: true, children: "indent" })] })] })] }));
 };

package/dist/views/dev/utils/json_editor.spec.js

@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { cursorToPosition, positionToCursor, tryParseJson } from './json_editor.js';
+import { cursorToPosition, initialCursor, positionToCursor, tryParseJson } from './json_editor.js';
 describe('cursorToPosition', () => {
     it('returns line 0 col 0 for an empty buffer', () => {
         expect(cursorToPosition('', 0)).toEqual({ line: 0, col: 0 });
@@ -55,3 +55,18 @@ describe('tryParseJson', () => {
         }
     });
 });
+describe('initialCursor', () => {
+    it('lands inside the first empty "" pair so typing starts there', () => {
+        const buffer = JSON.stringify({ '': '' }, null, 2); // {\n  "": ""\n}
+        const cursor = initialCursor(buffer);
+        expect(cursor).toBe(buffer.indexOf('""') + 1);
+        expect(buffer[cursor - 1]).toBe('"');
+    });
+    it('falls back to the end when there is no empty pair', () => {
+        const buffer = JSON.stringify({ values: [1, 2, 3] }, null, 2);
+        expect(initialCursor(buffer)).toBe(buffer.length);
+    });
+    it('returns 0 for an empty buffer', () => {
+        expect(initialCursor('')).toBe(0);
+    });
+});