tunacode-cli 0.1.21__py3-none-any.whl

tunacode/ui/styles/layout.tcss

@@ -0,0 +1,98 @@
+/* TunaCode Textual REPL Stylesheet
+ * NeXTSTEP Zone-Based Layout (Modern):
+ * ◇ tokens: 1.2k ◇ model ◇ $0.00 ◇ tunacode
+ * ┌────────────────────────────────────────────────────┐
+ * │                                                    │
+ * │  Main viewport (thin subtle border)                │
+ * │                                                    │
+ * ├──────────┬─────────────────────────────────────────┤
+ * │ Context  │   Editor (Enter to submit)              │
+ * └──────────┴─────────────────────────────────────────┘
+ */
+
+/* ============================================
+ * RESOURCE BAR - Compact, no border
+ * NeXTSTEP: "Glanceable, rarely changes"
+ * ============================================ */
+ResourceBar {
+    width: 100%;
+    height: 1;
+    background: $background;
+    padding: 0 1;
+}
+
+/* ============================================
+ * PRIMARY VIEWPORT - Unified container for RichLog + streaming
+ * NeXTSTEP: "Objects stay where put" - content lives in ONE zone
+ * ============================================ */
+#viewport {
+    height: 1fr;
+    border: solid $border;
+}
+
+/* Streaming mode - accent border on viewport (not RichLog) */
+#viewport.streaming {
+    border: solid $accent;
+}
+
+/* Pause mode - NeXTSTEP: "Modes must be visually apparent" */
+#viewport.paused {
+    border: solid $warning;
+}
+
+/* RichLog - inside viewport, no border */
+RichLog {
+    height: 1fr;
+    background: $background;
+    padding: 1;
+    scrollbar-gutter: stable;
+}
+
+/* ============================================
+ * LOADING INDICATOR - Hidden by default, shown during processing
+ * ============================================ */
+LoadingIndicator {
+    height: 1;
+    display: none;
+    background: $background;
+}
+
+LoadingIndicator.active {
+    display: block;
+}
+
+/* ============================================
+ * STREAMING OUTPUT - Live text display during generation
+ * Inside viewport container; dashed separator distinguishes live content
+ * ============================================ */
+#streaming-output {
+    height: auto;
+    max-height: 30%;
+    display: none;
+    background: $background;
+    padding: 0 1;
+    overflow-y: auto;
+    border-top: dashed #6272a4;
+}
+
+#streaming-output.active {
+    display: block;
+}
+
+/* ============================================
+ * EDITOR - Input bar (compact)
+ * ============================================ */
+Editor {
+    width: 1fr;
+    height: 6;
+    background: $background;
+    border-top: solid $border;
+    border-right: solid $border;
+    border-bottom: solid $border;
+    border-left: solid $border;
+    padding: 0 1;
+}
+
+Editor.bash-mode {
+    border: solid $success;
+}

tunacode/ui/styles/modals.tcss

@@ -0,0 +1,38 @@
+/* ============================================
+ * MODAL OVERLAYS - Tool Confirmation
+ * NeXTSTEP: "Controls change appearance immediately"
+ * ============================================ */
+ToolConfirmationModal {
+    align: center middle;
+}
+
+#modal-body {
+    width: 60;
+    height: auto;
+    border: solid $primary;
+    background: $surface;
+    padding: 1 2;
+}
+
+#modal-body Label {
+    margin-bottom: 1;
+}
+
+#modal-body Checkbox {
+    margin-top: 1;
+}
+
+#tool-title {
+    text-style: bold;
+    color: $primary;
+    margin-bottom: 1;
+}
+
+#actions {
+    margin-top: 1;
+    align: center middle;
+}
+
+#actions Button {
+    margin: 0 1;
+}

tunacode/ui/styles/panels.tcss

@@ -0,0 +1,81 @@
+/* ============================================
+ * RICH PANELS - Tool/Error/Search Display
+ * NeXTSTEP: "Objects that look the same should act the same"
+ * ============================================ */
+
+/* Tool execution panels - cyan accent */
+.tool-panel {
+    border: solid $primary;
+    background: $surface;
+    padding: 0 1;
+    margin: 0 0 1 0;
+}
+
+.tool-panel.running {
+    border: solid $accent;
+}
+
+.tool-panel.completed {
+    border: solid $success;
+}
+
+.tool-panel.failed {
+    border: solid $error;
+}
+
+/* Error panels - red border, recovery actions */
+.error-panel {
+    border: solid $error;
+    background: $surface;
+    padding: 0 1;
+    margin: 0 0 1 0;
+}
+
+.error-panel.warning {
+    border: solid $warning;
+}
+
+.error-panel.info {
+    border: solid $secondary;
+}
+
+/* Search result panels - accent border */
+.search-panel {
+    border: solid $accent;
+    background: $surface;
+    padding: 0 1;
+    margin: 0 0 1 0;
+}
+
+/* Pagination controls in search */
+.pagination {
+    height: 1;
+    padding: 0 1;
+    color: $text-muted;
+}
+
+/* Result item highlighting */
+.result-item {
+    padding: 0 1;
+}
+
+.result-item:hover {
+    background: $surface;
+}
+
+.result-item.selected {
+    background: $primary 20%;
+    border-left: solid $primary;
+}
+
+/* Recovery command styling */
+.recovery-command {
+    color: $primary;
+    text-style: underline;
+}
+
+/* Context detail styling */
+.context-detail {
+    color: $text-muted;
+    padding-left: 2;
+}

