@amplitude/wizard 1.0.0-beta.0

package/dist/src/ui/logging-ui.js

@@ -0,0 +1,157 @@
+"use strict";
+/**
+ * LoggingUI — Logging-only implementation for CI mode.
+ * No prompts, no TUI, no interactivity. Just console output.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoggingUI = void 0;
+const wizard_ui_1 = require("./wizard-ui");
+class LoggingUI {
+    intro(message) {
+        console.log(`┌  ${message}`);
+    }
+    outro(message) {
+        console.log(`└  ${message}`);
+    }
+    cancel(message, options) {
+        console.log(`■  ${message}`);
+        if (options?.docsUrl) {
+            console.log(`│  Manual setup guide: ${options.docsUrl}`);
+        }
+    }
+    log = {
+        info(message) {
+            console.log(`│  ${message}`);
+        },
+        warn(message) {
+            console.log(`▲  ${message}`);
+        },
+        error(message) {
+            console.log(`✖  ${message}`);
+        },
+        success(message) {
+            console.log(`✔  ${message}`);
+        },
+        step(message) {
+            console.log(`◇  ${message}`);
+        },
+    };
+    note(message) {
+        console.log(`│  ${message}`);
+    }
+    spinner() {
+        let activeMessage;
+        return {
+            start(message) {
+                if (message) {
+                    activeMessage = message;
+                    // Write without newline so stop() can overwrite in-place
+                    process.stdout.write(`◌  ${message}`);
+                }
+            },
+            stop(message) {
+                if (activeMessage !== undefined) {
+                    // Overwrite the current spinner line: carriage-return → solid dot → newline
+                    process.stdout.write(`\r●  ${message ?? activeMessage}\n`);
+                    activeMessage = undefined;
+                }
+                else if (message) {
+                    console.log(`●  ${message}`);
+                }
+            },
+            message(msg) {
+                if (!msg)
+                    return;
+                if (activeMessage !== undefined) {
+                    // Overwrite the current spinner line with the new task
+                    process.stdout.write(`\r◌  ${msg}`);
+                }
+                else {
+                    process.stdout.write(`◌  ${msg}`);
+                }
+                activeMessage = msg;
+            },
+        };
+    }
+    pushStatus(message) {
+        console.log(`◇  ${message}`);
+    }
+    heartbeat(statuses) {
+        if (statuses.length === 0)
+            return;
+        // End the current in-progress spinner line before printing
+        process.stdout.write('\n');
+        for (const s of statuses) {
+            console.log(`│  ${s}`);
+        }
+    }
+    setDetectedFramework(label) {
+        console.log(`✔  Framework: ${label}`);
+    }
+    onEnterScreen(_screen, _fn) {
+        // No screen transitions in CI
+    }
+    setLoginUrl(url) {
+        if (url) {
+            console.log(`│  If the browser didn't open automatically, use this link:`);
+            console.log(`│  ${url}`);
+        }
+    }
+    showServiceStatus(data) {
+        console.log(`▲  Claude/Anthropic services are experiencing issues.`);
+        console.log(`│  Status: ${data.description}`);
+        console.log(`│  Status page: ${data.statusPageUrl}`);
+        console.log(`│  The wizard may not work reliably while services are affected.`);
+    }
+    showSettingsOverride(keys, _backupAndFix) {
+        console.log(`▲  Security warning: .claude/settings.json overrides detected`);
+        for (const key of keys) {
+            console.log(`│    • ${key}`);
+        }
+        console.log(`│  These overrides prevent the Wizard from accessing the Amplitude LLM Gateway.`);
+        return Promise.resolve();
+    }
+    startRun() {
+        // No-op in CI mode
+    }
+    setRunError(_error) {
+        // No retry in CI — let the caller fall through to wizardAbort
+        return Promise.resolve(false);
+    }
+    setCredentials(_credentials) {
+        // No-op in CI mode — credentials are handled directly
+    }
+    setRegion(_region) {
+        // No-op in CI mode
+    }
+    setProjectHasData(_value) {
+        // No-op in CI mode
+    }
+    promptConfirm(message) {
+        console.log(`?  ${message} (auto-skipped in CI)`);
+        return Promise.resolve(false);
+    }
+    promptChoice(message, options) {
+        console.log(`?  ${message} (auto-skipped in CI)`);
+        console.log(`│  Options: ${options.join(', ')}`);
+        return Promise.resolve('');
+    }
+    promptEventPlan(events) {
+        console.log(`?  Instrumentation plan (auto-approved in CI):`);
+        for (const e of events) {
+            console.log(`│  - ${e.name}: ${e.description}`);
+        }
+        return Promise.resolve({ decision: 'approved' });
+    }
+    syncTodos(todos) {
+        const completed = todos.filter((t) => t.status === wizard_ui_1.TaskStatus.Completed).length;
+        const inProgress = todos.find((t) => t.status === wizard_ui_1.TaskStatus.InProgress);
+        if (inProgress) {
+            console.log(`◌  [${completed}/${todos.length}] ${inProgress.activeForm || inProgress.content}`);
+        }
+    }
+    setEventPlan(_events) {
+        // No-op in CI mode
+    }
+}
+exports.LoggingUI = LoggingUI;

package/dist/src/ui/tui/App.d.ts

@@ -0,0 +1,6 @@
+import type { WizardStore } from './store.js';
+interface AppProps {
+    store: WizardStore;
+}
+export declare const App: ({ store }: AppProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/ui/tui/App.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useSyncExternalStore } from 'react';
+import { Box } from 'ink';
+import { createScreens, createServices } from './screen-registry.js';
+import { CommandModeContext } from './context/CommandModeContext.js';
+import { ConsoleView } from './components/ConsoleView.js';
+import { TitleBar } from './components/TitleBar.js';
+import { useStdoutDimensions } from './hooks/useStdoutDimensions.js';
+import { DissolveTransition } from './primitives/DissolveTransition.js';
+import { ScreenErrorBoundary } from './primitives/ScreenErrorBoundary.js';
+const MIN_WIDTH = 80;
+const MAX_WIDTH = 120;
+/** Height reserved for separator + response line + input + up to 5 picker items. */
+const CONSOLE_INPUT_HEIGHT = 8;
+function getContentWidth(terminalColumns) {
+    if (terminalColumns < MIN_WIDTH)
+        return terminalColumns;
+    return Math.min(MAX_WIDTH, terminalColumns);
+}
+export const App = ({ store }) => {
+    const [columns, rows] = useStdoutDimensions();
+    const services = useMemo(() => createServices(store.session.localMcp), []);
+    const screens = useMemo(() => createScreens(store, services), [store, services]);
+    useSyncExternalStore((cb) => store.subscribe(cb), () => store.getSnapshot());
+    const width = getContentWidth(columns);
+    const innerWidth = width - 2;
+    // border(2) + titlebar(1) + gap(1) + console input area
+    const contentHeight = Math.max(5, rows - 4 - CONSOLE_INPUT_HEIGHT);
+    // innerWidth minus paddingX(1) on each side
+    const contentAreaWidth = Math.max(10, innerWidth - 2);
+    const direction = store.lastNavDirection === 'pop' ? 'right' : 'left';
+    const activeScreen = screens[store.currentScreen] ?? null;
+    return (_jsx(CommandModeContext.Provider, { value: store.commandMode, children: _jsx(Box, { flexDirection: "column", height: rows, width: columns, alignItems: "center", justifyContent: "flex-start", children: _jsxs(ConsoleView, { store: store, width: width, height: rows, children: [_jsx(TitleBar, { version: store.version, width: innerWidth }), _jsx(Box, { height: 1 }), _jsx(Box, { flexDirection: "column", flexGrow: 1, paddingX: 1, overflow: "hidden", children: _jsx(DissolveTransition, { transitionKey: store.currentScreen, width: contentAreaWidth, height: contentHeight, direction: direction, children: _jsx(ScreenErrorBoundary, { store: store, retryToken: store.screenErrorRetry, children: activeScreen }) }) })] }) }) }));
+};

