auq-mcp-server 0.1.0

package/dist/src/tui/components/CustomInput.js

@@ -0,0 +1,14 @@
+import { Box, Text } from "ink";
+import TextInput from "ink-text-input";
+import React from "react";
+/**
+ * CustomInput allows users to type free-text answers
+ * Uses Ink's TextInput component with visual focus indicator
+ */
+export const CustomInput = ({ isFocused, onChange, value, }) => {
+    return (React.createElement(Box, { borderColor: isFocused ? "cyan" : "gray", borderStyle: "single", flexDirection: "column", marginTop: 1, padding: 0.5 },
+        React.createElement(Text, { dimColor: !isFocused },
+            isFocused ? "→" : " ",
+            " Custom answer: "),
+        React.createElement(Box, { marginTop: 0.5 }, isFocused ? (React.createElement(TextInput, { onChange: onChange, placeholder: "Type your answer here...", value: value })) : (React.createElement(Text, { color: value ? "white" : "gray" }, value || "(Press Tab to enter custom answer)")))));
+};

package/dist/src/tui/components/Footer.js

@@ -0,0 +1,55 @@
+import { Box, Text } from "ink";
+import React from "react";
+import { theme } from "../theme.js";
+/**
+ * Footer component - displays context-aware keybindings
+ * Shows different shortcuts based on current focus context and question type
+ */
+export const Footer = ({ focusContext, multiSelect, isReviewScreen = false, customInputValue = "", }) => {
+    const getKeybindings = () => {
+        // Review screen mode
+        if (isReviewScreen) {
+            return [
+                { key: "Enter", action: "Submit" },
+                { key: "n", action: "Back" },
+            ];
+        }
+        // Custom input focused
+        if (focusContext === "custom-input") {
+            const hasContent = customInputValue.trim().length > 0;
+            const bindings = [
+                { key: "↑↓", action: "Options" },
+                { key: "Tab", action: "Next" },
+            ];
+            if (hasContent) {
+                bindings.push({ key: "Enter", action: "Submit" });
+            }
+            bindings.push({ key: "Shift+Enter", action: "Newline" }, { key: "Esc", action: "Reject" });
+            return bindings;
+        }
+        // Option focused
+        if (focusContext === "option") {
+            const bindings = [
+                { key: "↑↓", action: "Options" },
+                { key: "←→", action: "Questions" },
+            ];
+            if (multiSelect) {
+                bindings.push({ key: "Space", action: "Toggle" }, { key: "Tab", action: "Submit" });
+            }
+            else {
+                bindings.push({ key: "Enter", action: "Select" });
+            }
+            bindings.push({ key: "Esc", action: "Reject" }, { key: "q", action: "Quit" });
+            return bindings;
+        }
+        return [];
+    };
+    const keybindings = getKeybindings();
+    return (React.createElement(Box, { borderColor: theme.borders.neutral, borderStyle: "single", paddingX: 1 },
+        React.createElement(Text, { dimColor: true }, keybindings.map((binding, idx) => (React.createElement(React.Fragment, { key: idx },
+            idx > 0 && React.createElement(Text, { dimColor: true }, " | "),
+            React.createElement(Text, { bold: true, color: "cyan" }, binding.key),
+            React.createElement(Text, { dimColor: true },
+                " ",
+                binding.action)))))));
+};

package/dist/src/tui/components/Header.js