tunacode/ui/styles/theme-nextstep.tcss

@@ -0,0 +1,303 @@
+/* ============================================
+ * NEXTSTEP THEME OVERRIDES
+ * Classic 1990s NeXTSTEP look - Authentic styling
+ * Only applies when .theme-nextstep CSS class is active
+ *
+ * NeXTSTEP Color Reference:
+ *   Title bar:     #3a3a3a (dark charcoal)
+ *   Title text:    #e0e0e0 (light gray)
+ *   Window content:#d0d0d0 (light gray)
+ *   Surface:       #c8c8c8 (medium gray)
+ *   Background:    #acacac (desktop gray)
+ *   Border:        #2a2a2a (near black)
+ *   Bevel light:   #e8e8e8 (highlight)
+ *   Bevel dark:    #606060 (shadow)
+ * ============================================ */
+
+/* --- Base App --- */
+.theme-nextstep {
+    background: #acacac;
+}
+
+/* --- Resource Bar (Title Bar Style) --- */
+.theme-nextstep ResourceBar {
+    background: #3a3a3a;
+    color: #e0e0e0;
+    border-bottom: solid #2a2a2a;
+}
+
+.theme-nextstep ResourceBar Static {
+    color: #e0e0e0;
+}
+
+/* --- Main Viewport (Container - Window Content) --- */
+.theme-nextstep #viewport {
+    /* Raised 3D bevel: light top/left, dark bottom/right */
+    border-top: solid #e8e8e8;
+    border-left: solid #e8e8e8;
+    border-bottom: solid #606060;
+    border-right: solid #606060;
+}
+
+.theme-nextstep #viewport.streaming {
+    /* Inverted bevel = pressed/active state */
+    border-top: solid #606060;
+    border-left: solid #606060;
+    border-bottom: solid #e8e8e8;
+    border-right: solid #e8e8e8;
+}
+
+.theme-nextstep #viewport.paused {
+    border: double #2a2a2a;
+}
+
+.theme-nextstep RichLog {
+    background: #d0d0d0;
+    color: #000000;
+}
+
+/* --- Editor (Inset Input Field) --- */
+.theme-nextstep Editor {
+    background: #c8c8c8;
+    color: #000000;
+    /* Inset 3D bevel: dark top/left, light bottom/right */
+    border-top: solid #606060;
+    border-left: solid #606060;
+    border-bottom: solid #e8e8e8;
+    border-right: solid #e8e8e8;
+}
+
+.theme-nextstep Editor.bash-mode {
+    border: double #4ec9b0;
+}
+
+/* --- Status Bar (Bottom) --- */
+.theme-nextstep StatusBar {
+    background: #acacac;
+    color: #000000;
+    border-top: solid #606060;
+}
+
+.theme-nextstep StatusBar Static {
+    color: #000000;
+}
+
+.theme-nextstep #status-mid {
+    color: #404040;
+}
+
+.theme-nextstep #status-right {
+    color: #404040;
+}
+
+/* --- Loading Indicator --- */
+.theme-nextstep LoadingIndicator {
+    background: #c8c8c8;
+    color: #000000;
+}
+
+/* --- Streaming Output --- */
+.theme-nextstep #streaming-output {
+    background: #d0d0d0;
+    color: #000000;
+}
+
+/* --- Modal Dialogs --- */
+.theme-nextstep #modal-body {
+    background: #c8c8c8;
+    color: #000000;
+    /* Raised 3D bevel */
+    border-top: solid #e8e8e8;
+    border-left: solid #e8e8e8;
+    border-bottom: solid #606060;
+    border-right: solid #606060;
+}
+
+.theme-nextstep #tool-title {
+    background: #3a3a3a;
+    color: #e0e0e0;
+    text-style: bold;
+}
+
+/* --- Buttons (NeXTSTEP 3D beveled) --- */
+.theme-nextstep Button {
+    background: #acacac;
+    color: #000000;
+    text-style: bold;
+    /* Raised 3D bevel */
+    border-top: solid #e8e8e8;
+    border-left: solid #e8e8e8;
+    border-bottom: solid #606060;
+    border-right: solid #606060;
+}
+
+.theme-nextstep Button:hover {
+    background: #c8c8c8;
+}
+
+.theme-nextstep Button:focus {
+    /* Pressed = inverted bevel */
+    background: #acacac;
+    border-top: solid #606060;
+    border-left: solid #606060;
+    border-bottom: solid #e8e8e8;
+    border-right: solid #e8e8e8;
+}
+
+.theme-nextstep Button.-primary {
+    background: #acacac;
+    color: #000000;
+}
+
+.theme-nextstep Button.-success {
+    background: #acacac;
+    color: #000000;
+}
+
+.theme-nextstep Button.-warning {
+    background: #acacac;
+    color: #000000;
+}
+
+.theme-nextstep Button.-error {
+    background: #acacac;
+    color: #000000;
+}
+
+/* --- Tool Panels --- */
+.theme-nextstep .tool-panel {
+    background: #c8c8c8;
+    color: #000000;
+    /* Raised 3D bevel */
+    border-top: solid #e8e8e8;
+    border-left: solid #e8e8e8;
+    border-bottom: solid #606060;
+    border-right: solid #606060;
+}
+
+.theme-nextstep .tool-panel.running {
+    /* Active = inverted bevel */
+    border-top: solid #606060;
+    border-left: solid #606060;
+    border-bottom: solid #e8e8e8;
+    border-right: solid #e8e8e8;
+}
+
+.theme-nextstep .tool-panel.completed {
+    border: solid #2a2a2a;
+}
+
+.theme-nextstep .tool-panel.failed {
+    border: dashed #2a2a2a;
+}
+
+/* --- Error Panels --- */
+.theme-nextstep .error-panel {
+    background: #c8c8c8;
+    color: #000000;
+    border: dashed #2a2a2a;
+}
+
+.theme-nextstep .error-panel.warning {
+    border: solid #2a2a2a;
+}
+
+.theme-nextstep .error-panel.info {
+    border: solid #404040;
+}
+
+/* --- Search Panels --- */
+.theme-nextstep .search-panel {
+    background: #c8c8c8;
+    color: #000000;
+    border: solid #2a2a2a;
+}
+
+/* --- Checkboxes & Switches --- */
+.theme-nextstep Checkbox {
+    color: #000000;
+}
+
+.theme-nextstep Switch {
+    background: #acacac;
+    color: #000000;
+}
+
+/* --- Input Fields --- */
+.theme-nextstep Input {
+    background: #c8c8c8;
+    color: #000000;
+    /* Inset 3D bevel */
+    border-top: solid #606060;
+    border-left: solid #606060;
+    border-bottom: solid #e8e8e8;
+    border-right: solid #e8e8e8;
+}
+
+.theme-nextstep Input:focus {
+    border: solid #2a2a2a;
+}
+
+/* --- Labels & Static Text --- */
+.theme-nextstep Label {
+    color: #000000;
+}
+
+.theme-nextstep Static {
+    color: #000000;
+}
+
+/* --- OptionList (Theme Picker, etc) --- */
+.theme-nextstep OptionList {
+    background: #c8c8c8;
+    color: #000000;
+    border: solid #2a2a2a;
+}
+
+.theme-nextstep OptionList > .option-list--option-highlighted {
+    background: #3a3a3a;
+    color: #e0e0e0;
+    text-style: bold;
+}
+
+.theme-nextstep OptionList > .option-list--option-hover {
+    background: #acacac;
+}
+
+/* --- DataTable --- */
+.theme-nextstep DataTable {
+    background: #c8c8c8;
+    color: #000000;
+}
+
+.theme-nextstep DataTable > .datatable--header {
+    background: #3a3a3a;
+    color: #e0e0e0;
+    text-style: bold;
+}
+
+.theme-nextstep DataTable > .datatable--cursor {
+    background: #acacac;
+    color: #000000;
+}
+
+/* --- Recovery Commands --- */
+.theme-nextstep .recovery-command {
+    color: #000000;
+    text-style: bold underline;
+}
+
+/* --- Result Items --- */
+.theme-nextstep .result-item:hover {
+    background: #acacac;
+}
+
+.theme-nextstep .result-item.selected {
+    background: #acacac;
+    border-left: solid #2a2a2a;
+}
+
+/* --- Pagination --- */
+.theme-nextstep .pagination {
+    color: #404040;
+}

