ralph-cli-sandboxed 0.4.0 → 0.4.2

package/dist/tui/ConfigEditor.js

@@ -11,6 +11,8 @@ import { ArrayEditor } from "./components/ArrayEditor.js";
 import { ObjectEditor } from "./components/ObjectEditor.js";
 import { KeyValueEditor } from "./components/KeyValueEditor.js";
 import { JsonSnippetEditor } from "./components/JsonSnippetEditor.js";
+import { LLMProvidersEditor } from "./components/LLMProvidersEditor.js";
+import { RespondersEditor } from "./components/RespondersEditor.js";
 import { Preview } from "./components/Preview.js";
 import { HelpPanel } from "./components/HelpPanel.js";
 import { PresetSelector } from "./components/PresetSelector.js";
@@ -41,7 +43,7 @@ function setValueAtPath(obj, path, value) {
 export function ConfigEditor() {
     const { exit } = useApp();
     const terminalSize = useTerminalSize();
-    const { config, loading, error, hasChanges, saveConfig, updateConfig, } = useConfig();
+    const { config, loading, error, hasChanges, saveConfig, updateConfig } = useConfig();
     // Calculate available height for scrollable content
     // Reserve lines for: header (2), status message (1), footer (2), borders (2)
     const availableHeight = Math.max(8, terminalSize.rows - 7);
@@ -272,17 +274,48 @@ export function ConfigEditor() {
                 for (const [k, v] of Object.entries(objValue)) {
                     stringEntries[k] = typeof v === "string" ? v : JSON.stringify(v);
                 }
+                // Check if this is the llmProviders field
+                const isLLMProviders = selectedField === "llmProviders";
+                if (isLLMProviders) {
+                    return (_jsx(LLMProvidersEditor, { label: currentFieldLabel, providers: currentFieldValue || {}, onConfirm: handleFieldConfirm, onCancel: handleFieldCancel, isFocused: true, maxHeight: editorMaxHeight }));
+                }
+                // Check if this is the chat.responders field
+                const isResponders = selectedField === "chat.responders";
+                if (isResponders) {
+                    return (_jsx(RespondersEditor, { label: currentFieldLabel, responders: currentFieldValue || {}, onConfirm: handleFieldConfirm, onCancel: handleFieldCancel, isFocused: true, maxHeight: editorMaxHeight }));
+                }
                 // Check if this is a notification provider config field
                 const isNotificationProvider = selectedField &&
                     (selectedField === "notifications.ntfy" ||
                         selectedField === "notifications.pushover" ||
                         selectedField === "notifications.gotify");
-                if (isNotificationProvider) {
+                // Check if this is a chat provider config field
+                const isChatProvider = selectedField && (selectedField === "chat.slack" || selectedField === "chat.telegram");
+                if (isNotificationProvider || isChatProvider) {
                     // Extract provider name from field path
                     const providerName = selectedField.split(".").pop() || "";
                     return (_jsx(KeyValueEditor, { label: currentFieldLabel, entries: stringEntries, providerName: providerName, onConfirm: (entries) => {
-                            // For notification providers, keep values as strings
-                            handleFieldConfirm(entries);
+                            // Parse back array values (like allowedChatIds, allowedChannelIds)
+                            const parsedEntries = {};
+                            for (const [k, v] of Object.entries(entries)) {
+                                // Check if this looks like a JSON array or object
+                                if (v.startsWith("[") || v.startsWith("{")) {
+                                    try {
+                                        parsedEntries[k] = JSON.parse(v);
+                                    }
+                                    catch {
+                                        parsedEntries[k] = v;
+                                    }
+                                }
+                                else if (v === "true" || v === "false") {
+                                    // Parse boolean values
+                                    parsedEntries[k] = v === "true";
+                                }
+                                else {
+                                    parsedEntries[k] = v;
+                                }
+                            }
+                            handleFieldConfirm(parsedEntries);
                         }, onCancel: handleFieldCancel, isFocused: true }));
                 }
                 return (_jsx(ObjectEditor, { label: currentFieldLabel, entries: stringEntries, onConfirm: (entries) => {
@@ -308,6 +341,10 @@ export function ConfigEditor() {
                 return (_jsx(StringEditor, { label: currentFieldLabel, value: String(currentFieldValue || ""), onConfirm: handleFieldConfirm, onCancel: handleFieldCancel, isFocused: true }));
         }
     };
-    return (_jsxs(Box, { flexDirection: "column", children: [helpVisible && (_jsx(HelpPanel, { visible: helpVisible, onClose: toggleHelp })), _jsxs(Box, { marginBottom: 1, justifyContent: "space-between", children: [_jsxs(Box, { children: [_jsx(Text, { color: "cyan", bold: true, children: "ralph config" }), hasChanges && _jsx(Text, { color: "yellow", children: " (unsaved changes)" })] }), _jsxs(Box, { children: [_jsx(Text, { dimColor: true, children: "[S] Save" }), _jsx(Text, { dimColor: true, children: " | " }), _jsx(Text, { dimColor: true, children: "[Q] Quit" }), _jsx(Text, { dimColor: true, children: " | " }), _jsx(Text, { dimColor: true, children: "[?] Help" })] })] }), statusMessage && (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: statusMessage.includes("Failed") || statusMessage.includes("Validation") ? "red" : "green", children: statusMessage }) })), focusPane === "field-editor" ? (_jsx(Box, { children: renderFieldEditor() })) : focusPane === "preset-selector" ? (_jsx(Box, { children: _jsx(PresetSelector, { sectionId: selectedSection, config: config, onSelectPreset: handleSelectPreset, onSkip: handleSkipPreset, onCancel: handleCancelPreset, isFocused: true }) })) : (_jsxs(Box, { children: [_jsx(Box, { width: 20, children: _jsx(SectionNav, { selectedSection: selectedSection, onSelectSection: handleSelectSection, isFocused: focusPane === "nav", maxHeight: navMaxHeight }) }), _jsx(Box, { flexGrow: 1, children: _jsx(EditorPanel, { config: config, selectedSection: selectedSection, selectedField: selectedField, onSelectField: handleSelectField, onBack: handleBack, isFocused: focusPane === "editor", validationErrors: validationErrors, maxHeight: editorMaxHeight }) }), _jsx(Preview, { config: config, selectedSection: selectedSection, visible: previewVisible })] })), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: [focusPane === "nav" && "j/k: navigate | Enter: select | l/→: editor | Tab: toggle preview", focusPane === "editor" && "j/k: navigate | Enter: edit | J: JSON | h/←: nav | Tab: preview | p: presets", focusPane === "field-editor" && "Follow editor hints", focusPane === "preset-selector" && "j/k: navigate | Enter: select | Esc: back"] }) })] }));
+    return (_jsxs(Box, { flexDirection: "column", children: [helpVisible && _jsx(HelpPanel, { visible: helpVisible, onClose: toggleHelp }), _jsxs(Box, { marginBottom: 1, justifyContent: "space-between", children: [_jsxs(Box, { children: [_jsx(Text, { color: "cyan", bold: true, children: "ralph config" }), hasChanges && _jsx(Text, { color: "yellow", children: " (unsaved changes)" })] }), _jsxs(Box, { children: [_jsx(Text, { dimColor: true, children: "[S] Save" }), _jsx(Text, { dimColor: true, children: " | " }), _jsx(Text, { dimColor: true, children: "[Q] Quit" }), _jsx(Text, { dimColor: true, children: " | " }), _jsx(Text, { dimColor: true, children: "[?] Help" })] })] }), statusMessage && (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: statusMessage.includes("Failed") || statusMessage.includes("Validation")
+                        ? "red"
+                        : "green", children: statusMessage }) })), focusPane === "field-editor" ? (_jsx(Box, { children: renderFieldEditor() })) : focusPane === "preset-selector" ? (_jsx(Box, { children: _jsx(PresetSelector, { sectionId: selectedSection, config: config, onSelectPreset: handleSelectPreset, onSkip: handleSkipPreset, onCancel: handleCancelPreset, isFocused: true }) })) : (_jsxs(Box, { children: [_jsx(Box, { width: 20, children: _jsx(SectionNav, { selectedSection: selectedSection, onSelectSection: handleSelectSection, isFocused: focusPane === "nav", maxHeight: navMaxHeight }) }), _jsx(Box, { flexGrow: 1, children: _jsx(EditorPanel, { config: config, selectedSection: selectedSection, selectedField: selectedField, onSelectField: handleSelectField, onBack: handleBack, isFocused: focusPane === "editor", validationErrors: validationErrors, maxHeight: editorMaxHeight }) }), _jsx(Preview, { config: config, selectedSection: selectedSection, visible: previewVisible })] })), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: [focusPane === "nav" &&
+                            "j/k: navigate | Enter: select | l/→: editor | Tab: toggle preview", focusPane === "editor" &&
+                            "j/k: navigate | Enter: edit | J: JSON | h/←: nav | Tab: preview | p: presets", focusPane === "field-editor" && "Follow editor hints", focusPane === "preset-selector" && "j/k: navigate | Enter: select | Esc: back"] }) })] }));
 }
 export default ConfigEditor;

