@manix-cli/manix 0.1.2 → 0.1.3

package/dist/agent.js

@@ -75,6 +75,7 @@ class Agent {
   }
   async send(text) {
     this.pushMessage({ role: "user", content: text });
+    this.h.onStats?.(this.stats());
     await this.run();
   }
   async run() {

package/dist/markdown.js

@@ -1,21 +1,35 @@
-import { t } from "./theme.js";
+import chalk from "chalk";
+import { t, color } from "./theme.js";
+const codeBg = chalk.bgHex("#1e2030");
+const codeText = chalk.hex(color.code).bgHex("#1e2030");
+const gutterCol = chalk.hex(color.border).bgHex("#1e2030");
+const labelCol = chalk.hex(color.faint);
+const termWidth = () => Math.min(process.stdout.columns || 80, 120);
 function renderMarkdown(md) {
   const out = [];
   let inCode = false;
+  let lang = "";
   for (const line of String(md).split("\n")) {
     const fence = line.match(/^\s*```(\S*)/);
     if (fence) {
       inCode = !inCode;
-      out.push(inCode ? t.faint("\u250C\u2574" + (fence[1] || "code")) : t.faint("\u2514\u2574"));
+      lang = fence[1] || "";
+      if (inCode) {
+        const label = lang ? ` ${lang} ` : " code ";
+        out.push(labelCol("  \u256D\u2500") + labelCol(label) + labelCol("\u2500".repeat(Math.max(2, termWidth() - label.length - 6))));
+      } else {
+        out.push(labelCol("  \u2570" + "\u2500".repeat(termWidth() - 3)));
+      }
       continue;
     }
     if (inCode) {
-      out.push(t.faint("\u2502 ") + t.code(line));
+      const padded = " " + line + " ".repeat(Math.max(0, termWidth() - line.length - 3));
+      out.push(gutterCol("  \u2502") + codeText(padded));
       continue;
     }
     out.push(renderLine(line));
   }
-  if (inCode) out.push(t.faint("\u2514\u2574"));
+  if (inCode) out.push(labelCol("  \u2570" + "\u2500".repeat(termWidth() - 3)));
   return out.join("\n");
 }
 function renderLine(line) {

package/dist/ui/Footer.js

@@ -8,14 +8,16 @@ function Footer({ model, stats, yolo, cwd, exitHint }) {
   if (exitHint) {
     return /* @__PURE__ */ jsx(Box, { paddingX: 1, children: /* @__PURE__ */ jsx(Text, { color: color.warn, children: "press ctrl+c again to exit" }) });
   }
-  const pct = stats.contextLength ? Math.min(99, Math.round(stats.tokens / stats.contextLength * 100)) : 0;
+  const raw = stats.contextLength ? stats.tokens / stats.contextLength * 100 : 0;
+  const pctDisplay = raw < 1 ? raw.toFixed(1) : Math.min(99, Math.round(raw));
+  const pct = Math.min(99, raw);
   const pctColor = pct < 50 ? color.dim : pct < 80 ? color.warn : color.err;
   return /* @__PURE__ */ jsxs(Box, { paddingX: 1, children: [
     /* @__PURE__ */ jsx(Text, { color: color.faint, children: model }),
     /* @__PURE__ */ jsx(Text, { color: color.faint, children: SEP }),
     /* @__PURE__ */ jsxs(Text, { color: pctColor, children: [
       "ctx ",
-      pct,
+      pctDisplay,
       "%"
     ] }),
     /* @__PURE__ */ jsx(Text, { color: color.faint, children: SEP }),

package/dist/ui/InputBox.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import React, { useState } from "react";
 import { Box, Text, useInput } from "ink";
 import chalk from "chalk";
@@ -39,7 +39,7 @@ function InputBox({ onSubmit, commands, active, history }) {
         return;
       }
       if (key.upArrow) {
-        if (menuOpen && matches.length) return setMenuIdx((i) => (i + matches.length - 1) % matches.length);
+        if (menuOpen && matches.length) return setMenuIdx((i) => (i - 1 + matches.length) % matches.length);
         if (history.length) {
           const next = histIdx === -1 ? history.length - 1 : Math.max(0, histIdx - 1);
           setHistIdx(next);
@@ -97,14 +97,34 @@ function InputBox({ onSubmit, commands, active, history }) {
     { isActive: active }
   );
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
-    menuOpen && matches.length > 0 && /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginLeft: 2, marginBottom: 1, children: matches.slice(0, 6).map((c, i) => /* @__PURE__ */ jsxs(Text, { children: [
-      /* @__PURE__ */ jsxs(Text, { color: i === sel ? color.accent : color.dim, children: [
-        i === sel ? "\u276F " : "  ",
-        "/",
-        c.name.padEnd(14)
-      ] }),
-      /* @__PURE__ */ jsx(Text, { color: color.faint, children: c.desc })
-    ] }, c.name)) }),
+    menuOpen && matches.length > 0 && /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginLeft: 2, marginBottom: 1, children: (() => {
+      const PAGE = 6;
+      const start = Math.min(Math.max(0, sel - PAGE + 1), Math.max(0, matches.length - PAGE));
+      const visible = matches.slice(start, start + PAGE);
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        start > 0 && /* @__PURE__ */ jsxs(Text, { color: color.faint, children: [
+          "  \u2191 ",
+          start,
+          " more"
+        ] }),
+        visible.map((c, j) => {
+          const abs = start + j;
+          return /* @__PURE__ */ jsxs(Text, { children: [
+            /* @__PURE__ */ jsxs(Text, { color: abs === sel ? color.accent : color.dim, children: [
+              abs === sel ? "\u276F " : "  ",
+              "/",
+              c.name.padEnd(14)
+            ] }),
+            /* @__PURE__ */ jsx(Text, { color: color.faint, children: c.desc })
+          ] }, c.name);
+        }),
+        start + PAGE < matches.length && /* @__PURE__ */ jsxs(Text, { color: color.faint, children: [
+          "  \u2193 ",
+          matches.length - start - PAGE,
+          " more"
+        ] })
+      ] });
+    })() }),
     /* @__PURE__ */ jsx(Text, { color: color.faint, children: hr(2) }),
     /* @__PURE__ */ jsxs(Box, { paddingX: 1, children: [
       /* @__PURE__ */ jsx(Text, { color: color.accent, children: "\u276F " }),

package/dist/ui/LogItem.js

@@ -7,10 +7,11 @@ import Mascot from "./Mascot.js";
 function LogItem({ item }) {
   switch (item.kind) {
     case "banner":
-      return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [
+      return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginTop: 1, marginBottom: 2, children: [
         /* @__PURE__ */ jsxs(Box, { flexDirection: "row", children: [
           /* @__PURE__ */ jsx(Mascot, {}),
           /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+            /* @__PURE__ */ jsx(Text, { children: " " }),
             /* @__PURE__ */ jsxs(Text, { children: [
               /* @__PURE__ */ jsx(Text, { bold: true, color: color.user, children: "Manix" }),
               /* @__PURE__ */ jsxs(Text, { color: color.faint, children: [
@@ -22,7 +23,7 @@ function LogItem({ item }) {
             /* @__PURE__ */ jsx(Text, { color: color.faint, children: item.cwd })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs(Box, { marginTop: 1, flexDirection: "column", children: [
+        /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginTop: 1, marginLeft: 1, children: [
           !item.hasManixmd && /* @__PURE__ */ jsxs(Text, { color: color.faint, children: [
             GLYPH.info,
             " MANIX.md not found \u2014 /init to create"
@@ -35,7 +36,7 @@ function LogItem({ item }) {
         ] })
       ] });
     case "user":
-      return /* @__PURE__ */ jsxs(Box, { marginTop: 1, children: [
+      return /* @__PURE__ */ jsxs(Box, { marginTop: 2, children: [
         /* @__PURE__ */ jsxs(Text, { color: color.accent, children: [
           GLYPH.user,
           " "

package/dist/ui/Mascot.js

@@ -1,11 +1,20 @@
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import React from "react";
 import { Box, Text } from "ink";
-import { MASCOT, color, lerpColor } from "../theme.js";
+import { color, lerpColor } from "../theme.js";
+const ROWS = 5;
+const lines = Array.from({ length: ROWS }, (_, i) => {
+  const glyphs = 2 * i + 1;
+  const pad = ROWS - 1 - i;
+  return { glyphs, pad };
+});
 function Mascot() {
-  return /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginRight: 2, children: MASCOT.map((row, i) => {
-    const c = lerpColor(color.accent, color.amber, MASCOT.length > 1 ? i / (MASCOT.length - 1) : 0);
-    return /* @__PURE__ */ jsx(Text, { children: [...row].map((ch, j) => ch === "#" ? c("\u2588\u2588") : "  ").join("") }, i);
+  return /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginRight: 2, children: lines.map(({ glyphs, pad }, i) => {
+    const c = lerpColor(color.accent, color.amber, i / (ROWS - 1));
+    return /* @__PURE__ */ jsxs(Text, { children: [
+      " ".repeat(pad),
+      c("\u25B2".repeat(glyphs))
+    ] }, i);
   }) });
 }
 export {

package/dist/ui/Picker.js

@@ -17,16 +17,18 @@ function Picker({ title, load, onSelect, onCancel }) {
   const filtered = (items || []).filter(
     (it) => (it.label + " " + (it.extra || "")).toLowerCase().includes(q.toLowerCase())
   );
-  const visible = filtered.slice(0, 10);
-  const sel = visible.length ? Math.min(idx, visible.length - 1) : 0;
+  const PAGE = 10;
+  const sel = filtered.length ? (idx % filtered.length + filtered.length) % filtered.length : 0;
+  const start = Math.min(Math.max(0, sel - PAGE + 1), Math.max(0, filtered.length - PAGE));
+  const visible = filtered.slice(start, start + PAGE);
   useInput((input, key) => {
     if (key.escape) return onCancel();
     if (key.return) {
-      if (visible.length) onSelect(visible[sel]);
+      if (filtered.length) onSelect(filtered[sel]);
       return;
     }
-    if (key.upArrow) return setIdx(() => Math.max(0, sel - 1));
-    if (key.downArrow) return setIdx(() => Math.min(visible.length - 1, sel + 1));
+    if (key.upArrow) return setIdx((i) => (i - 1 + filtered.length) % filtered.length);
+    if (key.downArrow) return setIdx((i) => (i + 1) % filtered.length);
     if (key.backspace || key.delete) {
       setQ((s) => s.slice(0, -1));
       setIdx(0);
@@ -46,17 +48,30 @@ function Picker({ title, load, onSelect, onCancel }) {
     ] }),
     error && /* @__PURE__ */ jsx(Text, { color: color.err, children: error }),
     !items && !error && /* @__PURE__ */ jsx(Text, { color: color.dim, children: "loading\u2026" }),
-    visible.map((it, i) => /* @__PURE__ */ jsxs(Text, { children: [
-      /* @__PURE__ */ jsxs(Text, { color: i === sel ? color.accent : color.user, children: [
-        i === sel ? "\u276F " : "  ",
-        it.label
-      ] }),
-      it.extra ? /* @__PURE__ */ jsxs(Text, { color: color.dim, children: [
-        "  ",
-        it.extra
-      ] }) : null
-    ] }, it.id ?? it.label)),
-    items && !visible.length && /* @__PURE__ */ jsx(Text, { color: color.dim, children: "no matches" }),
+    start > 0 && /* @__PURE__ */ jsxs(Text, { color: color.faint, children: [
+      "  \u2191 ",
+      start,
+      " more"
+    ] }),
+    visible.map((it) => {
+      const abs = filtered.indexOf(it);
+      return /* @__PURE__ */ jsxs(Text, { children: [
+        /* @__PURE__ */ jsxs(Text, { color: abs === sel ? color.accent : color.user, children: [
+          abs === sel ? "\u276F " : "  ",
+          it.label
+        ] }),
+        it.extra ? /* @__PURE__ */ jsxs(Text, { color: color.dim, children: [
+          "  ",
+          it.extra
+        ] }) : null
+      ] }, it.id ?? it.label);
+    }),
+    start + PAGE < filtered.length && /* @__PURE__ */ jsxs(Text, { color: color.faint, children: [
+      "  \u2193 ",
+      filtered.length - start - PAGE,
+      " more"
+    ] }),
+    items && !filtered.length && /* @__PURE__ */ jsx(Text, { color: color.dim, children: "no matches" }),
     /* @__PURE__ */ jsxs(Text, { color: color.faint, children: [
       "\u2191\u2193 select \xB7 enter confirm \xB7 esc cancel \xB7 ",
       filtered.length,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@manix-cli/manix",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Manix — a fast, beautiful terminal coding agent powered by OpenRouter. Any model, one key.",
   "type": "module",
   "bin": {