tunacode/ui/styles/widgets.tcss

@@ -0,0 +1,33 @@
+/* ============================================
+ * STATUS BAR - 3-column bottom status (no borders)
+ * NeXTSTEP: "left=identity, center=metrics, right=state"
+ * ============================================ */
+StatusBar {
+    height: 1;
+    width: 100%;
+    background: $background;
+}
+
+StatusBar Static {
+    color: $text;
+}
+
+#status-left {
+    width: 1fr;
+    text-align: left;
+    padding: 0 1;
+}
+
+#status-mid {
+    width: auto;
+    text-align: center;
+    color: $text-muted;
+    padding: 0 2;
+}
+
+#status-right {
+    width: 1fr;
+    text-align: right;
+    padding: 0 1;
+    color: $text-muted;
+}

tunacode/ui/styles.py

@@ -0,0 +1,18 @@
+"""Rich-compatible style constants for TunaCode UI.
+
+Centralizes color references to UI_COLORS for consistent theming.
+"""
+
+from tunacode.constants import UI_COLORS
+
+# Rich Text style strings (single colors)
+STYLE_PRIMARY = UI_COLORS["primary"]
+STYLE_ACCENT = UI_COLORS["accent"]
+STYLE_SUCCESS = UI_COLORS["success"]
+STYLE_WARNING = UI_COLORS["warning"]
+STYLE_ERROR = UI_COLORS["error"]
+STYLE_MUTED = UI_COLORS["muted"]
+
+# Composite styles
+STYLE_HEADING = f"bold {STYLE_ACCENT}"
+STYLE_SUBHEADING = f"bold {STYLE_PRIMARY}"