package/dist/src/ui/tui/components/AmplitudeLogo.d.ts

@@ -0,0 +1,5 @@
+export declare const AmplitudeLogo: ({ color }: {
+    color?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+/** AmplitudeLogo with a colour wave (vertical) and a horizontal dissolve wave. */
+export declare const AnimatedAmplitudeLogo: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/tui/components/AmplitudeLogo.js

@@ -0,0 +1,81 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { useState, useEffect } from 'react';
+const LINES = [
+    '     _.ΦΦ8$8ΦΦ..    ',
+    '   .ΦΘΦƒⁿ"ΦΦΦΘ#ΦΦ.  ',
+    ' /#8ΦΦ/ x  #Φ8ΦæΦΦ\\ ',
+    '+ΦΦΦ+/ @A@ +ΦΦ8ΦΦ#Φ:',
+    '+Φ(    ___       )Φ|',
+    '\\ΦΦΦΓ áΦΦΦì  ΦΦ/Φ#Θ;',
+    ' ΦæΦææ#ΦΘΦΦ+ +/ +ΦΦ ',
+    '  `Φ8ΦΦ8ΦΦ#Φ\\_.ΦΦΦ  ',
+    "    `-ΦΦΦµµΦΦΦ'''    ",
+];
+const TEXT = LINES.join('\n');
+/** Amplitude blue gradient — bright core fading to dim. */
+const WAVE_COLORS = [
+    '#6b9af7', // light blue
+    '#4478f2', // mid blue
+    '#1e61f0', // Amplitude blue (brand)
+    '#1a55d4', // deeper blue
+    '#1549b8', // deep blue
+    '#1a55d4', // deeper blue
+    '#1e61f0', // Amplitude blue
+    '#4478f2', // mid blue
+    '#6b9af7', // light blue
+];
+/**
+ * Characters substituted at each distance from the wave centre.
+ * dist 0 → invisible, dist 1-3 → progressively larger dots, dist 4+ → original.
+ */
+const DECAY = [' ', '˙', '·', '∘'];
+const LOGO_WIDTH = LINES[0].length;
+/** Radius of the dissolve zone in columns. */
+const WAVE_RADIUS = 7;
+/** Column shift per row — controls the diagonal angle. */
+const ROW_SHIFT = 2;
+/**
+ * Replace each non-space character with its wave-decay substitute.
+ * rowWaveX is the wave centre for this specific row (already shifted for angle).
+ */
+function applyHorizWave(line, rowWaveX) {
+    if (rowWaveX < -WAVE_RADIUS || rowWaveX > LOGO_WIDTH + WAVE_RADIUS)
+        return line;
+    return [...line]
+        .map((char, col) => {
+        if (char === ' ')
+            return ' ';
+        const dist = Math.abs(col - rowWaveX);
+        return dist < DECAY.length ? DECAY[dist] : char;
+    })
+        .join('');
+}
+export const AmplitudeLogo = ({ color = 'white' }) => (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: color, children: TEXT }) }));
+/** AmplitudeLogo with a colour wave (vertical) and a horizontal dissolve wave. */
+export const AnimatedAmplitudeLogo = () => {
+    // Vertical colour wave — advances every 110 ms
+    const [colorFrame, setColorFrame] = useState(0);
+    // Horizontal dissolve wave — tick advances every 50 ms
+    const [waveTick, setWaveTick] = useState(0);
+    useEffect(() => {
+        const id = setInterval(() => setColorFrame((f) => (f + 1) % WAVE_COLORS.length), 110);
+        return () => clearInterval(id);
+    }, []);
+    useEffect(() => {
+        const id = setInterval(() => setWaveTick((t) => t + 1), 50);
+        return () => clearInterval(id);
+    }, []);
+    // One dissolve wave every 4 s (80 ticks). The wave travels for the first
+    // 36 ticks (~1.8 s), sweeping from left edge to right edge; the remaining
+    // 44 ticks the logo rests at full resolution.
+    const TICKS_PER_CYCLE = 80;
+    const ACTIVE_TICKS = 54; // extra ticks to cover diagonal travel + right overshoot
+    const frameInCycle = waveTick % TICKS_PER_CYCLE;
+    const waveX = frameInCycle < ACTIVE_TICKS
+        ? Math.round((frameInCycle / (ACTIVE_TICKS - 1)) *
+            (LOGO_WIDTH + WAVE_RADIUS * 2 + 10) -
+            WAVE_RADIUS)
+        : -999; // off-screen → no substitution
+    return (_jsx(Box, { flexDirection: "column", marginBottom: 1, children: LINES.map((line, i) => (_jsx(Text, { color: WAVE_COLORS[(colorFrame + i) % WAVE_COLORS.length], children: applyHorizWave(line, waveX - i * ROW_SHIFT) }, i))) }));
+};

