ispbills-icli 6.0.0 → 6.1.0

package/README.md

@@ -133,6 +133,7 @@ iCli connects to the same AI engine as the in-browser terminal:
 - **Streaming output** — answers stream live with a thinking indicator, reasoning, and step-by-step server progress  
 - **Plans & connect cards** — proposed fixes render as a reviewable plan (`apply fix` to confirm); device connections show as a connect card  
 - **Zero dependencies** — pure Node.js (built-ins only), so it installs instantly and runs the same on Windows, macOS, and Linux  
+- **Terminal-aware rendering** — full-width separators, and automatic ASCII-safe glyphs on classic Windows consoles (`cmd.exe` / legacy PowerShell) so nothing shows as broken boxes  
 
 ---
 

package/bin/icli.js

@@ -16,7 +16,7 @@ import {
   SLASH_COMMANDS, slashCompleter, slashToQuestion, printSlashMenu, printHistory,
 } from '../src/commands.js';
 import {
-  RESET, BOLD, DIM, GRAY, WHITE, ACCENT, GREEN, YELLOW, RED, CYAN, rule,
+  RESET, BOLD, DIM, GRAY, WHITE, ACCENT, GREEN, YELLOW, RED, CYAN, rule, glyphs,
 } from '../src/ui.js';
 
 const PKG_NAME = 'ispbills-icli';
@@ -78,10 +78,10 @@ function selfUpdate() {
   });
 
   if (res.status === 0) {
-    process.stdout.write(`\n  ${GREEN}✓${RESET} iCli updated. ${DIM}Restart iCli to use the new version.${RESET}\n\n`);
+    process.stdout.write(`\n  ${GREEN}${glyphs.check}${RESET} iCli updated. ${DIM}Restart iCli to use the new version.${RESET}\n\n`);
     return true;
   }
-  process.stdout.write(`\n  ${RED}✖${RESET} Update failed. Try manually:\n`);
+  process.stdout.write(`\n  ${RED}${glyphs.cross}${RESET} Update failed. Try manually:\n`);
   process.stdout.write(`    ${ACCENT}npm install -g ${PKG_NAME}@latest${RESET}\n`);
   process.stdout.write(`  ${DIM}On some systems this needs elevated privileges (sudo / Administrator).${RESET}\n\n`);
   return false;
