zames_pro 2.83.4 → 2.84.0

package/CHANGELOG.md

@@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [2.84.0] - 2026-10-27
+
+### Added
+
+- **ui:** theme previews, 6 more palettes, inline /config preview
+
 ## [2.83.4] - 2026-10-27
 
 ### Fixed

package/README.md

@@ -631,10 +631,14 @@ The switch is instant, no restart. `zames` is the default; the bundled palettes
 are ports of well-known editor schemes:
 
 `zames` (default), `one-dark`, `dracula`, `gruvbox`, `nord`, `monokai`,
-`solarized-dark`, `tokyo-night`.
+`solarized-dark`, `tokyo-night`, `catppuccin`, `github-dark`, `ayu`,
+`rose-pine`, `everforest`, `kanagawa`.
 
 A theme repaints EVERYTHING: the interface, the agent's answers, the code
-highlighting inside them and the input frame. The frame itself is a separate
+highlighting inside them, the status row and the input frame. To make the choice
+concrete, a SAMPLE SESSION in that palette is shown before you pick (in `/theme`
+below the list, in `/config` press `p` on the theme row); after
+`/theme <id>` the sample is printed too. The frame itself is a separate
 setting: `/config set ui.inputBorder <round|single|double|bold|none>`
 (default `round`; `none` removes it).
 
@@ -1359,11 +1363,16 @@ enum переключаются на месте; числа и строки от
 редакторов:
 
 `zames` (по умолчанию), `one-dark`, `dracula`, `gruvbox`, `nord`, `monokai`,
-`solarized-dark`, `tokyo-night`.
-
-Тема перекрашивает ВСЁ: интерфейс, ответы агента, подсветку кода в ответах и
-рамку ввода. Саму рамку можно менять отдельно: `/config set ui.inputBorder
-<round|single|double|bold|none>` (по умолчанию `round`, `none` — без рамки).
+`solarized-dark`, `tokyo-night`, `catppuccin`, `github-dark`, `ayu`,
+`rose-pine`, `everforest`, `kanagawa`.
+
+Тема перекрашивает ВСЁ: интерфейс, ответы агента, подсветку кода в ответах,
+строку статуса и рамку ввода. Чтобы было видно, ЧТО меняется, перед выбором
+показывается образец сессии в этой палитре (в `/theme` — под списком, в
+`/config` — клавиша `p` на строке темы). После применения `/theme <id>`
+образец печатается в терминал. Саму рамку можно менять отдельно:
+`/config set ui.inputBorder <round|single|double|bold|none>` (по умолчанию
+`round`, `none` — без рамки).
 
 Данные агента хранятся в `~/.zames`: профиль браузера, логи, история undo,
 сессии.

package/dist/i18n/deepseek.js

@@ -212,6 +212,14 @@ export const deepseekMessages = {
         ru: '✔ Сохранено: {v} = {value}',
         en: '✔ Saved: {v} = {value}',
     },
+    'cfg.menu.theme_preview': {
+        ru: 'Так тема выглядит в работе:',
+        en: 'How the theme looks in a session:',
+    },
+    'cfg.menu.theme_preview_key': {
+        ru: 'пример темы',
+        en: 'theme sample',
+    },
     'cfg.menu.default': { ru: 'по умолчанию', en: 'default' },
     'cfg.menu.filter_hint': {
         ru: '/ — поиск по настройкам, d — сбросить (дважды), * — изменено от дефолта',

package/dist/index.js

@@ -5,6 +5,7 @@ import fs from 'fs/promises';
 import { readFileSync, statSync } from 'fs';
 import { fileURLToPath } from 'url';
 import { theme, applyTheme, themeColors, themeNames, currentThemeName, isThemeName, } from './theme.js';
+import { themePreviewAnsi } from './tui/theme-preview.js';
 import { setInputBorder } from './tui/ui-colors.js';
 import { DeepSeekBrowser, headlessUACacheReady } from './browser.js';
 import { QwenBrowser } from './qwen-browser.js';
@@ -2249,6 +2250,11 @@ async function main() {
                 return;
             }
             emit(theme.assistant(t('theme.set', { v: applyThemeById(arg) })));
+            // A terminal can only show colors it can paint, and the operator asked
+            // "what exactly changes?" — print a sample of every role in the new
+            // palette right below the confirmation.
+            emit('');
+            emit(themePreviewAnsi(arg));
             return;
         }
         // No argument: a pick list in the TUI, the id list otherwise. The cursor