@@ -0,0 +1,35 @@
+import { Box, Text } from "ink";
+import gradient from "gradient-string";
+import React, { useEffect, useState } from "react";
+import { theme } from "../theme.js";
+/**
+ * Header component - displays app logo and status
+ * Shows at the top of the TUI with gradient branding and live-updating pending queue count
+ */
+export const Header = ({ pendingCount }) => {
+    const [flash, setFlash] = useState(false);
+    const [prevCount, setPrevCount] = useState(pendingCount);
+    // Flash effect when count changes
+    useEffect(() => {
+        if (pendingCount !== prevCount) {
+            setFlash(true);
+            setPrevCount(pendingCount);
+            const timer = setTimeout(() => setFlash(false), 300);
+            return () => clearTimeout(timer);
+        }
+    }, [pendingCount, prevCount]);
+    // Use the selected gradient theme from theme.ts
+    const headerText = gradient[theme.headerGradient](".𖥔 AUQ ⋆ Ask User Questions MCP ⋆ ");
+    return (React.createElement(Box, { borderColor: theme.components.header.border, borderStyle: "single", flexDirection: "row", justifyContent: "space-between", paddingX: 1 },
+        React.createElement(Text, { bold: true }, headerText),
+        React.createElement(Box, null,
+            React.createElement(Text, { dimColor: true }, "\u2502"),
+            React.createElement(Text, { bold: flash, color: flash
+                    ? theme.components.header.queueFlash
+                    : pendingCount > 0
+                        ? theme.components.header.queueActive
+                        : theme.components.header.queueEmpty },
+                " ",
+                pendingCount,
+                " more on queue"))));
+};

package/dist/src/tui/components/MultiLineTextInput.js

@@ -0,0 +1,65 @@
+import { Box, Text, useInput } from "ink";
+import React from "react";
+import { theme } from "../theme.js";
+/**
+ * Multi-line text input component for Ink
+ * Append-only mode: Shift+Enter for newlines, Enter to submit
+ * Note: No cursor positioning - text is append-only for simplicity
+ */
+export const MultiLineTextInput = ({ isFocused = true, onChange, onSubmit, placeholder = "Type your answer...", value, }) => {
+    useInput((input, key) => {
+        if (!isFocused)
+            return;
+        // Normalize Enter key sequences that may arrive as raw input ("\r"/"\n").
+        // Prevent accidental carriage return insertion which causes line overwrite in terminals.
+        if (input === "\r" || input === "\n") {
+            if (key.shift) {
+                onChange(value + "\n");
+            }
+            else if (onSubmit && value.trim().length > 0) {
+                onSubmit();
+            }
+            return;
+        }
+        // Shift+Enter: Add newline
+        if (key.return && key.shift) {
+            onChange(value + "\n");
+            return;
+        }
+        // Enter: Submit (only if content is non-empty)
+        if (key.return) {
+            if (onSubmit && value.trim().length > 0) {
+                onSubmit();
+            }
+            return;
+        }
+        // Backspace: Remove last character
+        if (key.backspace || key.delete) {
+            onChange(value.slice(0, -1));
+            return;
+        }
+        // Regular character input (append)
+        if (input &&
+            !key.ctrl &&
+            !key.meta &&
+            !key.escape &&
+            input !== "\r" &&
+            input !== "\n") {
+            onChange(value + input);
+        }
+    }, { isActive: isFocused });
+    // Normalize any carriage returns that might already be present in value
+    const normalizedValue = value.replace(/\r\n?/g, "\n");
+    const hasContent = normalizedValue.length > 0;
+    const lines = hasContent ? normalizedValue.split("\n") : [placeholder];
+    return (React.createElement(Box, { flexDirection: "column" }, lines.map((line, index) => {
+        const isLastLine = index === lines.length - 1;
+        const showCursor = isFocused && isLastLine;
+        const isPlaceholder = !hasContent;
+        const lineHasContent = line.length > 0;
+        const displayText = lineHasContent ? line : showCursor ? "" : " ";
+        return (React.createElement(Text, { key: index, dimColor: isPlaceholder },
+            displayText,
+            showCursor && (React.createElement(Text, { color: theme.colors.focused, dimColor: true }, "\u258C"))));
+    })));
+};

package/dist/src/tui/components/OptionsList.js

