@stevezhou/sisu 0.1.2 → 0.1.3

package/dist/pager/render.js

@@ -1,24 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.stripAnsi = void 0;
 exports.renderPager = renderPager;
 const model_1 = require("./model");
 const theme_1 = require("./theme");
+Object.defineProperty(exports, "stripAnsi", { enumerable: true, get: function () { return theme_1.stripAnsi; } });
 const PROMPT_PREFIX = '› ';
 const PROMPT_BOX_ROWS = 2;
 const STATUS_ROWS = 1;
 const MARK_WIDTH = 2;
-/** Pad (and clip reserved chrome) to exactly `cols` cells. */
-function pad(line, cols) {
-    const width = Math.max(0, cols);
-    if (width === 0)
-        return '';
-    const plain = (0, theme_1.stripAnsi)(line);
-    if (plain.length === width)
-        return plain;
-    if (plain.length > width)
-        return plain.slice(0, width);
-    return plain.padEnd(width, ' ');
-}
 function wrapPlain(text, width) {
     const max = Math.max(1, width);
     if (!text)
@@ -40,6 +30,24 @@ function lineCount(text) {
         return 0;
     return text.split('\n').length;
 }
+function paintKind(kind, body, theme) {
+    if (!body)
+        return body;
+    if (kind === 'user')
+        return theme.user(body);
+    if (kind === 'tool')
+        return theme.tool(body);
+    if (kind === 'status')
+        return theme.dim(body);
+    return theme.text(body);
+}
+function entryPrefix(kind) {
+    if (kind === 'user')
+        return 'you  ';
+    if (kind === 'tool')
+        return 'tool ';
+    return '';
+}
 function entryBodyLines(entry, wrapWidth) {
     if (entry.folded) {
         const n = lineCount(entry.text);
@@ -48,18 +56,19 @@ function entryBodyLines(entry, wrapWidth) {
     }
     if (!entry.text)
         return [''];
-    return wrapPlain(entry.text, wrapWidth);
+    return wrapPlain(`${entryPrefix(entry.kind)}${entry.text}`, wrapWidth);
 }
-function layoutScrollback(state, cols) {
+function layoutScrollback(state, cols, theme) {
     const wrapWidth = Math.max(1, cols - MARK_WIDTH);
     const lines = [];
     const entryOf = [];
     for (let i = 0; i < state.entries.length; i += 1) {
         const entry = state.entries[i];
         const body = entryBodyLines(entry, wrapWidth);
-        const mark = i === state.selected && state.entries.length > 0 ? '▸ ' : '  ';
+        const selected = i === state.selected && state.entries.length > 0;
         for (let j = 0; j < body.length; j += 1) {
-            lines.push(j === 0 ? `${mark}${body[j]}` : `  ${body[j]}`);
+            const mark = selected && j === 0 ? theme.accent('▸ ') : '  ';
+            lines.push(`${mark}${paintKind(entry.kind, body[j], theme)}`);
             entryOf.push(i);
         }
     }
@@ -91,40 +100,45 @@ function windowAroundSelected(lines, entryOf, selected, budget, lastEntry) {
 function isIdleWelcome(state) {
     return !state.conversationId && state.entries.length === 0;
 }
-function welcomeLines(guest) {
+function center(text, width) {
+    const padLeft = Math.max(0, Math.floor((width - text.length) / 2));
+    return `${' '.repeat(padLeft)}${text}`;
+}
+function welcomeLines(guest, width, theme) {
+    const title = theme.accent(center('SISU', width));
     if (guest) {
         return [
-            'SISU',
+            title,
+            '',
+            theme.text(center('Sign in to start a conversation.', width)),
             '',
-            'Sign in to start a conversation.',
-            '/login   open the browser',
-            '/help    commands',
+            theme.dim(center('/login    browser', width)),
+            theme.dim(center('/help     commands', width)),
         ];
     }
     return [
-        'SISU',
+        title,
         '',
-        'Ask anything, or type /help.',
+        theme.dim(center('Ask anything, or type /help.', width)),
     ];
 }
-function slashMenuLines(state) {
+function slashMenuLines(state, theme) {
     if (!state.slashOpen)
         return [];
     const items = (0, model_1.filterSlash)(state.draft);
     return items.map((item, index) => {
-        const mark = index === state.slashIndex ? '› ' : '  ';
-        return `${mark}${item.name}  ${item.hint}`;
+        const active = index === state.slashIndex;
+        const mark = active ? theme.accent('› ') : '  ';
+        const name = active ? theme.accent(item.name) : theme.text(item.name);
+        return `${mark}${name}  ${theme.dim(item.hint)}`;
     });
 }
 /**
- * Pure fixed-grid frame: always `rows` lines, each exactly `cols` characters.
- * `theme` selects the SiSu palette via `getTheme` for future colored paint; the
- * frame itself is plain so `line.length === cols` for the tty writer.
- * Deterministic: no clock, no I/O.
+ * Fixed-grid frame: always `rows` lines, each `cols` visible cells.
+ * Colors are 24-bit SGR; measure width with stripAnsi / visibleWidth.
  */
-function renderPager(state, cols, rows, theme = 'dark') {
-    // Bind palette so dark/light stays on the public pure path (app may recolor).
-    (0, theme_1.getTheme)(theme);
+function renderPager(state, cols, rows, themeName = 'dark') {
+    const theme = (0, theme_1.getTheme)(themeName);
     const height = Math.max(0, rows);
     const width = Math.max(0, cols);
     if (height === 0)
@@ -133,38 +147,36 @@ function renderPager(state, cols, rows, theme = 'dark') {
     const statusRows = height > promptRows ? Math.min(STATUS_ROWS, height - promptRows) : 0;
     const chrome = promptRows + statusRows;
     const bodyBudget = Math.max(0, height - chrome);
-    const slash = slashMenuLines(state);
+    const slash = slashMenuLines(state, theme);
     const slashTake = Math.min(slash.length, bodyBudget);
     const guest = !(state.statusLine || '').trim() || (state.statusLine || '').includes('not signed in');
-    const welcome = isIdleWelcome(state) ? welcomeLines(guest).map((line) => (line ? `  ${line}` : '')) : [];
+    const welcome = isIdleWelcome(state) ? welcomeLines(guest, width, theme) : [];
     const welcomeTake = Math.min(welcome.length, Math.max(0, bodyBudget - slashTake));
     const scrollBudget = bodyBudget - slashTake - welcomeTake;
-    const laid = layoutScrollback(state, width);
+    const laid = layoutScrollback(state, width, theme);
     const lastEntry = Math.max(0, state.entries.length - 1);
     const visibleScroll = windowAroundSelected(laid.lines, laid.entryOf, state.selected, scrollBudget, lastEntry);
     const body = [];
     body.push(...welcome.slice(0, welcomeTake));
-    // Top-pad remaining scrollback so live status sits just above slash/prompt.
     while (body.length + visibleScroll.length < welcomeTake + scrollBudget) {
         body.push('');
     }
     body.push(...visibleScroll);
     body.push(...slash.slice(0, slashTake));
-    const lines = body.map((line) => pad(line, width));
+    const lines = body.map((line) => (0, theme_1.padVisible)(line, width));
     if (statusRows > 0) {
-        lines.push(pad(state.statusLine ?? '', width));
+        lines.push((0, theme_1.padVisible)(theme.dim(state.statusLine ?? ''), width));
     }
     if (promptRows >= 2) {
-        // Prompt box: border row + draft row (`› {draft}`).
-        lines.push(pad('─'.repeat(width), width));
-        lines.push(pad(`${PROMPT_PREFIX}${state.draft}`, width));
+        lines.push((0, theme_1.padVisible)(theme.border('─'.repeat(width)), width));
+        lines.push((0, theme_1.padVisible)(`${theme.accent(PROMPT_PREFIX)}${theme.text(state.draft)}`, width));
     }
     else if (promptRows === 1) {
-        lines.push(pad(`${PROMPT_PREFIX}${state.draft}`, width));
+        lines.push((0, theme_1.padVisible)(`${theme.accent(PROMPT_PREFIX)}${theme.text(state.draft)}`, width));
     }
     while (lines.length < height)
-        lines.push(pad('', width));
+        lines.push((0, theme_1.padVisible)('', width));
     if (lines.length > height)
         lines.length = height;
-    return lines.map((line) => pad(line, width)).join('\n');
+    return lines.map((line) => (0, theme_1.padVisible)(line, width)).join('\n');
 }

package/dist/pager/theme.js

@@ -1,8 +1,11 @@
 "use strict";
-/** SiSu pager palette: blue → purple → gold (same anchors as mobiusRgb). */
+/** SiSu pager palette: blue → purple → gold. */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getTheme = getTheme;
 exports.stripAnsi = stripAnsi;
+exports.visibleWidth = visibleWidth;
+exports.clipVisible = clipVisible;
+exports.padVisible = padVisible;
 const RESET = '\x1b[0m';
 function ansiRgb(r, g, b) {
     return `\x1b[38;2;${r};${g};${b}m`;
@@ -10,16 +13,17 @@ function ansiRgb(r, g, b) {
 function paint(prefix) {
     return (s) => (s ? `${prefix}${s}${RESET}` : s);
 }
-/** Brand anchors from mobiusRgb (blue, purple, gold). */
 const BLUE = ansiRgb(37, 99, 235);
 const PURPLE = ansiRgb(124, 58, 237);
 const GOLD = ansiRgb(217, 119, 6);
 const DARK = {
     text: paint(ansiRgb(230, 232, 240)),
-    dim: paint(ansiRgb(120, 126, 150)),
+    dim: paint(ansiRgb(118, 124, 148)),
     accent: paint(GOLD),
     error: paint(ansiRgb(239, 68, 68)),
-    border: paint(PURPLE),
+    border: paint(ansiRgb(72, 64, 96)),
+    user: paint(ansiRgb(156, 174, 214)),
+    tool: paint(PURPLE),
     reset: RESET,
 };
 const LIGHT = {
@@ -28,12 +32,56 @@ const LIGHT = {
     accent: paint(GOLD),
     error: paint(ansiRgb(185, 28, 28)),
     border: paint(BLUE),
+    user: paint(ansiRgb(37, 99, 180)),
+    tool: paint(PURPLE),
     reset: RESET,
 };
 function getTheme(name = 'dark') {
     return name === 'light' ? LIGHT : DARK;
 }
-/** Strip 24-bit / SGR sequences for visible-width measurement. */
 function stripAnsi(s) {
     return s.replace(/\x1b\[[0-9;]*m/g, '');
 }
+function visibleWidth(line) {
+    return stripAnsi(line).length;
+}
+function clipVisible(line, width) {
+    if (width <= 0)
+        return '';
+    if (visibleWidth(line) <= width)
+        return line;
+    let seen = 0;
+    let out = '';
+    const re = /\x1b\[[0-9;]*m/g;
+    let last = 0;
+    let match = re.exec(line);
+    while (match) {
+        for (let i = last; i < match.index && seen < width; i += 1) {
+            out += line[i];
+            seen += 1;
+        }
+        if (seen >= width)
+            break;
+        out += match[0];
+        last = match.index + match[0].length;
+        match = re.exec(line);
+    }
+    for (let i = last; i < line.length && seen < width; i += 1) {
+        if (line[i] === '\x1b')
+            break;
+        out += line[i];
+        seen += 1;
+    }
+    return out + RESET;
+}
+function padVisible(line, cols) {
+    const width = Math.max(0, cols);
+    if (width === 0)
+        return '';
+    const vis = visibleWidth(line);
+    if (vis === width)
+        return line;
+    if (vis > width)
+        return clipVisible(line, width);
+    return `${line}${' '.repeat(width - vis)}`;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stevezhou/sisu",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "SiSu CLI — one login, cloud quota, local workspace",
   "license": "UNLICENSED",
   "homepage": "https://www.sisu.chat",