@@ -2278,6 +2284,8 @@ async function main() {
             }
             if (picked) {
                 emit(theme.assistant(t('theme.set', { v: applyThemeById(picked) })));
+                emit('');
+                emit(themePreviewAnsi(picked));
             }
             else {
                 // Cancelled: the previews must not stick. Restore WITHOUT persisting.

package/dist/theme.js

@@ -179,6 +179,134 @@ export const PALETTES = {
         brown: '#ff9e64',
         toggleOn: '#73daca',
     },
+    // Catppuccin Mocha — the soft pastel palette that took over the editor
+    // ecosystem (Neovim, VS Code, terminals).
+    catppuccin: {
+        bg: '#1e1e2e',
+        user: '#89b4fa',
+        userBar: '#5477a8',
+        turnRule: '#313244',
+        turnLabel: '#6c7086',
+        prompt: '#f9e2af',
+        dir: '#89dceb',
+        assistant: '#cdd6f4',
+        tool: '#fab387',
+        toolResult: '#a6adc8',
+        system: '#9399b2',
+        dim: '#6c7086',
+        taskSummary: '#89b4fa',
+        warn: '#f9e2af',
+        error: '#f38ba8',
+        success: '#a6e3a1',
+        brown: '#eba0ac',
+        toggleOn: '#94e2d5',
+    },
+    // GitHub Dark — the palette of GitHub's dark UI (familiar to anyone who
+    // reads diffs all day).
+    'github-dark': {
+        bg: '#0d1117',
+        user: '#58a6ff',
+        userBar: '#3a6ea8',
+        turnRule: '#21262d',
+        turnLabel: '#6e7681',
+        prompt: '#d29922',
+        dir: '#79c0ff',
+        assistant: '#c9d1d9',
+        tool: '#ffa657',
+        toolResult: '#8b949e',
+        system: '#8b949e',
+        dim: '#6e7681',
+        taskSummary: '#a5d6ff',
+        warn: '#d29922',
+        error: '#f85149',
+        success: '#3fb950',
+        brown: '#db6d28',
+        toggleOn: '#56d4dd',
+    },
+    // Ayu Dark — the minimal warm-accent scheme from the Ayu editor theme.
+    ayu: {
+        bg: '#0f1419',
+        user: '#59c2ff',
+        userBar: '#35789e',
+        turnRule: '#1f2430',
+        turnLabel: '#5c6773',
+        prompt: '#ffb454',
+        dir: '#59c2ff',
+        assistant: '#c7ccd1',
+        tool: '#ff8f40',
+        toolResult: '#a0a8b0',
+        system: '#8a9199',
+        dim: '#5c6773',
+        taskSummary: '#39bae6',
+        warn: '#ffb454',
+        error: '#f07178',
+        success: '#aad94c',
+        brown: '#e6b450',
+        toggleOn: '#95e6cb',
+    },
+    // Rosé Pine — muted rose-pine tones, a calmer alternative to Dracula.
+    'rose-pine': {
+        bg: '#191724',
+        user: '#9ccfd8',
+        userBar: '#5b8490',
+        turnRule: '#26233a',
+        turnLabel: '#6e6a86',
+        prompt: '#f6c177',
+        dir: '#9ccfd8',
+        assistant: '#e0def4',
+        tool: '#ebbcba',
+        toolResult: '#908caa',
+        system: '#908caa',
+        dim: '#6e6a86',
+        taskSummary: '#c4a7e7',
+        warn: '#f6c177',
+        error: '#eb6f92',
+        success: '#31748f',
+        brown: '#ebbcba',
+        toggleOn: '#9ccfd8',
+    },
+    // Everforest — the soft green forest palette (low contrast, easy on eyes).
+    everforest: {
+        bg: '#2d353b',
+        user: '#7fbbb3',
+        userBar: '#5a8b85',
+        turnRule: '#3d484d',
+        turnLabel: '#859289',
+        prompt: '#dbbc7f',
+        dir: '#7fbbb3',
+        assistant: '#d3c6aa',
+        tool: '#e69875',
+        toolResult: '#9da9a0',
+        system: '#859289',
+        dim: '#7a8478',
+        taskSummary: '#a7c080',
+        warn: '#dbbc7f',
+        error: '#e67e80',
+        success: '#a7c080',
+        brown: '#e69875',
+        toggleOn: '#83c092',
+    },
+    // Kanagawa — Hokusai-inspired muted indigo (the "wave" theme).
+    kanagawa: {
+        bg: '#1f1f28',
+        user: '#7e9cd8',
+        userBar: '#55709e',
+        turnRule: '#2a2a37',
+        turnLabel: '#727169',
+        prompt: '#e6c384',
+        dir: '#7fb4ca',
+        assistant: '#dcd7ba',
+        tool: '#ffa066',
+        toolResult: '#a6a69c',
+        system: '#c8c093',
+        dim: '#727169',
+        taskSummary: '#957fb8',
+        warn: '#e6c384',
+        error: '#e46876',
+        success: '#98bb6c',
+        brown: '#d27e59',
+        toggleOn: '#7aa89f',
+    },
 };
 /** The palette id used when the configured theme is unknown/missing. */
 export const DEFAULT_THEME = 'zames';