tunacode/ui/widgets/__init__.py

@@ -0,0 +1,23 @@
+"""Textual widgets for TunaCode REPL."""
+
+from .command_autocomplete import CommandAutoComplete
+from .editor import Editor
+from .file_autocomplete import FileAutoComplete
+from .messages import (
+    EditorCompletionsAvailable,
+    EditorSubmitRequested,
+    ToolResultDisplay,
+)
+from .resource_bar import ResourceBar
+from .status_bar import StatusBar
+
+__all__ = [
+    "CommandAutoComplete",
+    "Editor",
+    "EditorCompletionsAvailable",
+    "EditorSubmitRequested",
+    "FileAutoComplete",
+    "ResourceBar",
+    "StatusBar",
+    "ToolResultDisplay",
+]

tunacode/ui/widgets/command_autocomplete.py

@@ -0,0 +1,62 @@
+"""Slash command autocomplete dropdown widget."""
+
+from __future__ import annotations
+
+from textual.widgets import Input
+from textual_autocomplete import AutoComplete, DropdownItem, TargetState
+
+from tunacode.ui.commands import COMMANDS
+
+# Pre-compute sorted command items at module load (8 items)
+_COMMAND_ITEMS: list[tuple[str, str]] = sorted(
+    [(name, cmd.description) for name, cmd in COMMANDS.items()]
+)
+
+
+class CommandAutoComplete(AutoComplete):
+    """Real-time / command autocomplete dropdown."""
+
+    def __init__(self, target: Input) -> None:
+        super().__init__(target)
+
+    def get_search_string(self, target_state: TargetState) -> str:
+        """Extract text after / symbol at start of input."""
+        text = target_state.text
+        if not text.startswith("/"):
+            return ""
+
+        prefix = text[1 : target_state.cursor_position]
+        return "" if " " in prefix else prefix
+
+    def should_show_dropdown(self, search_string: str) -> bool:  # noqa: ARG002
+        """Show dropdown only while typing command (before space)."""
+        del search_string
+        if self.option_list.option_count == 0:
+            return False
+        # Hide once user has typed a space (command complete, now typing args)
+        target_state = self._get_target_state()
+        if not target_state.text.startswith("/"):
+            return False
+        # Check if there's a space before cursor (command already entered)
+        prefix = target_state.text[1 : target_state.cursor_position]
+        return " " not in prefix
+
+    def get_candidates(self, target_state: TargetState) -> list[DropdownItem]:
+        """Return command candidates for current search."""
+        if not target_state.text.startswith("/"):
+            return []
+
+        search = self.get_search_string(target_state).lower()
+        return [
+            DropdownItem(main=f"/{name} - {desc}")
+            for name, desc in _COMMAND_ITEMS
+            if name.startswith(search)
+        ]
+
+    def apply_completion(self, value: str, state: TargetState) -> None:
+        """Replace /command region with completed value, always add trailing space."""
+        command = value.split(" - ", 1)[0]  # Extracts "/model" from "/model - description"
+        trailing = state.text[state.cursor_position :].lstrip()
+        new_text = command + " " + trailing
+        self.target.value = new_text
+        self.target.cursor_position = len(command) + 1