package/dist/tui/components/ArrayEditor.js

@@ -177,7 +177,7 @@ export function ArrayEditor({ label, items, onConfirm, onCancel, isFocused = tru
         return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { bold: true, color: "cyan", children: mode === "add" ? "Add New Item" : `Edit Item ${editingIndex + 1}` }) }), _jsxs(Box, { children: [_jsxs(Text, { dimColor: true, children: [">", " "] }), _jsx(TextInput, { value: editText, onChange: setEditText, onSubmit: handleTextSubmit, focus: isFocused })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "Enter: confirm | Esc: cancel" }) })] }));
     }
     // Render list mode
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsxs(Text, { bold: true, color: "cyan", children: ["Edit: ", label] }), _jsxs(Text, { dimColor: true, children: [" (", editItems.length, " items)"] }), hasOverflow && (_jsxs(Text, { dimColor: true, children: [" [", highlightedIndex + 1, "/", totalOptions, "]"] }))] }), hasOverflow && (_jsx(Box, { children: _jsx(Text, { color: canScrollUp ? "cyan" : "gray", dimColor: !canScrollUp, children: canScrollUp ? "  ▲ more" : "" }) })), editItems.length === 0 && scrollOffset === 0 ? (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { dimColor: true, italic: true, children: "No items" }) })) : (visibleItems.map((item, visibleIndex) => {
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsxs(Text, { bold: true, color: "cyan", children: ["Edit: ", label] }), _jsxs(Text, { dimColor: true, children: [" (", editItems.length, " items)"] }), hasOverflow && (_jsxs(Text, { dimColor: true, children: [" ", "[", highlightedIndex + 1, "/", totalOptions, "]"] }))] }), hasOverflow && (_jsx(Box, { children: _jsx(Text, { color: canScrollUp ? "cyan" : "gray", dimColor: !canScrollUp, children: canScrollUp ? "  ▲ more" : "" }) })), editItems.length === 0 && scrollOffset === 0 ? (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { dimColor: true, italic: true, children: "No items" }) })) : (visibleItems.map((item, visibleIndex) => {
                 // Check if this is the "Add item" option
                 if (typeof item === "object" && "isAddOption" in item) {
                     const actualIndex = editItems.length;

package/dist/tui/components/EditorPanel.js

@@ -213,7 +213,7 @@ export function EditorPanel({ config, selectedSection, selectedField, onSelectFi
     if (!currentSection || fields.length === 0) {
         return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 1, flexGrow: 1, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { bold: true, color: "cyan", children: breadcrumb }) }), _jsx(Text, { dimColor: true, children: "No fields in this section" })] }));
     }
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 1, flexGrow: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { bold: true, color: "cyan", children: breadcrumb }), hasOverflow && (_jsxs(Text, { dimColor: true, children: [" (", highlightedIndex + 1, "/", totalFields, ")"] }))] }), hasOverflow && (_jsx(Box, { children: _jsx(Text, { color: canScrollUp ? "cyan" : "gray", dimColor: !canScrollUp, children: canScrollUp ? "▲ more" : "" }) })), visibleFields.map((field) => {
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 1, flexGrow: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { bold: true, color: "cyan", children: breadcrumb }), hasOverflow && (_jsxs(Text, { dimColor: true, children: [" ", "(", highlightedIndex + 1, "/", totalFields, ")"] }))] }), hasOverflow && (_jsx(Box, { children: _jsx(Text, { color: canScrollUp ? "cyan" : "gray", dimColor: !canScrollUp, children: canScrollUp ? "▲ more" : "" }) })), visibleFields.map((field) => {
                 const actualIndex = fields.findIndex((f) => f.path === field.path);
                 const isHighlighted = actualIndex === highlightedIndex;
                 const value = getValueAtPath(config, field.path);
@@ -221,12 +221,16 @@ export function EditorPanel({ config, selectedSection, selectedField, onSelectFi
                 const fieldHasError = hasFieldError(validationErrors, field.path);
                 const fieldErrors = getFieldErrors(validationErrors, field.path);
                 // Color based on field type, but red if there's an error
-                const typeColor = fieldHasError ? "red"
-                    : field.type === "array" ? "yellow"
-                        : field.type === "object" ? "magenta"
-                            : field.type === "boolean" ? "blue"
+                const typeColor = fieldHasError
+                    ? "red"
+                    : field.type === "array"
+                        ? "yellow"
+                        : field.type === "object"
+                            ? "magenta"
+                            : field.type === "boolean"
+                                ? "blue"
                                 : undefined;
-                return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: isHighlighted ? "cyan" : fieldHasError ? "red" : undefined, children: isHighlighted ? "▸ " : fieldHasError ? "✗ " : "  " }), _jsx(Text, { bold: isHighlighted, color: fieldHasError ? "red" : isHighlighted ? "cyan" : undefined, inverse: isHighlighted, children: field.label }), _jsx(Text, { dimColor: true, children: ": " }), _jsx(Text, { color: typeColor, dimColor: value === undefined || value === null, children: displayValue }), (field.type === "array" || field.type === "object") && (_jsx(Text, { dimColor: true, children: " \u2192" }))] }), fieldHasError && fieldErrors.length > 0 && (_jsx(Box, { marginLeft: 4, children: _jsx(Text, { color: "red", dimColor: true, children: fieldErrors[0].message }) }))] }, field.path));
+                return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: isHighlighted ? "cyan" : fieldHasError ? "red" : undefined, children: isHighlighted ? "▸ " : fieldHasError ? "✗ " : "  " }), _jsx(Text, { bold: isHighlighted, color: fieldHasError ? "red" : isHighlighted ? "cyan" : undefined, inverse: isHighlighted, children: field.label }), _jsx(Text, { dimColor: true, children: ": " }), _jsx(Text, { color: typeColor, dimColor: value === undefined || value === null, children: displayValue }), (field.type === "array" || field.type === "object") && _jsx(Text, { dimColor: true, children: " \u2192" })] }), fieldHasError && fieldErrors.length > 0 && (_jsx(Box, { marginLeft: 4, children: _jsx(Text, { color: "red", dimColor: true, children: fieldErrors[0].message }) }))] }, field.path));
             }), hasOverflow && (_jsx(Box, { children: _jsx(Text, { color: canScrollDown ? "cyan" : "gray", dimColor: !canScrollDown, children: canScrollDown ? "▼ more" : "" }) })), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: ["j/k: navigate | Enter: edit | J: edit as JSON", hasOverflow && " | PgUp/Dn: scroll", " | Esc: back"] }) })] }));
 }
 export default EditorPanel;