package/dist/tui/ConfigMenu.js

@@ -14,6 +14,7 @@ import { useMemo, useState } from 'react';
 import { Box, Text, useInput, useApp, useWindowSize } from 'ink';
 import { translate } from '../i18n.js';
 import { Checkbox, Select, UI, HintBar } from './widgets.js';
+import { ThemePreview } from './theme-preview.js';
 /** Strip ANSI to measure a line's visible width. */
 function stripAnsi(s) {
     return s.replace(/\x1b\[[0-9;?]*[A-Za-z]/g, '');
@@ -52,6 +53,8 @@ export function ConfigMenuApp(opts) {
     const [editBuf, setEditBuf] = useState('');
     const [pendingReset, setPendingReset] = useState(null);
     const [message, setMessage] = useState(null);
+    // Inline palette preview of the theme row ('p').
+    const [previewTheme, setPreviewTheme] = useState(false);
     // `get`/`set` mutate the LIVE config object in place, so React has no state
     // change to react to and the row kept the OLD value on screen after a
     // toggle/cycle (the operator saw «ru» while the config already held «en»).
@@ -216,12 +219,14 @@ export function ConfigMenuApp(opts) {
             setCursor((c) => visible.length ? (c - 1 + visible.length) % visible.length : 0);
             setPendingReset(null);
             setMessage(null);
+            setPreviewTheme(false);
             return;
         }
         if (key.downArrow || input === 'j') {
             setCursor((c) => (visible.length ? (c + 1) % visible.length : 0));
             setPendingReset(null);
             setMessage(null);
+            setPreviewTheme(false);
             return;
         }
         if (input === 'g') {
@@ -238,6 +243,30 @@ export function ConfigMenuApp(opts) {
             setMessage(null);
             return;
         }
+        if (input === 'p' || input === 'P') {
+            // Inline palette PREVIEW for the theme row: the settings list is where
+            // most operators meet ui.theme, and cycling the enum only shows the id.
+            // 'p' opens the sample session painted with the CURRENT palette, so the
+            // choice can be judged without leaving /config. Other rows: no-op.
+            const f = visible[cursor];
+            if (f && f.path === 'ui.theme') {
+                setPreviewTheme((v) => !v);
+                setMessage(null);
+                return;
+            }
+        }
+        if (input === 'p' || input === 'P') {
+            // Inline palette PREVIEW on the theme row: /config is where most
+            // operators meet ui.theme, and cycling the enum only shows the id. 'p'
+            // toggles a sample session painted with the CURRENT palette, so the
+            // choice can be judged without leaving the menu. Other rows: no-op.
+            const f = visible[cursor];
+            if (f && f.path === 'ui.theme') {
+                setPreviewTheme((v) => !v);
+                setMessage(null);
+                return;
+            }
+        }
         if (key.return || input === ' ') {
             activate();
             return;
@@ -336,10 +365,13 @@ export function ConfigMenuApp(opts) {
     if (!visible.length) {
         items.push(_jsx(Text, { color: UI.dim, children: '  ' + t('cfg.menu.no_match') }, "none"));
     }
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: UI.border, paddingX: 1, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { bold: true, color: UI.title, children: t('cfg.menu.title') }), _jsx(Text, { color: UI.dim, children: (visible.length ? cursor + 1 : 0) + '/' + visible.length })] }), _jsx(Text, { color: UI.border, children: '─'.repeat(Math.max(10, (columns || 80) - 6)) }), items, _jsx(Text, { color: UI.border, children: '─'.repeat(Math.max(10, (columns || 80) - 6)) }), editing ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: UI.text, children: t('cfg.menu.edit_hint') }), _jsx(Text, { color: UI.accent, children: '❯ ' + editBuf })] })) : filterMode ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: UI.text, children: t('cfg.menu.filter_hint') }), _jsx(Text, { color: UI.accent, children: '❯ ' + filterQuery })] })) : message ? (_jsx(Text, { color: UI.ok, children: message })) : filterQuery ? (_jsx(Text, { color: UI.dim, children: t('cfg.menu.filter_active', { q: filterQuery }) })) : null, _jsx(HintBar, { hints: [
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: UI.border, paddingX: 1, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { bold: true, color: UI.title, children: t('cfg.menu.title') }), _jsx(Text, { color: UI.dim, children: (visible.length ? cursor + 1 : 0) + '/' + visible.length })] }), _jsx(Text, { color: UI.border, children: '─'.repeat(Math.max(10, (columns || 80) - 6)) }), items, _jsx(Text, { color: UI.border, children: '─'.repeat(Math.max(10, (columns || 80) - 6)) }), previewTheme && visible[cursor]?.path === 'ui.theme' ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: UI.dim, children: t('cfg.menu.theme_preview') }), _jsx(ThemePreview, { name: String(get('ui.theme') ?? 'zames'), compact: true })] })) : null, editing ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: UI.text, children: t('cfg.menu.edit_hint') }), _jsx(Text, { color: UI.accent, children: '❯ ' + editBuf })] })) : filterMode ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: UI.text, children: t('cfg.menu.filter_hint') }), _jsx(Text, { color: UI.accent, children: '❯ ' + filterQuery })] })) : message ? (_jsx(Text, { color: UI.ok, children: message })) : filterQuery ? (_jsx(Text, { color: UI.dim, children: t('cfg.menu.filter_active', { q: filterQuery }) })) : null, _jsx(HintBar, { hints: [
                     ['↑/↓', hint('tui.hint.select')],
                     ['←/→', hint('tui.hint.change')],
                     ['Enter', hint('tui.hint.edit')],
+                    ...(visible[cursor]?.path === 'ui.theme'
+                        ? [['p', hint('cfg.menu.theme_preview_key')]]
+                        : []),
                     ['/', hint('tui.hint.search')],
                     ['d', hint('tui.hint.reset')],
                     ['q', hint('tui.hint.quit')],

package/dist/tui/ThemePicker.js

@@ -10,7 +10,7 @@ import { useState } from 'react';
 import { Box, Text, useInput, useApp, useWindowSize } from 'ink';
 import { UI } from './ui-colors.js';
 import { HintBar } from './widgets.js';
-import { theme } from '../theme.js';
+import { ThemePreview } from './theme-preview.js';
 import { translate } from '../i18n.js';
 export function ThemePicker({ themes, initial, onPreview, locale = 'en', onDone, }) {
     const { exit } = useApp();
@@ -30,20 +30,6 @@ export function ThemePicker({ themes, initial, onPreview, locale = 'en', onDone,
         setCursor(next);
         onPreview(themes[next]);
     };
-    // A sample line of every important role, colored through `theme` (chalk):
-    // Ink's <Text color> takes a hex STRING, not a formatter, so a gradient like
-    // this has to be pre-rendered ANSI.
-    const preview = () => [
-        theme.user('user'),
-        theme.assistant('answer'),
-        theme.tool('tool'),
-        theme.toolResult('result'),
-        theme.system('system'),
-        theme.warn('warn'),
-        theme.error('error'),
-        theme.success('ok'),
-        theme.toggleOn('on'),
-    ].join(' ');
     useInput((input, key) => {
         if (key.escape || (key.ctrl && input === 'c') || input === 'q') {
             finish(null);
@@ -63,7 +49,7 @@ export function ThemePicker({ themes, initial, onPreview, locale = 'en', onDone,
     return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: UI.border, paddingX: 1, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { color: UI.title, bold: true, children: '◆ ' + t('theme.pick_title') }), _jsx(Text, { color: UI.dim, children: themes.length })] }), _jsx(Text, { color: UI.border, children: '─'.repeat(innerCols) }), themes.map((name, idx) => {
                 const sel = idx === cursor;
                 return (_jsxs(Text, { children: [_jsx(Text, { color: UI.accent, children: sel ? '❯ ' : '  ' }), _jsx(Text, { color: sel ? UI.accent : undefined, bold: sel, children: name }), idx === start ? (_jsx(Text, { color: UI.dim, children: '  ' + t('tui.list.current') })) : null] }, name));
-            }), _jsx(Text, { color: UI.border, children: '─'.repeat(innerCols) }), _jsx(Text, { children: preview() }), _jsx(HintBar, { hints: [
+            }), _jsx(Text, { color: UI.border, children: '─'.repeat(innerCols) }), _jsx(ThemePreview, { name: themes[cursor] ?? initial, compact: true }), _jsx(HintBar, { hints: [
                     ['↑/↓', t('theme.pick_move')],
                     ['Enter', t('tui.hint.ok')],
                     ['Esc', t('theme.pick_cancel')],

package/dist/tui/theme-preview.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import chalk from 'chalk';
+import { PALETTES, DEFAULT_THEME, isThemeName } from '../theme.js';
+/**
+ * The sample lines. Kept PURE DATA so tests can assert the preview covers the
+ * important roles and the Ink/plain renderers cannot drift apart.
+ */
+export function previewLines() {
+    return [
+        { role: 'dir', text: '~/project' },
+        { role: 'prompt', text: '❯ объясни этот код', bold: true },
+        { role: 'assistant', text: '● Ответ: функция читает файл и парсит JSON.' },
+        { role: 'tool', text: '🔧 Read {"path":"package.json"}' },
+        { role: 'toolResult', text: '→ ✔ 42 строки' },
+        { role: 'taskSummary', text: '· duration: 6s · tools: 1' },
+        { role: 'warn', text: '▲ предупреждение' },
+        { role: 'error', text: '✖ ошибка' },
+        { role: 'success', text: '✔ готово' },
+        { role: 'toggleOn', text: '🌐 поиск вкл' },
+        { role: 'system', text: '● сервисное сообщение' },
+        { role: 'dim', text: '· подсказка' },
+    ];
+}
+function paletteOf(name) {
+    return PALETTES[isThemeName(name) ? name : DEFAULT_THEME];
+}
+/** The preview as one chalk-painted string (for a plain terminal line). */
+export function themePreviewAnsi(name) {
+    const p = paletteOf(name);
+    return previewLines()
+        .map((l) => {
+        const c = chalk.hex(p[l.role]);
+        return l.bold ? c.bold(l.text) : c(l.text);
+    })
+        .join('\n');
+}
+/** The preview as an Ink block (for the picker / the config menu). */
+export function ThemePreview({ name, compact = false, }) {
+    const p = paletteOf(name);
+    const lines = compact
+        ? previewLines().filter((l) => ['prompt', 'assistant', 'tool', 'error', 'success', 'dim'].includes(l.role))
+        : previewLines();
+    return (_jsx(Box, { flexDirection: "column", children: lines.map((l, i) => (_jsx(Text, { color: p[l.role], bold: l.bold, children: l.text }, i))) }));
+}

package/llms-full.txt

@@ -616,10 +616,14 @@ The switch is instant, no restart. `zames` is the default; the bundled palettes
 are ports of well-known editor schemes:
 
 `zames` (default), `one-dark`, `dracula`, `gruvbox`, `nord`, `monokai`,
-`solarized-dark`, `tokyo-night`.
+`solarized-dark`, `tokyo-night`, `catppuccin`, `github-dark`, `ayu`,
+`rose-pine`, `everforest`, `kanagawa`.
 
 A theme repaints EVERYTHING: the interface, the agent's answers, the code
-highlighting inside them and the input frame. The frame itself is a separate
+highlighting inside them, the status row and the input frame. To make the choice
+concrete, a SAMPLE SESSION in that palette is shown before you pick (in `/theme`
+below the list, in `/config` press `p` on the theme row); after
+`/theme <id>` the sample is printed too. The frame itself is a separate
 setting: `/config set ui.inputBorder <round|single|double|bold|none>`
 (default `round`; `none` removes it).
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zames_pro",
-  "version": "2.83.4",
+  "version": "2.84.0",
   "description": "Terminal coding agent that drives a real browser to chat with DeepSeek, Qwen or GLM — no API key required. Reads and edits files, runs commands, commits to git, like Claude Code / Codex CLI.",
   "type": "module",
   "bin": {
@@ -47,7 +47,8 @@
     "postinstall": "node scripts/postinstall.mjs",
     "prepare": "husky",
     "glm-smoke": "tsx scripts/glm-smoke.mts",
-    "seo:topics": "tsx scripts/seo-topics.mts"
+    "seo:topics": "tsx scripts/seo-topics.mts",
+    "ui-smoke": "tsx scripts/ui-smoke.mts"
   },
   "keywords": [
     "zames",