package/dist/src/ui/tui/components/AmplitudeTextLogo.d.ts

@@ -0,0 +1,3 @@
+export declare const AMP_BLUE = "#1E61F0";
+export declare const AMP_CYAN = "#00D4AA";
+export declare const AmplitudeTextLogo: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/tui/components/AmplitudeTextLogo.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+const LOGO_LINES = [
+    ' █████╗ ███╗   ███╗██████╗ ██╗     ██╗████████╗██╗   ██╗██████╗ ███████╗',
+    '██╔══██╗████╗ ████║██╔══██╗██║     ██║╚══██╔══╝██║   ██║██╔══██╗██╔════╝',
+    '███████║██╔████╔██║██████╔╝██║     ██║   ██║   ██║   ██║██║  ██║█████╗  ',
+    '██╔══██║██║╚██╔╝██║██╔═══╝ ██║     ██║   ██║   ██║   ██║██║  ██║██╔══╝  ',
+    '██║  ██║██║ ╚═╝ ██║██║     ███████╗██║   ██║   ╚██████╔╝██████╔╝███████╗',
+    '╚═╝  ╚═╝╚═╝     ╚═╝╚═╝     ╚══════╝╚═╝   ╚═╝    ╚═════╝ ╚═════╝ ╚══════╝',
+];
+export const AMP_BLUE = '#1E61F0';
+export const AMP_CYAN = '#00D4AA';
+function lerpColor(a, b, t) {
+    const ar = parseInt(a.slice(1, 3), 16), ag = parseInt(a.slice(3, 5), 16), ab = parseInt(a.slice(5, 7), 16);
+    const br = parseInt(b.slice(1, 3), 16), bg = parseInt(b.slice(3, 5), 16), bb = parseInt(b.slice(5, 7), 16);
+    const r = Math.round(ar + (br - ar) * t)
+        .toString(16)
+        .padStart(2, '0');
+    const g = Math.round(ag + (bg - ag) * t)
+        .toString(16)
+        .padStart(2, '0');
+    const bv = Math.round(ab + (bb - ab) * t)
+        .toString(16)
+        .padStart(2, '0');
+    return `#${r}${g}${bv}`;
+}
+export const AmplitudeTextLogo = () => (_jsx(Box, { flexDirection: "column", marginBottom: 1, children: LOGO_LINES.map((line, i) => {
+        const chars = line.split('');
+        const last = chars.length - 1;
+        return (_jsx(Box, { flexDirection: "row", alignItems: "flex-start", children: chars.map((char, j) => (_jsx(Text, { color: lerpColor(AMP_BLUE, AMP_CYAN, last > 0 ? j / last : 0), children: char }, j))) }, i));
+    }) }));