@@ -0,0 +1,115 @@
+import { Box, Newline, Text, useInput } from "ink";
+import React, { useEffect, useState } from "react";
+import { theme } from "../theme.js";
+import { MultiLineTextInput } from "./MultiLineTextInput.js";
+/**
+ * OptionsList displays answer choices and handles arrow key navigation
+ * Uses ↑↓ to navigate, Enter to select
+ */
+export const OptionsList = ({ isFocused, onSelect, options, selectedOption, showCustomInput = false, customValue = "", onCustomChange, onAdvance, multiSelect = false, onToggle, selectedOptions = [], onFocusContextChange, }) => {
+    const [focusedIndex, setFocusedIndex] = useState(0);
+    // Calculate max index: include custom input option if enabled
+    const maxIndex = showCustomInput ? options.length : options.length - 1;
+    const isCustomInputFocused = showCustomInput && focusedIndex === options.length;
+    const customLines = customValue.replace(/\r\n?/g, "\n").split("\n");
+    // Track and emit focus context changes
+    useEffect(() => {
+        const newContext = isCustomInputFocused
+            ? "custom-input"
+            : "option";
+        onFocusContextChange?.(newContext);
+    }, [focusedIndex, isCustomInputFocused, onFocusContextChange]);
+    useInput((input, key) => {
+        if (!isFocused)
+            return;
+        if (key.upArrow) {
+            setFocusedIndex((prev) => Math.max(0, prev - 1));
+        }
+        if (key.downArrow) {
+            setFocusedIndex((prev) => Math.min(maxIndex, prev + 1));
+        }
+        if (multiSelect) {
+            // Multi-select mode
+            if (input === " ") {
+                // Spacebar: Toggle selection WITHOUT advancing
+                if (!isCustomInputFocused) {
+                    onToggle?.(options[focusedIndex].label);
+                }
+            }
+            if (key.return || key.tab) {
+                // Enter OR Tab: Advance to next question (don't toggle)
+                if (!isCustomInputFocused && onAdvance) {
+                    onAdvance();
+                }
+            }
+        }
+        else {
+            // Single-select mode
+            if (key.return) {
+                // Don't handle Return when custom input is focused - MultiLineTextInput handles it
+                if (isCustomInputFocused) {
+                    return;
+                }
+                // On regular option: select and advance
+                onSelect(options[focusedIndex].label);
+                if (onAdvance) {
+                    onAdvance();
+                }
+            }
+            if (key.tab) {
+                // Tab: Just advance (don't select)
+                if (onAdvance) {
+                    onAdvance();
+                }
+            }
+        }
+    }, { isActive: isFocused });
+    return (React.createElement(Box, { flexDirection: "column" },
+        options.map((option, index) => {
+            const isFocusedOption = isFocused && index === focusedIndex;
+            // Visual indicators
+            const indicator = isFocusedOption ? "→" : " ";
+            // Different icons for single vs multi-select
+            const isSelected = multiSelect
+                ? selectedOptions?.includes(option.label) || false
+                : selectedOption === option.label;
+            const selectionMark = multiSelect
+                ? isSelected
+                    ? "[✔]"
+                    : "[ ]" // Checkbox for multi-select
+                : isSelected
+                    ? "●"
+                    : "○"; // Radio for single-select
+            return (React.createElement(Box, { key: index, flexDirection: "column", marginTop: 0 },
+                React.createElement(Text, { bold: isFocusedOption || isSelected, color: isFocusedOption
+                        ? theme.components.options.focused
+                        : isSelected
+                            ? theme.components.options.selected
+                            : theme.components.options.default },
+                    indicator,
+                    " ",
+                    selectionMark,
+                    " ",
+                    option.label),
+                option.description && (React.createElement(Box, { marginLeft: 4 },
+                    React.createElement(Text, { color: isFocusedOption
+                            ? theme.components.options.focused
+                            : undefined, dimColor: !isFocusedOption }, option.description)))));
+        }),
+        showCustomInput && (React.createElement(Box, { marginTop: 0 },
+            React.createElement(Box, { flexDirection: "column" },
+                React.createElement(Text, { bold: isCustomInputFocused, color: isCustomInputFocused
+                        ? theme.components.options.focused
+                        : theme.components.options.default },
+                    isCustomInputFocused ? "→" : " ",
+                    " ",
+                    customValue ? "●" : "○",
+                    " Other (custom answer)"),
+                isCustomInputFocused && onCustomChange && (React.createElement(Box, { marginLeft: 2, marginTop: 0.5 },
+                    React.createElement(MultiLineTextInput, { isFocused: true, onChange: onCustomChange, onSubmit: onAdvance, placeholder: "Type your answer... (Shift+Enter for newline)", value: customValue }))),
+                !isCustomInputFocused && customValue && (React.createElement(Box, { marginLeft: 2, marginTop: 0.5 },
+                    React.createElement(Text, { dimColor: true }, customLines.map((line, idx) => (React.createElement(React.Fragment, { key: idx },
+                        idx === 0 ? "❯ " : "  ",
+                        line || " ",
+                        idx < customLines.length - 1 && React.createElement(Newline, null))))))))))));
+};