package/dist/tui/components/HelpPanel.d.ts

@@ -9,5 +9,5 @@ export interface HelpPanelProps {
  * HelpPanel displays all keyboard shortcuts for the config editor.
  * Toggle with the ? key.
  */
-export declare function HelpPanel({ visible, onClose, }: HelpPanelProps): React.ReactElement | null;
+export declare function HelpPanel({ visible, onClose }: HelpPanelProps): React.ReactElement | null;
 export default HelpPanel;

package/dist/tui/components/HelpPanel.js

@@ -54,7 +54,7 @@ const SHORTCUT_GROUPS = [
  * HelpPanel displays all keyboard shortcuts for the config editor.
  * Toggle with the ? key.
  */
-export function HelpPanel({ visible, onClose, }) {
+export function HelpPanel({ visible, onClose }) {
     // Handle keyboard input to close help
     useInput((input, key) => {
         if (input === "?" || key.escape) {

package/dist/tui/components/JsonSnippetEditor.js

@@ -75,13 +75,16 @@ function validateJsonStructure(value, label) {
             if (serverConfig.args && !Array.isArray(serverConfig.args)) {
                 warnings.push(`Server "${name}": "args" should be an array`);
             }
-            if (serverConfig.env && (typeof serverConfig.env !== "object" || Array.isArray(serverConfig.env))) {
+            if (serverConfig.env &&
+                (typeof serverConfig.env !== "object" || Array.isArray(serverConfig.env))) {
                 warnings.push(`Server "${name}": "env" should be an object`);
             }
         }
     }
     // Daemon Actions validation
-    if (label.toLowerCase().includes("action") && typeof value === "object" && !Array.isArray(value)) {
+    if (label.toLowerCase().includes("action") &&
+        typeof value === "object" &&
+        !Array.isArray(value)) {
         const actions = value;
         for (const [name, config] of Object.entries(actions)) {
             if (typeof config !== "object" || config === null) {
@@ -227,7 +230,7 @@ function highlightJson(json, maxLines, maxLineWidth = 60) {
         elements.push(_jsxs(Box, { children: [_jsxs(Text, { dimColor: true, children: [lineNum, " "] }), tokens] }, i));
     }
     if (hasMore) {
-        elements.push(_jsx(Box, { children: _jsxs(Text, { dimColor: true, children: ["    ... (", lines.length - maxLines, " more lines)"] }) }, "more"));
+        elements.push(_jsx(Box, { children: _jsxs(Text, { dimColor: true, children: [" ... (", lines.length - maxLines, " more lines)"] }) }, "more"));
     }
     return elements;
 }
@@ -373,8 +376,8 @@ export function JsonSnippetEditor({ label, value, onConfirm, onCancel, isFocused
     // Account for border (2) and padding (2) when calculating preview width
     const previewWidth = Math.max(40, maxWidth - 4);
     const previewLines = highlightJson(editText, previewMaxLines, previewWidth);
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsxs(Box, { marginBottom: 1, justifyContent: "space-between", children: [_jsxs(Text, { bold: true, color: "cyan", children: ["Edit as JSON: ", label] }), copied && _jsx(Text, { color: "green", children: " Copied!" })] }), _jsx(Box, { flexDirection: "column", marginBottom: 1, children: previewLines }), _jsx(Box, { marginBottom: 1, flexDirection: "column", children: parseError ? (_jsx(Box, { children: _jsxs(Text, { color: "red", bold: true, children: ["Error: ", parseError.line && parseError.column
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsxs(Box, { marginBottom: 1, justifyContent: "space-between", children: [_jsxs(Text, { bold: true, color: "cyan", children: ["Edit as JSON: ", label] }), copied && _jsx(Text, { color: "green", children: " Copied!" })] }), _jsx(Box, { flexDirection: "column", marginBottom: 1, children: previewLines }), _jsx(Box, { marginBottom: 1, flexDirection: "column", children: parseError ? (_jsx(Box, { children: _jsxs(Text, { color: "red", bold: true, children: ["Error:", " ", parseError.line && parseError.column
                                 ? `Line ${parseError.line}:${parseError.column} - `
-                                : "", parseError.message] }) })) : warningCount > 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: "yellow", bold: true, children: [warningCount, " warning", warningCount > 1 ? "s" : "", ":"] }), warnings.slice(0, 3).map((w, i) => (_jsxs(Text, { color: "yellow", dimColor: true, children: [" - ", w] }, i))), warningCount > 3 && (_jsxs(Text, { dimColor: true, children: [" ... and ", warningCount - 3, " more"] }))] })) : (_jsx(Text, { color: "green", children: "Valid JSON" })) }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { dimColor: true, children: "e/Enter: edit | s: save | c: copy | f: format" }), _jsx(Text, { dimColor: true, children: "j/k: scroll | PgUp/Dn: page | Esc: cancel" })] })] }));
+                                : "", parseError.message] }) })) : warningCount > 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: "yellow", bold: true, children: [warningCount, " warning", warningCount > 1 ? "s" : "", ":"] }), warnings.slice(0, 3).map((w, i) => (_jsxs(Text, { color: "yellow", dimColor: true, children: [" ", "- ", w] }, i))), warningCount > 3 && _jsxs(Text, { dimColor: true, children: [" ... and ", warningCount - 3, " more"] })] })) : (_jsx(Text, { color: "green", children: "Valid JSON" })) }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { dimColor: true, children: "e/Enter: edit | s: save | c: copy | f: format" }), _jsx(Text, { dimColor: true, children: "j/k: scroll | PgUp/Dn: page | Esc: cancel" })] })] }));
 }
 export default JsonSnippetEditor;