package/dist/src/ui/tui/components/ConsoleView.d.ts

@@ -0,0 +1,23 @@
+/**
+ * ConsoleView — Full-screen bordered box.
+ *
+ * Renders arbitrary children in the content area, with a persistent
+ * slash-command / Claude-query input at the bottom.
+ *
+ * The input is dormant by default. Activation:
+ *   - "/" → activate in slash-command mode
+ *   - Tab → activate for free-text Claude query
+ * Deactivation: Enter (submit) or Escape. Backspacing to empty also deactivates.
+ *
+ * While active, commandMode=true on the store disables all useScreenInput handlers.
+ */
+import type { ReactNode } from 'react';
+import type { WizardStore } from '../store.js';
+interface ConsoleViewProps {
+    store: WizardStore;
+    width: number;
+    height: number;
+    children?: ReactNode;
+}
+export declare const ConsoleView: ({ store, width, height, children, }: ConsoleViewProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/ui/tui/components/ConsoleView.js

@@ -0,0 +1,220 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ConsoleView — Full-screen bordered box.
+ *
+ * Renders arbitrary children in the content area, with a persistent
+ * slash-command / Claude-query input at the bottom.
+ *
+ * The input is dormant by default. Activation:
+ *   - "/" → activate in slash-command mode
+ *   - Tab → activate for free-text Claude query
+ * Deactivation: Enter (submit) or Escape. Backspacing to empty also deactivates.
+ *
+ * While active, commandMode=true on the store disables all useScreenInput handlers.
+ */
+import { Box, Text, useInput } from 'ink';
+import { useState, useEffect, useSyncExternalStore } from 'react';
+import { Spinner } from '@inkjs/ui';
+import { OutroKind } from '../../../lib/wizard-session.js';
+import { SlashCommandInput } from '../primitives/SlashCommandInput.js';
+import { PickerMenu } from '../primitives/PickerMenu.js';
+import { Colors, Icons } from '../styles.js';
+import { Overlay } from '../router.js';
+import { queryConsole, resolveConsoleCredentials, buildSessionContext, } from '../../../lib/console-query.js';
+import { COMMANDS, getWhoamiText, getHelpText, TEST_PROMPT, } from '../console-commands.js';
+import { analytics } from '../../../utils/analytics.js';
+function executeCommand(raw, store) {
+    const [cmd] = raw.trim().split(/\s+/);
+    switch (cmd) {
+        case '/region':
+            store.setRegionForced();
+            break;
+        case '/login':
+            store.showLoginOverlay();
+            break;
+        case '/logout':
+            store.showLogoutOverlay();
+            break;
+        case '/whoami':
+            store.setCommandFeedback(getWhoamiText(store.session));
+            break;
+        case '/slack':
+            store.showSlackOverlay();
+            break;
+        case '/test':
+            return TEST_PROMPT;
+        case '/mcp':
+            store.showMcpOverlay();
+            break;
+        case '/snake':
+            store.showSnakeOverlay();
+            break;
+        case '/exit':
+            store.setOutroData({ kind: OutroKind.Cancel, message: 'Exited.' });
+            break;
+        case '/help':
+            store.setCommandFeedback(getHelpText());
+            break;
+        default:
+            if (cmd)
+                store.setCommandFeedback(`Unknown command: ${cmd}. Type /help.`);
+    }
+}
+export const ConsoleView = ({ store, width, height, children, }) => {
+    const [inputActive, setInputActive] = useState(false);
+    const [initialValue, setInitialValue] = useState('');
+    const [inputKey, setInputKey] = useState(0);
+    const [response, setResponse] = useState(null);
+    const [loading, setLoading] = useState(false);
+    const [history, setHistory] = useState([]);
+    // Event plan prompt local state
+    const [planInputMode, setPlanInputMode] = useState('options');
+    const [planFeedbackText, setPlanFeedbackText] = useState('');
+    const [planCursorVisible, setPlanCursorVisible] = useState(true);
+    useSyncExternalStore((cb) => store.subscribe(cb), () => store.getSnapshot());
+    const activate = (seed = '') => {
+        setInitialValue(seed);
+        setInputKey((k) => k + 1); // remount so initialValue takes effect
+        setInputActive(true);
+        store.setCommandMode(true);
+    };
+    const deactivate = () => {
+        setInputActive(false);
+        store.setCommandMode(false);
+    };
+    const feedback = store.commandFeedback;
+    const screenError = store.screenError;
+    const showResponse = loading || !!response;
+    const showFeedback = !showResponse && !!feedback;
+    const innerWidth = width - 2;
+    const separator = '─'.repeat(Math.max(0, innerWidth));
+    const responseIsLong = !!response && response.split('\n').length > 3;
+    const pendingPrompt = store.pendingPrompt;
+    // Watch for activation keys while the input is dormant
+    useInput((char, key) => {
+        // Escape or Q dismisses overlays: pending prompt (skip) or long response
+        if (key.escape || char === 'q' || char === 'Q') {
+            if (pendingPrompt && pendingPrompt.kind !== 'event-plan') {
+                store.resolvePrompt(pendingPrompt.kind === 'confirm' ? false : '');
+                return;
+            }
+            if (responseIsLong) {
+                setResponse(null);
+                return;
+            }
+        }
+        if (screenError && (char === 'r' || char === 'R')) {
+            store.clearScreenError();
+            return;
+        }
+        if (char === '/') {
+            activate('/');
+        }
+        else if (key.tab) {
+            activate('');
+        }
+    }, { isActive: !inputActive });
+    const handleSubmit = (value) => {
+        const isSlashCommand = value.startsWith('/');
+        analytics.wizardCapture('agent message sent', {
+            message_length: value.length,
+            is_slash_command: isSlashCommand,
+        });
+        if (isSlashCommand) {
+            setResponse(null);
+            const query = executeCommand(value, store);
+            if (query) {
+                handleSubmit(query);
+            }
+            return;
+        }
+        setResponse(null);
+        setLoading(true);
+        const creds = resolveConsoleCredentials(store.session);
+        const context = buildSessionContext(store.session);
+        queryConsole(value, context, creds, history)
+            .then((text) => {
+            setResponse(text);
+            setHistory((h) => [
+                ...h,
+                { role: 'user', content: value },
+                { role: 'assistant', content: text },
+            ]);
+        })
+            .catch((err) => {
+            const msg = err instanceof Error ? err.message : String(err);
+            setResponse(`Error: ${msg}`);
+        })
+            .finally(() => setLoading(false));
+    };
+    // Blinking cursor for event-plan feedback input
+    useEffect(() => {
+        if (planInputMode !== 'feedback')
+            return;
+        const id = setInterval(() => setPlanCursorVisible((v) => !v), 530);
+        return () => clearInterval(id);
+    }, [planInputMode]);
+    // Reset plan input state when the prompt clears (agent got the answer)
+    useEffect(() => {
+        if (!pendingPrompt) {
+            setPlanInputMode('options');
+            setPlanFeedbackText('');
+        }
+    }, [pendingPrompt]);
+    // Keyboard handling for event-plan prompt
+    useInput((char, key) => {
+        if (!pendingPrompt || pendingPrompt.kind !== 'event-plan')
+            return;
+        if (planInputMode === 'feedback') {
+            if (key.return) {
+                const text = planFeedbackText.trim();
+                if (text) {
+                    store.resolveEventPlan({ decision: 'revised', feedback: text });
+                    setPlanFeedbackText('');
+                    setPlanInputMode('options');
+                }
+                return;
+            }
+            if (key.escape) {
+                setPlanInputMode('options');
+                setPlanFeedbackText('');
+                return;
+            }
+            if (key.backspace || key.delete) {
+                setPlanFeedbackText((v) => v.slice(0, -1));
+                return;
+            }
+            if (!key.ctrl && !key.meta && !key.tab && char) {
+                setPlanFeedbackText((v) => v + char);
+            }
+            return;
+        }
+        // options mode
+        const lc = char.toLowerCase();
+        if (lc === 'y' || key.return) {
+            store.resolveEventPlan({ decision: 'approved' });
+        }
+        else if (lc === 's') {
+            store.resolveEventPlan({ decision: 'skipped' });
+        }
+        else if (lc === 'f') {
+            setPlanInputMode('feedback');
+        }
+    }, {
+        isActive: !inputActive && !!pendingPrompt && pendingPrompt.kind === 'event-plan',
+    });
+    // Show the latest status message when an overlay is active — RunScreen's
+    // own TabContainer handles this for the non-overlay case.
+    const overlayValues = Object.values(Overlay);
+    const isOverlay = overlayValues.includes(store.currentScreen);
+    const lastStatus = isOverlay && store.statusMessages.length > 0
+        ? store.statusMessages[store.statusMessages.length - 1]
+        : null;
+    return (_jsxs(Box, { width: width, height: height, flexDirection: "column", borderStyle: "round", borderColor: Colors.muted, children: [_jsx(Box, { flexDirection: "column", flexGrow: 1, overflow: "hidden", children: pendingPrompt ? (_jsxs(Box, { flexDirection: "column", flexGrow: 1, paddingX: 1, paddingY: 1, children: [pendingPrompt.kind === 'confirm' ? (_jsx(PickerMenu, { message: pendingPrompt.message, options: [
+                                { label: 'Yes', value: 'yes' },
+                                { label: 'No', value: 'no' },
+                            ], onSelect: (v) => store.resolvePrompt(v === 'yes') })) : pendingPrompt.kind === 'choice' ? (_jsx(PickerMenu, { message: pendingPrompt.message, options: pendingPrompt.options.map((o) => ({
+                                label: o,
+                                value: o,
+                            })), onSelect: (v) => store.resolvePrompt(v) })) : (_jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsx(Text, { color: Colors.primary, bold: true, children: "Instrumentation Plan" }), pendingPrompt.events.map((e) => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: Colors.accent, bold: true, children: e.name }), _jsx(Text, { color: Colors.muted, children: e.description })] }, e.name))), planInputMode === 'feedback' ? (_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: Colors.muted, children: "Feedback: " }), _jsxs(Text, { children: [planFeedbackText, planCursorVisible ? '▎' : ' '] }), _jsx(Text, { color: Colors.muted, children: "[Enter] send [Esc] cancel" })] })) : (_jsx(Text, { color: Colors.muted, children: "[Y] approve [S] skip [F] give feedback" }))] })), pendingPrompt.kind !== 'event-plan' && (_jsx(Text, { color: Colors.muted, children: " [Q / Esc] skip" }))] })) : responseIsLong ? (_jsxs(Box, { flexDirection: "column", flexGrow: 1, paddingX: 1, paddingY: 1, children: [_jsx(Box, { justifyContent: "flex-end", children: _jsx(Text, { color: Colors.muted, children: "[Q / Esc] close" }) }), _jsx(Text, { color: Colors.primary, children: response })] })) : (children) }), lastStatus && (_jsxs(Box, { paddingX: 1, overflow: "hidden", children: [_jsxs(Text, { color: Colors.muted, children: [Icons.diamondOpen, " "] }), _jsx(Text, { color: Colors.muted, wrap: "truncate-end", children: lastStatus })] })), screenError && (_jsxs(Box, { paddingX: 1, gap: 1, children: [_jsx(Text, { color: Colors.error, bold: true, children: "\u26A0" }), _jsx(Box, { flexGrow: 1, overflow: "hidden", children: _jsx(Text, { color: Colors.error, wrap: "truncate-end", children: screenError.message }) }), _jsx(Text, { color: Colors.muted, children: "[R] retry" })] })), _jsx(Text, { color: Colors.muted, children: separator }), showFeedback && (_jsxs(Box, { paddingX: 1, children: [_jsx(Text, { color: Colors.accent, bold: true, children: ' ' }), _jsx(Text, { color: Colors.muted, children: feedback })] })), showResponse && !responseIsLong && (_jsx(Box, { paddingX: 1, paddingY: 1, gap: 1, flexDirection: "column", children: loading ? (_jsx(Spinner, {})) : (_jsx(Text, { color: Colors.primary, children: response })) })), loading && responseIsLong && (_jsx(Box, { paddingX: 1, children: _jsx(Spinner, {}) })), _jsx(Box, { paddingX: 1, children: _jsx(SlashCommandInput, { commands: COMMANDS, isActive: inputActive, initialValue: initialValue, onSubmit: handleSubmit, onDeactivate: deactivate }, inputKey) })] }));
+};