package/dist/src/tui/components/QuestionDisplay.js

@@ -0,0 +1,36 @@
+import { Box, Text } from "ink";
+import React, { useState } from "react";
+import { Footer } from "./Footer.js";
+import { OptionsList } from "./OptionsList.js";
+import { TabBar } from "./TabBar.js";
+/**
+ * QuestionDisplay shows a single question with its options
+ * Includes TabBar, question prompt, options list, and footer
+ */
+export const QuestionDisplay = ({ currentQuestion, currentQuestionIndex, customAnswer = "", onChangeCustomAnswer, onSelectOption, questions, selectedOption, onAdvanceToNext, answers, onToggleOption, multiSelect, }) => {
+    // Track focus context for Footer component
+    const [focusContext, setFocusContext] = useState("option");
+    // Handle option selection - clears custom answer only in single-select mode
+    const handleSelectOption = (label) => {
+        onSelectOption(label);
+        if (customAnswer && !multiSelect) {
+            onChangeCustomAnswer(""); // Clear custom answer when option selected (single-select only)
+        }
+    };
+    // Handle custom answer change - clears option selection only in single-select mode
+    const handleCustomAnswerChange = (text) => {
+        onChangeCustomAnswer(text);
+        if (selectedOption && text && !multiSelect) {
+            onSelectOption(""); // Clear option when custom text entered (single-select only)
+        }
+    };
+    return (React.createElement(Box, { flexDirection: "column" },
+        React.createElement(TabBar, { currentIndex: currentQuestionIndex, questions: questions, answers: answers }),
+        React.createElement(Box, { marginTop: 1 },
+            React.createElement(Text, { bold: true },
+                currentQuestion.prompt,
+                " "),
+            React.createElement(Text, { dimColor: true }, multiSelect ? "[Multiple Choice]" : "[Single Choice]")),
+        React.createElement(OptionsList, { customValue: customAnswer, isFocused: true, onAdvance: onAdvanceToNext, onCustomChange: handleCustomAnswerChange, onSelect: handleSelectOption, options: currentQuestion.options, selectedOption: selectedOption, showCustomInput: true, onToggle: onToggleOption, multiSelect: multiSelect, selectedOptions: answers.get(currentQuestionIndex)?.selectedOptions, onFocusContextChange: setFocusContext }),
+        React.createElement(Footer, { focusContext: focusContext, multiSelect: multiSelect ?? false, customInputValue: customAnswer })));
+};

package/dist/src/tui/components/ReviewScreen.js