@@ -132,7 +132,7 @@ async function ensureAuth() {
   if (!cfg) {
     process.stdout.write(`\n  ${YELLOW}No saved credentials. Setting up iCli.${RESET}\n\n`);
     cfg = await loginFlow();
-    process.stdout.write(`\n  ${GREEN}✓${RESET} Logged in as ${WHITE}${cfg.user?.name ?? cfg.user?.email}${RESET}` +
+    process.stdout.write(`\n  ${GREEN}${glyphs.check}${RESET} Logged in as ${WHITE}${cfg.user?.name ?? cfg.user?.email}${RESET}` +
       `${DIM} · ${cfg.user?.role ?? 'operator'}${RESET}\n\n`);
   }
   return cfg;
@@ -140,7 +140,7 @@ async function ensureAuth() {
 
 // ── One conversation turn ───────────────────────────────────────────────────────
 async function runTurn(cfg, history, renderer, loader, question, { echo = false } = {}) {
-  if (echo) console.log(`\n  ${GRAY}❯${RESET} ${DIM}${question}${RESET}`);
+  if (echo) console.log(`\n  ${GRAY}${glyphs.prompt}${RESET} ${DIM}${question}${RESET}`);
   history.push({ role: 'user', content: question });
 
   const abort = new AbortController();
@@ -168,7 +168,7 @@ async function runTurn(cfg, history, renderer, loader, question, { echo = false
     if (abort.signal.aborted) {
       console.log(`\n  ${DIM}Interrupted.${RESET}\n`);
     } else {
-      console.log(`\n  ${RED}✖${RESET} ${WHITE}${e.message}${RESET}\n`);
+      console.log(`\n  ${RED}${glyphs.cross}${RESET} ${WHITE}${e.message}${RESET}\n`);
     }
   } finally {
     process.removeListener('SIGINT', onSigint);
@@ -187,7 +187,7 @@ async function interactiveRepl(cfg) {
   const history = [];
   const renderer = new TuiRenderer({ display });
   const loader = new Loader(display.loader);
-  const PROMPT = () => `  ${ACCENT}❯${RESET} `;
+  const PROMPT = () => `  ${ACCENT}${glyphs.prompt}${RESET} `;
   let busy = false;
 
   printBanner(cfg, { model: cfg._model });
@@ -227,7 +227,7 @@ async function interactiveRepl(cfg) {
     }
     if (q === '/new') {
       history.length = 0;
-      console.log(`\n  ${GREEN}✓${RESET} ${DIM}New conversation started.${RESET}\n`); rl.prompt(); return;
+      console.log(`\n  ${GREEN}${glyphs.check}${RESET} ${DIM}New conversation started.${RESET}\n`); rl.prompt(); return;
     }
     if (q === '/help' || q === 'help') { printHelp(); rl.prompt(); return; }
     if (q === '/history' || q === 'history') { printHistory(history); rl.prompt(); return; }
@@ -237,7 +237,7 @@ async function interactiveRepl(cfg) {
     }
     if (q === '/logout' || q === 'logout') {
       const cleared = clearConfig();
-      console.log(`\n  ${cleared ? GREEN + '✓' + RESET + ' Logged out — credentials cleared.' : YELLOW + 'Already logged out.' + RESET}`);
+      console.log(`\n  ${cleared ? GREEN + glyphs.check + RESET + ' Logged out — credentials cleared.' : YELLOW + 'Already logged out.' + RESET}`);
       console.log(`  ${DIM}Run ${RESET}${ACCENT}icli login${RESET}${DIM} to sign in again.${RESET}\n`);
       rl.close(); return;
     }
@@ -264,7 +264,7 @@ async function main() {
 
   if (cmd === 'login') {
     const cfg = await loginFlow();
-    console.log(`\n  ${GREEN}✓${RESET} Logged in as ${WHITE}${cfg.user?.name ?? cfg.user?.email}${RESET}${DIM} · ${cfg.user?.role ?? 'operator'}${RESET}`);
+    console.log(`\n  ${GREEN}${glyphs.check}${RESET} Logged in as ${WHITE}${cfg.user?.name ?? cfg.user?.email}${RESET}${DIM} · ${cfg.user?.role ?? 'operator'}${RESET}`);
     console.log(`  ${DIM}Config: ${configPath()}${RESET}\n`);
     return;
   }
@@ -274,7 +274,7 @@ async function main() {
   if (cmd === 'logout') {
     const cleared = clearConfig();
     if (cleared) {
-      console.log(`\n  ${GREEN}✓${RESET} Logged out — credentials cleared.`);
+      console.log(`\n  ${GREEN}${glyphs.check}${RESET} Logged out — credentials cleared.`);
       console.log(`  ${DIM}Run ${RESET}${ACCENT}icli login${RESET}${DIM} to sign in again.${RESET}\n`);
     } else {
       console.log(`\n  ${YELLOW}Not logged in.${RESET} Nothing to clear.\n`);
@@ -305,6 +305,6 @@ async function main() {
 }
 
 main().catch((e) => {
-  console.log(`\n  ${RED}✖${RESET} ${WHITE}${e.message}${RESET}\n`);
+  console.log(`\n  ${RED}${glyphs.cross}${RESET} ${WHITE}${e.message}${RESET}\n`);
   exit(1);
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ispbills-icli",
-  "version": "6.0.0",
+  "version": "6.1.0",
   "description": "iCli — IspBills AI network engineer in your terminal",
   "keywords": [
     "ispbills",

package/src/banner.js

@@ -1,4 +1,4 @@
-import { RESET, BOLD, DIM, CYAN, WHITE, ACCENT, GRAY, cols, shortModel, rule } from './ui.js';
+import { RESET, BOLD, DIM, CYAN, WHITE, ACCENT, GRAY, cols, shortModel, rule, hr } from './ui.js';
 
 const LOGO = [
   '  ██╗ ██████╗ ██████╗ ██████╗ ██╗██╗      ██████╗ ████████╗',
@@ -9,8 +9,12 @@ const LOGO = [
   '  ╚═╝ ╚═════╝ ╚═════╝ ╚═╝     ╚═╝╚══════╝ ╚═════╝    ╚═╝   ',
 ];
 
+// Widest visible logo line — used to decide when to fall back to a compact header.
+const LOGO_WIDTH = Math.max(...LOGO.map((l) => l.length));
+
 /**
  * Full iCopilot banner. On narrow terminals falls back to a compact header.
+ * A full-width rule frames the header so it uses the whole window.
  *
  * @param {object} cfg   Loaded config ({ url, user, _model }).
  * @param {object} opts  { model }
@@ -20,13 +24,11 @@ export function printBanner(cfg = {}, opts = {}) {
   const model = opts.model || cfg._model || 'IspBills AI';
 
   console.log();
-  if (width >= 62) {
+  if (width >= LOGO_WIDTH) {
     for (const line of LOGO) console.log(ACCENT + BOLD + line + RESET);
     console.log(`             ${DIM}iCopilot — network engineer in your terminal${RESET}`);
   } else {
-    console.log(rule());
     console.log(` ${BOLD}iCopilot${RESET} ${DIM}— IspBills AI terminal${RESET}`);
-    console.log(rule());
   }
   console.log();
 
@@ -39,4 +41,6 @@ export function printBanner(cfg = {}, opts = {}) {
   console.log();
   console.log(`  ${DIM}Type a message to start.  ${RESET}${ACCENT}/help${RESET}${DIM} for commands  ·  ${RESET}${ACCENT}Ctrl+C${RESET}${DIM} to exit${RESET}`);
   console.log();
+  hr();
+  console.log();
 }

package/src/loader.js

@@ -1,6 +1,6 @@
-import { DIM, RESET } from './ui.js';
+import { DIM, RESET, SPINNER } from './ui.js';
 
-const SPINNER_FRAMES = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
+const SPINNER_FRAMES = SPINNER;
 
 const GRADIENT_COLORS = [
   '\x1b[38;5;240m',

package/src/renderer.js

@@ -1,19 +1,19 @@
 import {
   RESET, BOLD, DIM, ITALIC, CYAN, GREEN, YELLOW, RED, GRAY, WHITE, ACCENT,
-  cols, shortModel,
+  cols, shortModel, glyphs, hr,
 } from './ui.js';
 
 /** Pick a status icon from the content of a server progress line. */
 function statusIcon(line) {
   const l = line.toLowerCase();
-  if (/unreachable|skip|fail|error|denied|timeout/.test(l)) return `${RED}✗${RESET}`;
-  if (/done|success|found|complet|online|ready|ok\b/.test(l)) return `${GREEN}✓${RESET}`;
-  if (/batch|sub.?agent|fleet|parallel/.test(l)) return `${ACCENT}◈${RESET}`;
-  if (/\[\d+\/\d+\]/.test(l)) return `${ACCENT}◉${RESET}`;
-  if (/probe|reachab|ping/.test(l)) return `${YELLOW}◎${RESET}`;
-  if (/connect|ssh|telnet|api|session/.test(l)) return `${ACCENT}⇢${RESET}`;
-  if (/read|fetch|get|query|look|search/.test(l)) return `${GRAY}↓${RESET}`;
-  return `${GRAY}·${RESET}`;
+  if (/unreachable|skip|fail|error|denied|timeout/.test(l)) return `${RED}${glyphs.cross}${RESET}`;
+  if (/done|success|found|complet|online|ready|ok\b/.test(l)) return `${GREEN}${glyphs.check}${RESET}`;
+  if (/batch|sub.?agent|fleet|parallel/.test(l)) return `${ACCENT}${glyphs.ring}${RESET}`;
+  if (/\[\d+\/\d+\]/.test(l)) return `${ACCENT}${glyphs.diamond}${RESET}`;
+  if (/probe|reachab|ping/.test(l)) return `${YELLOW}${glyphs.target}${RESET}`;
+  if (/connect|ssh|telnet|api|session/.test(l)) return `${ACCENT}${glyphs.arrow}${RESET}`;
+  if (/read|fetch|get|query|look|search/.test(l)) return `${GRAY}${glyphs.down}${RESET}`;
+  return `${GRAY}${glyphs.bullet}${RESET}`;
 }
 
 /**
@@ -67,7 +67,7 @@ export class TuiRenderer {
     let out = line
       .replace(/\*\*(.+?)\*\*/g, `${BOLD}$1${RESET}`)
       .replace(/`([^`]+)`/g, `${CYAN}$1${RESET}`)
-      .replace(/^(\s*)[-*]\s+/, `$1${ACCENT}·${RESET} `);
+      .replace(/^(\s*)[-*]\s+/, `$1${ACCENT}${glyphs.bullet}${RESET} `);
     return '  ' + out;
   }
 
@@ -89,7 +89,7 @@ export class TuiRenderer {
     if (!this.display.reasoning) return;
     this.endStreaming();
     if (!this.reasoningOpen) {
-      process.stdout.write(`\n  ${ACCENT}◆${RESET} ${DIM}Reasoning${RESET}\n  ${GRAY}`);
+      process.stdout.write(`\n  ${ACCENT}${glyphs.reasoning}${RESET} ${DIM}Reasoning${RESET}\n  ${GRAY}`);
       this.reasoningOpen = true;
     }
     process.stdout.write(delta.replace(/\n/g, `\n  ${GRAY}`));
@@ -126,16 +126,16 @@ export class TuiRenderer {
   }
 
   renderPlan(reply) {
-    console.log(`\n  ${ACCENT}${BOLD}◆ Plan${RESET}`);
+    console.log(`\n  ${ACCENT}${BOLD}${glyphs.diamond} Plan${RESET}`);
     if (reply.summary) console.log(`  ${DIM}${reply.summary}${RESET}`);
     const steps = reply.steps || [];
     steps.forEach((s, i) => {
       const last = i === steps.length - 1;
-      const branch = `${GRAY}${last ? '└─' : '├─'}${RESET}`;
+      const branch = `${GRAY}${last ? glyphs.branchEnd : glyphs.branchMid}${RESET}`;
       const risk =
-        (s.risk === 'destructive' || s.risk === 'high') ? ` ${RED}⚠ destructive${RESET}` :
-        (s.risk === 'caution' || s.risk === 'medium') ? ` ${YELLOW}⚡ caution${RESET}` : '';
-      const blocked = s.blocked ? ` ${RED}⛔ blocked${RESET}` : '';
+        (s.risk === 'destructive' || s.risk === 'high') ? ` ${RED}${glyphs.warn} destructive${RESET}` :
+        (s.risk === 'caution' || s.risk === 'medium') ? ` ${YELLOW}${glyphs.bolt} caution${RESET}` : '';
+      const blocked = s.blocked ? ` ${RED}${glyphs.block} blocked${RESET}` : '';
       console.log(`  ${branch} ${DIM}${i + 1}.${RESET} ${YELLOW}${s.cmd || ''}${RESET}${risk}${blocked}`);
       const why = s.why || s.purpose;
       if (why) console.log(`     ${GRAY}${why}${RESET}`);
@@ -147,7 +147,7 @@ export class TuiRenderer {
     const d = reply.device ?? reply ?? {};
     const proto = d.proto ? ` ${DIM}via ${d.proto}${RESET}` : '';
     console.log(
-      `\n  ${GREEN}🔌${RESET} ${BOLD}${(d.kind ?? '?').toUpperCase()} #${d.id ?? '?'}${RESET}${proto}`
+      `\n  ${GREEN}${glyphs.plug}${RESET} ${BOLD}${(d.kind ?? '?').toUpperCase()} #${d.id ?? '?'}${RESET}${proto}`
     );
     if (reply.note) console.log(`  ${DIM}${reply.note}${RESET}`);
     console.log(`  ${DIM}Establishing session…${RESET}`);
@@ -155,8 +155,10 @@ export class TuiRenderer {
 
   renderFooter(meta) {
     const parts = [meta.model ? shortModel(meta.model) : null, meta.user, meta.role].filter(Boolean);
+    console.log();
+    hr();
     if (parts.length) {
-      console.log(`\n  ${GRAY}${parts.join('  ·  ')}${RESET}`);
+      console.log(`  ${GRAY}${parts.join('  ·  ')}${RESET}`);
     }
   }
 }

package/src/ui.js

@@ -53,6 +53,37 @@ export function rule(color = GRAY) {
   return paint(color, '─'.repeat(cols()));
 }
 
+// ── Glyphs ─────────────────────────────────────────────────────────────────
+// Classic Windows consoles (cmd.exe / legacy PowerShell using the Consolas or
+// raster font) lack many Unicode dingbats, geometric shapes, arrows, braille
+// and emoji — they render as "tofu" boxes. Windows Terminal sets WT_SESSION,
+// so we only fall back to ASCII on a classic Windows console.
+const ASCII_SAFE = process.platform === 'win32' && !process.env.WT_SESSION;
+
+export const glyphs = ASCII_SAFE
+  ? {
+      prompt: '>', bullet: '-', diamond: '*', ring: '*', target: 'o',
+      arrow: '->', down: 'v', check: 'OK', cross: 'XX', warn: '!!',
+      bolt: '!', block: 'X', plug: '>>', reasoning: '~',
+      branchMid: '|-', branchEnd: '`-', vbar: '|',
+    }
+  : {
+      prompt: '❯', bullet: '·', diamond: '◆', ring: '◈', target: '◎',
+      arrow: '⇢', down: '↓', check: '✓', cross: '✗', warn: '⚠',
+      bolt: '⚡', block: '⛔', plug: '🔌', reasoning: '◆',
+      branchMid: '├─', branchEnd: '└─', vbar: '│',
+    };
+
+/** Spinner frames — braille on modern terminals, ASCII on classic Windows. */
+export const SPINNER = ASCII_SAFE
+  ? ['|', '/', '-', '\\']
+  : ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
+
+/** Print a full-width horizontal rule (dim by default). */
+export function hr(color = GRAY) {
+  process.stdout.write(paint(color, '─'.repeat(cols())) + '\n');
+}
+
 /** Shorten a fully-qualified model id for display (e.g. "anthropic/claude-…"). */
 export function shortModel(m) {
   if (!m) return '';