@hncode/hncode 0.1.4 → 0.1.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hncode/hncode",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "hncode — A cyan-blue TUI AI coding agent with zero runtime dependencies.",
   "type": "module",
   "main": "src/index.js",

package/src/colors.js

@@ -33,9 +33,23 @@ export const BORDER = rgb(70, 130, 180);
 // terminal's own palette show through for everything else; `dark`/`light` pick
 // accent triples that stay readable on that background.
 const THEMES = {
-  auto: { teal: [0, 184, 219], cyan: [0, 215, 255], blue: [66, 135, 245], border: [70, 130, 180], hover: [190, 245, 255] },
-  dark: { teal: [0, 200, 230], cyan: [90, 225, 255], blue: [90, 150, 255], border: [80, 140, 190], hover: [190, 245, 255] },
-  light: { teal: [0, 120, 160], cyan: [0, 140, 200], blue: [40, 90, 200], border: [120, 160, 200], hover: [0, 80, 110] },
+  auto: { 
+    fg: [0, 184, 219], bg: [0, 18, 26], 
+    teal: [0, 184, 219], cyan: [0, 215, 255], blue: [66, 135, 245], border: [70, 130, 180], 
+    hover: [190, 245, 255], selBg: [0, 70, 84] 
+  },
+  dark: { 
+    fg: [0, 200, 230], bg: [0, 18, 26], 
+    teal: [0, 200, 230], cyan: [90, 225, 255], blue: [90, 150, 255], border: [80, 140, 190], 
+    hover: [190, 245, 255], selBg: [0, 70, 84] 
+  },
+  light: {
+    fg: [26, 26, 26], bg: [255, 255, 255],
+    teal: [0, 102, 128], cyan: [0, 122, 153], blue: [10, 77, 158], border: [138, 155, 176],
+    hover: [0, 78, 102], selBg: [200, 230, 239],
+    red: [179, 38, 30], green: [30, 122, 60], yellow: [160, 120, 0], orange: [178, 90, 0],
+    white: [26, 26, 26], gray: [85, 85, 85],
+  },
 };
 export const THEME_NAMES = Object.keys(THEMES);
 