@@ -0,0 +1,57 @@
+import { Box, Text, useInput } from "ink";
+import React from "react";
+import { theme } from "../theme.js";
+import { Footer } from "./Footer.js";
+/**
+ * ReviewScreen displays a summary of all answers for confirmation
+ * User can press Enter to confirm and submit, or 'n' to go back and edit
+ */
+export const ReviewScreen = ({ answers, onConfirm, onGoBack, questions, }) => {
+    useInput((input, key) => {
+        if (key.return) {
+            // Convert answers to UserAnswer format
+            const userAnswers = [];
+            answers.forEach((answer, questionIndex) => {
+                if (answer.selectedOption || answer.selectedOptions || answer.customText) {
+                    userAnswers.push({
+                        customText: answer.customText,
+                        questionIndex,
+                        selectedOption: answer.selectedOption,
+                        selectedOptions: answer.selectedOptions,
+                        timestamp: new Date().toISOString(),
+                    });
+                }
+            });
+            onConfirm(userAnswers);
+        }
+        if (input === "n") {
+            onGoBack();
+        }
+    });
+    return (React.createElement(Box, { flexDirection: "column" },
+        React.createElement(Box, { borderColor: theme.components.review.border, borderStyle: "single", marginBottom: 1, padding: 0.5 },
+            React.createElement(Text, { bold: true, color: theme.components.review.border }, "Review Your Answers")),
+        React.createElement(Box, { flexDirection: "column", marginBottom: 1 }, questions.map((question, index) => {
+            const answer = answers.get(index);
+            const questionTitle = question.title || `Q${index + 1}`;
+            return (React.createElement(Box, { flexDirection: "column", key: index, marginBottom: 1 },
+                React.createElement(Text, { bold: true },
+                    questionTitle,
+                    ". ",
+                    question.prompt),
+                React.createElement(Box, { marginLeft: 2, marginTop: 0.5 },
+                    answer?.selectedOptions && answer.selectedOptions.length > 0 && (React.createElement(Box, { flexDirection: "column" }, answer.selectedOptions.map((option, idx) => (React.createElement(Text, { key: idx, color: theme.components.review.selectedOption },
+                        "\u2192 ",
+                        option))))),
+                    answer?.selectedOption && (React.createElement(Text, { color: theme.components.review.selectedOption },
+                        "\u2192 ",
+                        answer.selectedOption)),
+                    answer?.customText && (React.createElement(Box, { flexDirection: "column" },
+                        answer.customText.split("\n").map((line, lineIndex) => (React.createElement(Text, { key: lineIndex, color: theme.components.review.customAnswer }, lineIndex === 0
+                            ? `→ Custom: "${line}`
+                            : `  ${line}`))),
+                        React.createElement(Text, { color: theme.components.review.customAnswer }, "\""))),
+                    !answer?.selectedOption && !answer?.customText && (React.createElement(Text, { dimColor: true }, "\u2192 (No answer provided)")))));
+        })),
+        React.createElement(Footer, { focusContext: "option", multiSelect: false, isReviewScreen: true })));
+};

package/dist/src/tui/components/SessionSelectionMenu.js