package/dist/tui/components/KeyValueEditor.js

@@ -24,6 +24,70 @@ export const PROVIDER_HINTS = {
         { key: "token", description: "Gotify app token", required: true },
         { key: "priority", description: "Message priority (0-10)" },
     ],
+    // Chat provider hints
+    slack: [
+        {
+            key: "botToken",
+            description: "Slack Bot Token (xoxb-...) from OAuth & Permissions",
+            required: true,
+        },
+        {
+            key: "appToken",
+            description: "Slack App Token (xapp-...) from Basic Information > App-Level Tokens",
+            required: true,
+        },
+        {
+            key: "signingSecret",
+            description: "Slack Signing Secret from Basic Information > App Credentials",
+            required: true,
+        },
+        { key: "allowedChannelIds", description: "Only respond in these channel IDs (security)" },
+        { key: "enabled", description: "Enable/disable Slack integration" },
+    ],
+    telegram: [
+        { key: "botToken", description: "Telegram Bot API token from @BotFather", required: true },
+        { key: "allowedChatIds", description: "Only respond in these chat IDs (security)" },
+        { key: "enabled", description: "Enable/disable Telegram integration" },
+    ],
+    discord: [
+        {
+            key: "botToken",
+            description: "Discord Bot Token from Developer Portal > Bot > Token",
+            required: true,
+        },
+        { key: "allowedGuildIds", description: "Only respond in these server/guild IDs (security)" },
+        { key: "allowedChannelIds", description: "Only respond in these channel IDs (security)" },
+        { key: "enabled", description: "Enable/disable Discord integration" },
+    ],
+    // LLM provider hints
+    anthropic: [
+        { key: "type", description: "Provider type (anthropic)", required: true },
+        {
+            key: "model",
+            description: "Model name (e.g., claude-sonnet-4-20250514, claude-opus-4-20250514)",
+            required: true,
+        },
+        { key: "apiKey", description: "API key (defaults to ANTHROPIC_API_KEY env var)" },
+        { key: "baseUrl", description: "Custom API base URL (optional)" },
+    ],
+    openai: [
+        { key: "type", description: "Provider type (openai)", required: true },
+        { key: "model", description: "Model name (e.g., gpt-4o, gpt-4-turbo, gpt-3.5-turbo)", required: true },
+        { key: "apiKey", description: "API key (defaults to OPENAI_API_KEY env var)" },
+        { key: "baseUrl", description: "Custom API base URL (for OpenAI-compatible services)" },
+    ],
+    ollama: [
+        { key: "type", description: "Provider type (ollama)", required: true },
+        { key: "model", description: "Model name (e.g., llama3, mistral, codellama)", required: true },
+        { key: "baseUrl", description: "Ollama server URL (default: http://localhost:11434)" },
+    ],
+    // Generic LLM provider hint for unknown providers
+    llmprovider: [
+        { key: "type", description: "Provider type (anthropic, openai, or ollama)", required: true },
+        { key: "model", description: "Model name", required: true },
+        { key: "apiKey", description: "API key (optional, uses env var if not set)" },
+        { key: "baseUrl", description: "Custom API base URL (optional)" },
+    ],
 };
 /**
  * KeyValueEditor component for editing key-value pairs with provider-specific hints.
@@ -45,7 +109,7 @@ export function KeyValueEditor({ label, entries, onConfirm, onCancel, isFocused
     }, [providerName]);
     // Get hints that are not already in entries
     const availableHints = useMemo(() => {
-        return providerHints.filter(hint => !(hint.key in editEntries));
+        return providerHints.filter((hint) => !(hint.key in editEntries));
     }, [providerHints, editEntries]);
     // Get sorted keys for consistent ordering
     const keys = Object.keys(editEntries).sort();
@@ -244,17 +308,17 @@ export function KeyValueEditor({ label, entries, onConfirm, onCancel, isFocused
     // Render value input mode (for add or edit)
     if (mode === "add-value" || mode === "edit-value") {
         // Find hint description for the current key
-        const currentHint = providerHints.find(h => h.key === newKey);
+        const currentHint = providerHints.find((h) => h.key === newKey);
         return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { bold: true, color: "cyan", children: mode === "add-value" ? "Add New Entry - Enter Value" : `Edit Value for "${newKey}"` }) }), mode === "add-value" && (_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { dimColor: true, children: "Key: " }), _jsx(Text, { color: "yellow", children: newKey }), currentHint && currentHint.required && _jsx(Text, { color: "red", children: " (required)" })] })), currentHint && (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { dimColor: true, children: currentHint.description }) })), _jsxs(Box, { children: [_jsx(Text, { dimColor: true, children: "Value: " }), _jsx(TextInput, { value: editText, onChange: setEditText, onSubmit: handleValueSubmit, focus: isFocused })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "Enter: confirm | Esc: cancel" }) })] }));
     }
     // Check for missing required keys
-    const missingRequired = providerHints.filter(h => h.required && !(h.key in editEntries));
+    const missingRequired = providerHints.filter((h) => h.required && !(h.key in editEntries));
     // Render list mode
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsxs(Text, { bold: true, color: "cyan", children: ["Edit: ", label] }), _jsxs(Text, { dimColor: true, children: [" (", keys.length, " entries)"] }), providerName && _jsxs(Text, { dimColor: true, children: [" - ", providerName] })] }), missingRequired.length > 0 && (_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "yellow", children: "\u26A0 Missing required: " }), _jsx(Text, { color: "yellow", children: missingRequired.map(h => h.key).join(", ") })] })), keys.length === 0 ? (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { dimColor: true, italic: true, children: "No entries" }) })) : (keys.map((key, index) => {
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "cyan", paddingX: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsxs(Text, { bold: true, color: "cyan", children: ["Edit: ", label] }), _jsxs(Text, { dimColor: true, children: [" (", keys.length, " entries)"] }), providerName && _jsxs(Text, { dimColor: true, children: [" - ", providerName] })] }), missingRequired.length > 0 && (_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "yellow", children: "\u26A0 Missing required: " }), _jsx(Text, { color: "yellow", children: missingRequired.map((h) => h.key).join(", ") })] })), keys.length === 0 ? (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { dimColor: true, italic: true, children: "No entries" }) })) : (keys.map((key, index) => {
                 const isHighlighted = index === highlightedIndex;
                 const isExpanded = expandedKeys.has(key);
                 const value = editEntries[key];
-                const hint = providerHints.find(h => h.key === key);
+                const hint = providerHints.find((h) => h.key === key);
                 return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: isHighlighted ? "cyan" : undefined, children: isHighlighted ? "▸ " : "  " }), _jsx(Text, { dimColor: true, children: isExpanded ? "▼ " : "▶ " }), _jsx(Text, { bold: isHighlighted, color: isHighlighted ? "cyan" : hint?.required ? "yellow" : "yellow", inverse: isHighlighted, children: key }), hint?.required && _jsx(Text, { color: "red", children: " *" }), !isExpanded && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: ": " }), _jsx(Text, { dimColor: true, children: value.length > 30 ? value.substring(0, 30) + "..." : value })] }))] }), isExpanded && (_jsx(Box, { marginLeft: 6, children: _jsx(Text, { color: "green", children: value || "(empty)" }) }))] }, `entry-${key}`));
             })), hasHints && (_jsxs(Box, { children: [_jsx(Text, { color: highlightedIndex === keys.length ? "green" : undefined, children: highlightedIndex === keys.length ? "▸ " : "  " }), _jsx(Text, { dimColor: true, children: "  " }), _jsx(Text, { bold: highlightedIndex === keys.length, color: highlightedIndex === keys.length ? "green" : "gray", inverse: highlightedIndex === keys.length, children: "+ Add from hints" })] })), _jsxs(Box, { children: [_jsx(Text, { color: highlightedIndex === (hasHints ? keys.length + 1 : keys.length) ? "green" : undefined, children: highlightedIndex === (hasHints ? keys.length + 1 : keys.length) ? "▸ " : "  " }), _jsx(Text, { dimColor: true, children: "  " }), _jsx(Text, { bold: highlightedIndex === (hasHints ? keys.length + 1 : keys.length), color: highlightedIndex === (hasHints ? keys.length + 1 : keys.length) ? "green" : "gray", inverse: highlightedIndex === (hasHints ? keys.length + 1 : keys.length), children: "+ Add custom entry" })] }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { dimColor: true, children: "j/k: navigate | Tab/Space: expand | Enter/e: edit" }), _jsx(Text, { dimColor: true, children: "d: delete | s: save | Esc: cancel" })] })] }));
 }

package/dist/tui/components/LLMProvidersEditor.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import type { LLMProvidersConfig } from "../../utils/config.js";
+export interface LLMProvidersEditorProps {
+    /** The label to display for this field */
+    label: string;
+    /** The current LLM providers config */
+    providers: LLMProvidersConfig;
+    /** Called when the user confirms the edit */
+    onConfirm: (newProviders: LLMProvidersConfig) => void;
+    /** Called when the user cancels the edit (Esc) */
+    onCancel: () => void;
+    /** Whether this editor has focus */
+    isFocused?: boolean;
+    /** Maximum height for the list (for scrolling) */
+    maxHeight?: number;
+}
+/**
+ * LLMProvidersEditor component for editing LLM provider configurations.
+ * Provides a user-friendly interface for adding, editing, and removing LLM providers.
+ */
+export declare function LLMProvidersEditor({ label, providers, onConfirm, onCancel, isFocused, maxHeight, }: LLMProvidersEditorProps): React.ReactElement;
+export default LLMProvidersEditor;