@@ -101,20 +115,55 @@ export function lerpColor(r1, g1, b1, r2, g2, b2, t) {
 export function setTheme(name) {
   const t = THEMES[name];
   if (!t) return false;
+  
+  // Update foreground colors
   C.teal = rgb(...t.teal);
-  C.fg = C.teal;
+  C.fg = rgb(...t.fg);
   C.cyan = rgb(...t.cyan);
   C.blue = rgb(...t.blue);
   C.border = rgb(...t.border);
+  
+  // Update background colors
+  C.bg = brgb(...t.bg);
   C.bgTeal = brgb(...t.teal);
+  C.bgPanel = brgb(...t.bg);
+  C.selBg = brgb(...t.selBg);
+  
+  // Scrollbar colors - adjust based on theme brightness
+  const isLight = t.bg[0] > 128; // Simple brightness check
+  C.scrollTrack = isLight ? '\x1b[90m' : '\x1b[90m'; // dim gutter (works for both)
+  C.scrollThumb = rgb(...t.teal);
+  C.scrollThumbHover = rgb(...t.hover);
+  C.scrollThumbActive = rgb(t.teal[0] * 0.7, t.teal[1] * 0.7, t.teal[2] * 0.7);
+
   // Hover stays visible on this theme's background (bright on dark, dark on light).
   C.hover = '\x1b[1m' + rgb(...(t.hover || [190, 245, 255]));
+
+  // Semantic colors — swap to deep versions on light backgrounds.
+  if (t.white)  C.white  = rgb(...t.white);
+  if (t.gray)   C.gray   = rgb(...t.gray);
+  if (t.red)    C.red    = rgb(...t.red);
+  if (t.green)  C.green  = rgb(...t.green);
+  if (t.yellow) C.yellow = rgb(...t.yellow);
+  if (t.orange) C.orange = rgb(...t.orange);
+
   return true;
 }
 
 export function clearScreen() {
   return '\x1b[3J\x1b[H\x1b[2J';
 }
+
+// Clear screen and set background color based on current theme
+export function clearAndSetBg() {
+  // Reset all attributes first
+  const reset = '\x1b[0m';
+  // Clear screen
+  const clear = '\x1b[3J\x1b[H\x1b[2J';
+  // Set background color using current C.bg value
+  const bg = C.bg || '\x1b[48;2;0;18;26m'; // Default dark background
+  return reset + clear + bg;
+}
 export function eraseLine() {
   return '\x1b[2K';
 }

package/src/tui.js

@@ -18,7 +18,7 @@ import fs from 'node:fs';
 import os from 'node:os';
 import cp from 'node:child_process';
 import {
-  C, blockCursor, showCursor, hideCursor, alternateScreen, clearScreen, setTheme, THEME_NAMES, lerpColor,
+  C, blockCursor, showCursor, hideCursor, alternateScreen, clearScreen, clearAndSetBg, setTheme, THEME_NAMES, lerpColor,
 } from './colors.js';
 import { copyText, readText, warmClipboard, readImage } from './clipboard.js';
 import { visualWidth, estimateTokens, estimateMessagesTokens, expandTabs } from './term.js';
@@ -38,7 +38,7 @@ const VERSION = '0.1.0';
 export const COMMANDS = [
   { name: 'yolo', aliases: ['yes'], desc: 'Ask When Needed mode: anything inside the workspace (edits, writes, commands) runs automatically; paths outside it, destructive commands, questions and plans still ask.', priority: 101 },
   { name: 'permission', desc: 'Select permission mode', priority: 100 },
-  { name: 'settings', aliases: ['config'], desc: 'Open settings (model / permission / theme / statusline)', priority: 100 },
+  { name: 'settings', aliases: ['config'], desc: 'Open settings (model / permission / statusline)', priority: 100 },
   { name: 'plan', desc: 'Toggle plan mode', priority: 100, argumentHint: '[on|off|clear]' },
   { name: 'focus', desc: 'Toggle Focus mode (minimal tools first, full tools after)', priority: 98, argumentHint: '[on|off]' },
   { name: 'auto', desc: 'Never Ask mode: never interrupts you; everything runs and is decided automatically.', priority: 99 },
@@ -707,14 +707,15 @@ export function isFailureResult(text) {
 
 function msgColorFor(role, text) {
   if (role === 'system' && typeof text === 'string' && text.startsWith('[turn took')) return C.gray;
-  if (role === 'system') return C.green;
+  if (role === 'system') return C.teal;
   if (role === 'user') return C.cyan;
   if (role === 'warn') return C.orange;    // unfinished-turn warning
   if (role === 'queued') return C.gray;    // pending, not yet sent
   if (role === 'steer') return C.yellow;   // injected into the running turn
-  if (role === 'tool') return C.white;
+  if (role === 'tool') return C.blue;
   if (role === 'tool_result') return C.gray;
-  return C.white;
+  // Default foreground color based on theme
+  return C.fg;
 }
 
 // ---- tool call display: "Using Name (keyArg)" / "Used Name (keyArg) ----
@@ -2400,7 +2401,7 @@ export function makeState({ cfg, session, opts }) {
     planPath: (session && session.planPath) || null,
     focus: !!(session && session.focus),
     effort: (session && session.effort) || cfg.effort || (cfg.reasoning ? 'on' : 'off'),
-    theme: (cfg.raw && cfg.raw.theme) || 'auto',
+    // Theme removed - forced dark only
     addDirs: [],
     tasks: {},
     slMode: true, slModel: true, slEffort: true, slCwd: true, slTasks: true, slTips: true,
@@ -2561,7 +2562,6 @@ async function dispatch(cmdRaw, arg, state, cfg, session, h) {
           { label: 'effort', sub: 'switch thinking effort' },
           { label: 'permission', sub: 'select permission mode' },
           { label: 'provider', sub: 'manage AI providers' },
-          { label: 'theme', sub: 'set the terminal UI theme' },
           { label: 'statusline', sub: 'configure status line items' },
           { label: 'add-dir', sub: 'add an additional workspace directory' },
         ],
@@ -3161,6 +3161,18 @@ async function dispatch(cmdRaw, arg, state, cfg, session, h) {
             : `theme = "${name}"\n` + txt;
           fs.writeFileSync(f, next, 'utf8');
         } catch { }
+        
+        // Force a complete screen refresh with new theme colors
+        // We need to access stdout from the host context
+        if (host && typeof host.renderFrame === 'function') {
+          // Trigger immediate re-render which will use new theme colors
+          host.renderFrame();
+        } else {
+          // Fallback: just show message and let normal flow handle it
+          app(`Theme set to "${name}".`);
+          return true;
+        }
+        
         app(`Theme set to "${name}".`);
         return true;
       };
@@ -5422,7 +5434,7 @@ export async function startTUI(opts) {
     session.planPath = state.planPath || null;
     session.focus = !!state.focus;
     session.effort = state.effort || '';
-    session.theme = state.theme || 'auto';
+    // Theme removed - forced dark only
     session.steps = state.steps || 0;
     session.rounds = state.rounds || 0;
     if (state.lastTurnMs) session.lastTurnMs = state.lastTurnMs;