@@ -0,0 +1,151 @@
+import React, { useState, useEffect } from "react";
+import { Box, Text, useInput, useApp } from "ink";
+import { createTUIWatcher } from "../session-watcher.js";
+/**
+ * SessionSelectionMenu displays a list of pending question sets and allows user to select one
+ * Uses ↑↓ for navigation, Enter to select, q to quit
+ */
+export const SessionSelectionMenu = ({ onSessionSelect, }) => {
+    const { exit } = useApp();
+    const [sessions, setSessions] = useState([]);
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const [isLoading, setIsLoading] = useState(true);
+    const [error, setError] = useState(null);
+    // Load pending sessions on mount and start persistent watcher
+    useEffect(() => {
+        let watcherInstance = null;
+        const initialize = async () => {
+            try {
+                setIsLoading(true);
+                // Step 1: Load existing pending sessions
+                const watcher = createTUIWatcher();
+                const sessionIds = await watcher.getPendingSessions();
+                const sessionData = await Promise.all(sessionIds.map(async (sessionId) => {
+                    const sessionRequest = await watcher.getSessionRequest(sessionId);
+                    if (!sessionRequest)
+                        return null;
+                    return {
+                        sessionId,
+                        sessionRequest,
+                        timestamp: new Date(sessionRequest.timestamp),
+                    };
+                }));
+                // Filter out null entries and sort by timestamp (newest first)
+                const validSessions = sessionData
+                    .filter((s) => s !== null)
+                    .sort((a, b) => b.timestamp.getTime() - a.timestamp.getTime());
+                setSessions(validSessions);
+                setIsLoading(false);
+                // Step 2: Start persistent watcher for new sessions
+                watcherInstance = createTUIWatcher({ autoLoadData: true });
+                watcherInstance.startEnhancedWatching((event) => {
+                    // Add new session to queue (FIFO - append to end)
+                    setSessions((prev) => {
+                        // Check for duplicates
+                        if (prev.some((s) => s.sessionId === event.sessionId)) {
+                            return prev;
+                        }
+                        // Add to end of queue
+                        return [
+                            ...prev,
+                            {
+                                sessionId: event.sessionId,
+                                sessionRequest: event.sessionRequest,
+                                timestamp: new Date(event.timestamp),
+                            },
+                        ];
+                    });
+                });
+            }
+            catch (err) {
+                setError(err instanceof Error ? err.message : "Failed to load question sets");
+                setIsLoading(false);
+            }
+        };
+        initialize();
+        // Cleanup: stop watcher on unmount
+        return () => {
+            if (watcherInstance) {
+                watcherInstance.stop();
+            }
+        };
+    }, []);
+    // Handle keyboard input
+    useInput((input, key) => {
+        if (isLoading)
+            return;
+        if (key.upArrow && sessions.length > 0) {
+            setSelectedIndex((prev) => Math.max(0, prev - 1));
+        }
+        if (key.downArrow && sessions.length > 0) {
+            setSelectedIndex((prev) => Math.min(sessions.length - 1, prev + 1));
+        }
+        if (key.return && sessions[selectedIndex]) {
+            const { sessionId, sessionRequest } = sessions[selectedIndex];
+            onSessionSelect(sessionId, sessionRequest);
+        }
+        if (input === "q") {
+            exit();
+        }
+    });
+    // Loading state
+    if (isLoading) {
+        return (React.createElement(Box, { padding: 1 },
+            React.createElement(Text, null, "Loading question sets...")));
+    }
+    // Error state
+    if (error) {
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { color: "red" },
+                "Error: ",
+                error),
+            React.createElement(Text, { dimColor: true }, "Press q to quit")));
+    }
+    // Zero sessions state
+    if (sessions.length === 0) {
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { color: "yellow" }, "No pending question sets found."),
+            React.createElement(Text, { dimColor: true }, "Waiting for AI to ask questions..."),
+            React.createElement(Text, { dimColor: true }, "Press q to quit")));
+    }
+    // Session selection menu
+    return (React.createElement(Box, { flexDirection: "column", padding: 1, borderStyle: "round", borderColor: "cyan" },
+        React.createElement(Text, { bold: true }, "Select a pending question set:"),
+        React.createElement(Box, { marginTop: 1 }),
+        sessions.map((session, idx) => {
+            const isSelected = idx === selectedIndex;
+            const indicator = isSelected ? "→" : " ";
+            const questionCount = session.sessionRequest.questions.length;
+            const relativeTime = formatRelativeTime(session.sessionRequest.timestamp);
+            return (React.createElement(Text, { key: session.sessionId, color: isSelected ? "cyan" : "white" },
+                indicator,
+                " Question Set ",
+                idx + 1,
+                " (",
+                questionCount,
+                " ",
+                questionCount === 1 ? "question" : "questions",
+                ") - ",
+                relativeTime));
+        }),
+        React.createElement(Box, { marginTop: 1 }),
+        React.createElement(Text, { dimColor: true }, "\u2191\u2193 Navigate | Enter Select | q Quit")));
+};
+/**
+ * Format timestamp as relative time (e.g., "5m ago", "2h ago")
+ */
+function formatRelativeTime(timestamp) {
+    const now = Date.now();
+    const then = new Date(timestamp).getTime();
+    const diffMs = now - then;
+    const diffMins = Math.floor(diffMs / 60000);
+    if (diffMins < 1)
+        return "just now";
+    if (diffMins < 60)
+        return `${diffMins}m ago`;
+    const diffHours = Math.floor(diffMins / 60);
+    if (diffHours < 24)
+        return `${diffHours}h ago`;
+    const diffDays = Math.floor(diffHours / 24);
+    return `${diffDays}d ago`;
+}