package/dist/src/ui/tui/components/TitleBar.d.ts

@@ -0,0 +1,6 @@
+interface TitleBarProps {
+    version: string;
+    width: number;
+}
+export declare const TitleBar: ({ version, width }: TitleBarProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/ui/tui/components/TitleBar.js

@@ -0,0 +1,16 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { Colors } from '../styles.js';
+const FEEDBACK = 'Feedback: wizard@amplitude.com ';
+const FEEDBACK_SHORT = ' wizard@amplitude.com ';
+export const TitleBar = ({ version, width }) => {
+    const fullTitle = ` Amplitude Wizard v${version}`;
+    const needShort = width < fullTitle.length + FEEDBACK.length;
+    const feedback = needShort ? FEEDBACK_SHORT : FEEDBACK;
+    const title = needShort && fullTitle.length + feedback.length > width
+        ? ` Wizard v${version}`
+        : fullTitle;
+    const gap = Math.max(0, width - title.length - feedback.length);
+    const padding = ' '.repeat(gap);
+    return (_jsx(Box, { width: width, overflow: "hidden", children: _jsxs(Text, { backgroundColor: Colors.accent, color: "white", bold: true, children: [title, padding, feedback] }) }));
+};

package/dist/src/ui/tui/console-commands.d.ts

@@ -0,0 +1,16 @@
+/**
+ * console-commands.ts — Slash command definitions and pure helpers.
+ *
+ * Extracted from ConsoleView so they can be imported in tests without
+ * pulling in React / Ink / store dependencies.
+ */
+import type { WizardSession } from '../../lib/wizard-session.js';
+export declare const COMMANDS: {
+    cmd: string;
+    desc: string;
+}[];
+export declare const TEST_PROMPT: string;
+/** Returns the feedback text for the /whoami command. */
+export declare function getWhoamiText(session: Pick<WizardSession, 'selectedOrgName' | 'selectedWorkspaceName' | 'region'>): string;
+/** Returns the feedback text for the /help command. */
+export declare function getHelpText(): string;

package/dist/src/ui/tui/console-commands.js

@@ -0,0 +1,31 @@
+/**
+ * console-commands.ts — Slash command definitions and pure helpers.
+ *
+ * Extracted from ConsoleView so they can be imported in tests without
+ * pulling in React / Ink / store dependencies.
+ */
+export const COMMANDS = [
+    { cmd: '/region', desc: 'Switch data-center region (US or EU)' },
+    { cmd: '/login', desc: 'Re-authenticate' },
+    { cmd: '/logout', desc: 'Clear stored credentials' },
+    { cmd: '/whoami', desc: 'Show current user, org, and project' },
+    { cmd: '/mcp', desc: 'Install or remove the Amplitude MCP server' },
+    { cmd: '/slack', desc: 'Set up Amplitude Slack integration' },
+    { cmd: '/test', desc: 'Run a prompt-skill demo (confirm + choose)' },
+    { cmd: '/snake', desc: 'Play Snake' },
+    { cmd: '/exit', desc: 'Exit the wizard' },
+    { cmd: '/help', desc: 'List available slash commands' },
+];
+export const TEST_PROMPT = 'Demo the wizard prompt tools. ' +
+    'First, use the wizard-tools:confirm tool to ask if I want to continue. ' +
+    'Then use the wizard-tools:choose tool to let me pick my favorite color from: Red, Blue, Green, Purple. ' +
+    'Finally, summarize what I chose in one sentence.';
+/** Returns the feedback text for the /whoami command. */
+export function getWhoamiText(session) {
+    return `org: ${session.selectedOrgName ?? '(none)'}  workspace: ${session.selectedWorkspaceName ?? '(none)'}  region: ${session.region ?? '(none)'}`;
+}
+/** Returns the feedback text for the /help command. */
+export function getHelpText() {
+    const maxCmd = Math.max(...COMMANDS.map((c) => c.cmd.length));
+    return COMMANDS.map((c) => `${c.cmd.padEnd(maxCmd)}  ${c.desc}`).join('\n');
+}

package/dist/src/ui/tui/context/CommandModeContext.d.ts

@@ -0,0 +1,2 @@
+/** True when the user is actively typing a slash command in the command bar. */
+export declare const CommandModeContext: import("react").Context<boolean>;

package/dist/src/ui/tui/context/CommandModeContext.js

@@ -0,0 +1,3 @@
+import { createContext } from 'react';
+/** True when the user is actively typing a slash command in the command bar. */
+export const CommandModeContext = createContext(false);