@emaxe/tuigram 1.2.0 → 1.3.0

package/CHANGELOG.md

@@ -13,6 +13,23 @@ and this project adheres to [Semantic Versioning](https://semver.org/).
 
 - English localization of the TUI and CLI interface strings.
 
+## [1.3.0] — 2026-09-01
+
+### Added
+
+- Comprehensive mouse support across the entire TUI:
+  - Direct panel focus on click (left panel for dialog list, middle panel for message feed, bottom panel for input box).
+  - Single-click dialog selection and immediate opening.
+  - Smooth mouse wheel scrolling for dialog list and message feed with automatic loading of older history when scrolling up past the top.
+  - Clicking on any message opens its contextual action menu (reactions, replies, edits, downloads, deletion).
+  - Clickable filter tabs (`1:Все`, `2:ЛС`, `3:Группы`, `4:Каналы`, `5:Боты`, `6:Непроч`) and search input focusing.
+  - Interactive status bar buttons (`[Tab]`, `[1-6]`, `[/]`, `[F1]`, `[Ctrl+A]`, `[Ctrl+P]`, `[Ctrl+Q]`).
+  - Interactive header elements: click logo for Help, click chat title for Chat Info, click status badge for network state.
+  - Interactive context bar in input box: click to cancel reply/edit mode or trigger shortcuts.
+  - Full mouse navigation inside modals (button clicks, checkbox toggles, file browsing) and dismissing any modal by clicking outside its boundary.
+- Robust terminal mouse mode initialization (`\x1b[?1000h\x1b[?1002h\x1b[?1006h\x1b[?1015h`) supporting modern terminals (macOS Terminal.app, iTerm2, Alacritty, Kitty, Windows Terminal, xterm).
+- Pure mouse coordinate calculation utilities (`src/utils/mouse.js`) with full test coverage in `test/unit.test.js`.
+
 ## [1.2.0] — 2026-09-01
 
 ### Added
@@ -118,7 +135,8 @@ First public release.
 - A WCAG contrast test (3:1 threshold) applied to every theme **after** conversion
   to xterm-256 — the colors are checked exactly as the user sees them.
 
-[Unreleased]: https://github.com/emaxe/tuigram/compare/v1.2.0...HEAD
+[Unreleased]: https://github.com/emaxe/tuigram/compare/v1.3.0...HEAD
+[1.3.0]: https://github.com/emaxe/tuigram/compare/v1.2.0...v1.3.0
 [1.2.0]: https://github.com/emaxe/tuigram/compare/v1.1.0...v1.2.0
 [1.1.0]: https://github.com/emaxe/tuigram/compare/v1.0.1...v1.1.0
 [1.0.1]: https://github.com/emaxe/tuigram/compare/v1.0.0...v1.0.1

package/CHANGELOG.ru.md

@@ -13,6 +13,23 @@
 
 - Английская локализация строк интерфейса TUI и CLI.
 
+## [1.3.0] — 2026-09-01
+
+### Добавлено
+
+- Полноценная поддержка управления мышью во всём TUI-интерфейсе:
+  - Фокусировка любой панели по клику (список чатов, лента сообщений, поле ввода).
+  - Открытие диалога в один клик по элементу списка.
+  - Плавная прокрутка списка чатов и ленты сообщений колесом мыши с автоматической подгрузкой старой истории при прокрутке вверх.
+  - Открытие меню действий над сообщением (реакции, ответ, редактирование, скачивание, удаление) по прямому клику на сообщение.
+  - Интерактивные вкладки фильтрации (`1:Все`, `2:ЛС`, `3:Группы`, `4:Каналы`, `5:Боты`, `6:Непроч`) и строка поиска в списке диалогов.
+  - Интерактивная нижняя строка состояния (`[Tab]`, `[1-6]`, `[/]`, `[F1]`, `[Ctrl+A]`, `[Ctrl+P]`, `[Ctrl+Q]`).
+  - Интерактивный верхний заголовок: клик по логотипу открывает справку, по названию активного чата — сведения о чате, по статусу — информацию о сети.
+  - Контекстная строка поля ввода: клик сбрасывает режим ответа/редактирования либо запускает команды.
+  - Поддержка мыши во всех модальных окнах (клики по кнопкам, чекбоксам, файлам в проводнике) и закрытие модалок по клику мимо окна.
+- Надёжная инициализация режимов мыши терминала (`\x1b[?1000h\x1b[?1002h\x1b[?1006h\x1b[?1015h`) с поддержкой современных эмуляторов (macOS Terminal.app, iTerm2, Alacritty, Kitty, Windows Terminal, xterm).
+- Чистые утилиты расчёта координат мыши (`src/utils/mouse.js`) и покрытие юнит-тестами в `test/unit.test.js`.
+
 ## [1.2.0] — 2026-09-01
 
 ### Добавлено
@@ -120,7 +137,8 @@
 - Тест контраста по WCAG (порог 3:1) для каждой темы — **после** конверсии в xterm-256,
   то есть ровно в том виде, в каком цвет увидит пользователь.
 
-[Unreleased]: https://github.com/emaxe/tuigram/compare/v1.2.0...HEAD
+[Unreleased]: https://github.com/emaxe/tuigram/compare/v1.3.0...HEAD
+[1.3.0]: https://github.com/emaxe/tuigram/compare/v1.2.0...v1.3.0
 [1.2.0]: https://github.com/emaxe/tuigram/compare/v1.1.0...v1.2.0
 [1.1.0]: https://github.com/emaxe/tuigram/compare/v1.0.1...v1.1.0
 [1.0.1]: https://github.com/emaxe/tuigram/compare/v1.0.0...v1.0.1

package/README.md

@@ -52,6 +52,7 @@ TuiGram lets you use Telegram entirely from the terminal: browse your dialog lis
 - [Where files are stored](#-where-files-are-stored)
 - [Development](#-development)
 - [Keyboard shortcuts](#️-keyboard-shortcuts)
+- [Mouse controls](#-mouse-controls)
 - [Slash commands](#-slash-commands-in-the-input-box)
 - [Sending files and images](#-sending-files-and-images)
 - [Themes](#-themes)
@@ -452,6 +453,28 @@ node scripts/check-package.js   # verifies that .env and the session do not leak
 
 ---
 
+## 🖱 Mouse controls
+
+TuiGram fully supports mouse interaction in terminals that support mouse reporting (macOS Terminal, iTerm2, Alacritty, Kitty, Windows Terminal, Linux virtual terminals):
+
+| Action | Target | Result |
+|---|---|---|
+| Click | Left / Middle / Bottom panel | Focus the clicked panel |
+| Click | Chat item in dialog list | Immediately select and open the chat |
+| Click | Filter tabs `1:Все` .. `6:Непроч` | Switch chat category filter |
+| Click | Search bar `[/]` | Focus search box and clear placeholder |
+| Wheel scroll | Dialog list / Message feed | Smooth scroll (scrolling up to the top loads older messages) |
+| Click | Any message line | Open message action menu (reactions, reply, edit, download, delete) |
+| Click | Header logo 🚀 | Open Help window |
+| Click | Header active chat title | Open Chat Info window |
+| Click | Header connection badge | Show active network status |
+| Click | Input context bar | Cancel reply/edit mode or insert `/` |
+| Click | Status bar items | Trigger corresponding action (`[Tab]`, `[F1]`, `[Ctrl+A]`, `[Ctrl+Q]`, etc.) |
+| Click | Outside any modal window | Dismiss / close modal |
+| Click | Buttons in modals | Click buttons (`[ Отправить ]`, `[ Отмена ]`, `[ Закрыть ]`, toggle checkboxes) |
+
+---
+
 ## 💬 Slash commands in the input box
 
 Quick commands are available in the message input box (they start with `/`):

package/README.ru.md

@@ -48,6 +48,7 @@
 - [Где хранятся файлы](#-где-хранятся-файлы)
 - [Разработка](#-разработка)
 - [Горячие клавиши](#️-горячие-клавиши)
+- [Управление мышью](#-управление-мышью)
 - [Слэш-команды](#-слэш-команды-в-поле-ввода)
 - [Отправка файлов и картинок](#-отправка-файлов-и-картинок)
 - [Темы оформления](#-темы-оформления)
@@ -444,6 +445,28 @@ node scripts/check-package.js   # проверка, что в пакет не у
 
 ---
 
+## 🖱 Управление мышью
+
+TuiGram полноценно поддерживает управление мышью во всех современных терминалах (Terminal.app, iTerm2, Alacritty, Kitty, Windows Terminal, xterm):
+
+| Действие | Где | Результат |
+|---|---|---|
+| Клик | Левая / Центральная / Нижняя панель | Переключение фокуса на выбранную панель |
+| Клик | Диалог в списке чатов | Мгновенный выбор и открытие чата |
+| Клик | Вкладки `1:Все` .. `6:Непроч` | Переключение фильтра категории чатов |
+| Клик | Поле поиска `[/]` | Фокус в поиск с очисткой подсказки |
+| Колесо мыши | Список чатов / Лента сообщений | Плавная прокрутка (прокрутка вверх в ленте подгружает историю) |
+| Клик | Любое сообщение | Открытие меню действий (реакции, ответ, редактирование, удаление) |
+| Клик | Логотип 🚀 в шапке | Открытие окна справки |
+| Клик | Название активного чата в шапке | Открытие информации о текущем чате |
+| Клик | Индикатор статуса в шапке | Просмотр статуса MTProto подключения |
+| Клик | Контекстная плашка ввода | Сброс режима ответа/редактирования или вставка `/` |
+| Клик | Кнопки строки состояния | Быстрый вызов действий (`[Tab]`, `[F1]`, `[Ctrl+A]`, `[Ctrl+Q]` и др.) |
+| Клик | Мимо любого модального окна | Закрытие модального окна |
+| Клик | Кнопки в модалках | Нажатие кнопки (`[ Отправить ]`, `[ Отмена ]`, `[ Закрыть ]`, чекбоксы) |
+
+---
+
 ## 💬 Слэш-команды в поле ввода
 
 В поле ввода сообщения доступны быстрые команды (начинаются с `/`):

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@emaxe/tuigram",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "Полнофункциональный TUI & CLI клиент Telegram на Node.js на базе MTProto (teleproto)",
   "type": "module",
   "exports": {

package/src/ui/app.js

@@ -43,8 +43,79 @@ export async function startTui(client, me) {
     state.setConnectionStatus("connected");
 
     // 1. Создание визуальных компонентов
-    const header = createHeader(screen, theme);
-    const statusBar = createStatusBar(screen, theme);
+    const header = createHeader(screen, theme, {
+        onHelp: () => {
+            releaseInputs();
+            helpModal.show();
+        },
+        onChatInfo: () => {
+            if (state.activeChat) {
+                releaseInputs();
+                chatInfoModal.show(state.activeChat);
+            } else {
+                statusBar.showMessage("Сначала выберите чат слева!", "warning");
+            }
+        },
+        onStatusClick: () => {
+            const statusText = state.connectionStatus === "connected"
+                ? "Подключение активно: MTProto онлайн"
+                : `Статус сети: ${state.connectionStatus}`;
+            statusBar.showMessage(statusText, "info");
+        },
+    });
+
+    const statusBar = createStatusBar(screen, theme, {
+        onFocusNext: () => moveFocus(1),
+        onSelectOrSubmit: () => {
+            const focused = detectFocus();
+            if (focused === "input") {
+                inputBox.textarea.emit("key enter");
+            } else if (focused === "chatList") {
+                chatList.list.emit("key enter");
+            }
+        },
+        onFilterTabs: () => {
+            releaseInputs();
+            chatList.focus();
+            statusBar.showMessage("Фильтры: нажмите 1-6 для выбора вкладки", "info");
+        },
+        onSearch: () => {
+            chatList.searchBox.setValue("");
+            chatList.searchBox.focus();
+            screen.render();
+        },
+        onHelp: () => {
+            releaseInputs();
+            helpModal.show();
+        },
+        onAction: () => {
+            if (!state.activeChat) {
+                statusBar.showMessage("Сначала выберите чат слева!", "warning");
+                return;
+            }
+            const msgs = state.getMessages(state.activeChat.id);
+            if (msgs.length > 0) {
+                releaseInputs();
+                actionModal.show(msgs[msgs.length - 1]);
+            }
+        },
+        onChatInfo: () => {
+            if (state.activeChat) {
+                releaseInputs();
+                chatInfoModal.show(state.activeChat);
+            } else {
+                statusBar.showMessage("Сначала выберите чат слева!", "warning");
+            }
+        },
+        onQuit: () => {
+            releaseInputs();
+            confirmModal.ask("Выйти из TuiGram?", () => {
+                listener?.stop();
+                screen.destroy();
+                process.exit(0);
+            });
+        },
+    });
 
     // Модальные окна
     const helpModal = createHelpModal(screen, theme);
@@ -205,6 +276,21 @@ export async function startTui(client, me) {
         onCancelContext: () => {
             statusBar.showMessage("Режим ответа/редактирования сброшен", "info", 2000);
         },
+        onReplyLast: () => {
+            if (!state.activeChat) return;
+            const msgs = state.getMessages(state.activeChat.id);
+            if (msgs.length > 0) {
+                inputBox.setContext("reply", msgs[msgs.length - 1]);
+            }
+        },
+        onEditLast: () => {
+            if (!state.activeChat) return;
+            const msgs = state.getMessages(state.activeChat.id);
+            const ownMsgs = msgs.filter((m) => m.out);
+            if (ownMsgs.length > 0) {
+                inputBox.setContext("edit", ownMsgs[ownMsgs.length - 1]);
+            }
+        },
         onSlashCommand: (cmd, args) => {
             switch (cmd) {
                 case "help":
@@ -269,6 +355,33 @@ export async function startTui(client, me) {
         },
     });
 
+    // Переключение фокуса по клику мышью на любую из трех панелей
+    chatList.container.on("click", () => {
+        if (screen.focused !== chatList.list && screen.focused !== chatList.searchBox) {
+            releaseInputs();
+            chatList.focus();
+            statusBar.showMessage("Фокус: список чатов", "info", 2000);
+            screen.render();
+        }
+    });
+
+    chatView.container.on("click", () => {
+        if (screen.focused !== chatView.scrollBox) {
+            releaseInputs();
+            chatView.focus();
+            statusBar.showMessage("Фокус: лента сообщений", "info", 2000);
+            screen.render();
+        }
+    });
+
+    inputBox.container.on("click", () => {
+        if (screen.focused !== inputBox.textarea) {
+            inputBox.focus();
+            statusBar.showMessage("Фокус: поле ввода", "info", 2000);
+            screen.render();
+        }
+    });
+
     // 5. Реакция на события состояния
     state.on("dialogs_updated", (dialogs) => {
         chatList.setDialogs(dialogs);

package/src/ui/components/chatList.js

@@ -4,6 +4,8 @@ import { escapeBlessed } from "../../telegram/formatter.js";
 import { fg, badge } from "../theme.js";
 import unicode from "neo-blessed/lib/unicode.js";
 
+import { getTabByCoordinate } from "../../utils/mouse.js";
+
 /**
  * Создаёт компонент списка диалогов (левая панель).
  * @param {blessed.Widgets.Screen} screen
@@ -20,6 +22,7 @@ export function createChatList(screen, theme, { onSelectDialog, onTabChange, onS
         left: 0,
         width: "35%",
         bottom: 1,
+        mouse: true,
         border: {
             type: "line",
         },
@@ -40,6 +43,8 @@ export function createChatList(screen, theme, { onSelectDialog, onTabChange, onS
         right: 0,
         height: 1,
         tags: true,
+        mouse: true,
+        clickable: true,
         style: {
             bg: theme.tabs.bg,
             fg: theme.tabs.fg,
@@ -64,6 +69,17 @@ export function createChatList(screen, theme, { onSelectDialog, onTabChange, onS
         tabsBox.setContent(rendered);
     }
 
+    tabsBox.on("click", (data) => {
+        const relX = data.x - (tabsBox.aleft || 0);
+        const tabKey = getTabByCoordinate(relX, TAB_KEYS, TAB_NAMES);
+        if (tabKey) {
+            currentTab = tabKey;
+            renderTabs();
+            onTabChange?.(currentTab);
+            screen.render();
+        }
+    });
+
     // 2. Строка поиска / фильтра
     const searchBox = blessed.textbox({
         parent: container,
@@ -72,6 +88,7 @@ export function createChatList(screen, theme, { onSelectDialog, onTabChange, onS
         right: 0,
         height: 1,
         inputOnFocus: true,
+        mouse: true,
         style: {
             bg: theme.search.bg,
             fg: theme.search.fg,
@@ -80,6 +97,14 @@ export function createChatList(screen, theme, { onSelectDialog, onTabChange, onS
     const SEARCH_PLACEHOLDER = "[/] Поиск чатов...";
     searchBox.setValue(SEARCH_PLACEHOLDER);
 
+    searchBox.on("click", () => {
+        if (searchBox.getValue() === SEARCH_PLACEHOLDER) {
+            searchBox.setValue("");
+        }
+        searchBox.focus();
+        screen.render();
+    });
+
     // 3. Список диалогов
     const list = blessed.list({
         parent: container,
@@ -118,13 +143,31 @@ export function createChatList(screen, theme, { onSelectDialog, onTabChange, onS
     // не влезающий хвост на вторую строку, которой в элементе высотой 1 просто
     // нет: хвост исчезал, а начатый перед разрывом фон бейджа непрочитанных
     // оставался залитым до края панели. С wrap: false лишнее просто обрезается.
+    // По клику мыши сразу выбираем и открываем диалог.
     const baseCreateItem = list.createItem.bind(list);
     list.createItem = (content) => {
         const item = baseCreateItem(content);
         item.wrap = false;
+        item.on("click", () => {
+            const index = list.getItemIndex(item);
+            if (index !== -1 && currentDialogs[index]) {
+                list.select(index);
+                onSelectDialog?.(currentDialogs[index]);
+            }
+        });
         return item;
     };
 
+    container.on("wheelup", () => {
+        list.select(list.selected - 2);
+        screen.render();
+    });
+
+    container.on("wheeldown", () => {
+        list.select(list.selected + 2);
+        screen.render();
+    });
+
     let currentDialogs = [];
 
     /**
@@ -275,6 +318,25 @@ export function createChatList(screen, theme, { onSelectDialog, onTabChange, onS
 
     renderTabs();
 
+    /** Подсвечивает рамку, когда список диалогов или строка поиска в фокусе. */
+    function setFocusHighlight(active) {
+        container.style.border.fg = active ? theme.borders.focusFg : theme.borders.fg;
+        screen.render();
+    }
+
+    list.on("focus", () => setFocusHighlight(true));
+    list.on("blur", (newTarget) => {
+        if (newTarget !== searchBox && screen.focused !== searchBox) {
+            setFocusHighlight(false);
+        }
+    });
+    searchBox.on("focus", () => setFocusHighlight(true));
+    searchBox.on("blur", (newTarget) => {
+        if (newTarget !== list && screen.focused !== list) {
+            setFocusHighlight(false);
+        }
+    });
+
     return {
         container,
         list,

package/src/ui/components/chatView.js

@@ -3,6 +3,8 @@ import { formatMessageTime, formatDateDivider } from "../../utils/time.js";
 import { formatMessageText, escapeBlessed } from "../../telegram/formatter.js";
 import { fg } from "../theme.js";
 
+import { getMessageAtLine } from "../../utils/mouse.js";
+
 /**
  * Создаёт компонент просмотра сообщений чата (правая центральная панель).
  * @param {blessed.Widgets.Screen} screen
@@ -18,6 +20,7 @@ export function createChatView(screen, theme, { onLoadMoreHistory, onActionMenu
         left: "35%",
         right: 0,
         bottom: 6,
+        mouse: true,
         border: {
             type: "line",
         },
@@ -54,26 +57,43 @@ export function createChatView(screen, theme, { onLoadMoreHistory, onActionMenu
         },
     });
 
+    /** Подсвечивает рамку, когда лента сообщений в фокусе. */
+    function setFocusHighlight(active) {
+        container.style.border.fg = active ? theme.borders.focusFg : theme.borders.fg;
+        screen.render();
+    }
+
+    scrollBox.on("focus", () => setFocusHighlight(true));
+    scrollBox.on("blur", () => setFocusHighlight(false));
+
     let currentMessages = [];
+    let currentRanges = [];
 
     /**
-     * Форматирует список сообщений в единую ленту текста с разметкой Blessed.
+     * Форматирует список сообщений в единую ленту текста с разметкой Blessed
+     * и вычисляет координаты строк каждого сообщения для кликов мыши.
      * @param {Array<object>} messages
-     * @returns {string}
+     * @returns {{ text: string, ranges: Array<{ message: object, startLine: number, endLine: number }> }}
      */
-    function renderMessages(messages) {
+    function renderMessagesWithRanges(messages) {
         if (!messages || messages.length === 0) {
-            return `\n\n  ${fg(theme.muted, "Сообщений пока нет. Напишите первое сообщение ниже!")}`;
+            return {
+                text: `\n\n  ${fg(theme.muted, "Сообщений пока нет. Напишите первое сообщение ниже!")}`,
+                ranges: [],
+            };
         }
 
         let output = "";
         let lastDateString = "";
+        const ranges = [];
+        let lineCursor = 0;
 
         for (const msg of messages) {
             // Разделитель дат
             const dateStr = formatDateDivider(msg.date);
             if (dateStr && dateStr !== lastDateString) {
                 output += `\n  ${fg(theme.chatView.dateDivider, `─────── ${escapeBlessed(dateStr)} ───────`)}\n\n`;
+                lineCursor += 3;
                 lastDateString = dateStr;
             }
 
@@ -92,8 +112,10 @@ export function createChatView(screen, theme, { onLoadMoreHistory, onActionMenu
 
             // Блок ответа (Reply)
             let replyBlock = "";
+            let replyLines = 0;
             if (msg.replyToMsgId) {
                 replyBlock = `  ${fg(theme.chatView.replyBorder, `┌─ Ответ на сообщение #${msg.replyToMsgId}`)}\n`;
+                replyLines = 1;
             }
 
             // Текст сообщения и entities
@@ -118,12 +140,15 @@ export function createChatView(screen, theme, { onLoadMoreHistory, onActionMenu
                 .split("\n")
                 .map((line) => `  ${line}`)
                 .join("\n");
+            const bodyLinesCount = indentedBody.split("\n").length;
 
             // Реакции
             let reactionsLine = "";
+            let reactionLinesCount = 0;
             if (msg.reactions && msg.reactions.length > 0) {
                 const list = msg.reactions.map((r) => `${r.emoticon} ${r.count}`).join("  ");
                 reactionsLine = `\n  ${fg(theme.chatView.reactionFg, `{bold}${list}{/bold}`)}`;
+                reactionLinesCount = 1;
             }
 
             // Метка редактирования
@@ -132,10 +157,17 @@ export function createChatView(screen, theme, { onLoadMoreHistory, onActionMenu
                 editedTag = ` ${fg(theme.chatView.time, "(изменено)")}`;
             }
 
+            const startLine = lineCursor;
+            const totalMsgLines = 1 + replyLines + bodyLinesCount + reactionLinesCount;
+            const endLine = startLine + totalMsgLines - 1;
+
+            ranges.push({ message: msg, startLine, endLine });
+            lineCursor += totalMsgLines + 2;
+
             output += ` ${authorTag}${editedTag}\n${replyBlock}${indentedBody}${reactionsLine}\n\n`;
         }
 
-        return output;
+        return { text: output, ranges };
     }
 
     /**
@@ -148,7 +180,9 @@ export function createChatView(screen, theme, { onLoadMoreHistory, onActionMenu
         const prevScroll = scrollBox.getScroll();
         const prevHeight = scrollBox.getScrollHeight();
 
-        scrollBox.setContent(renderMessages(messages));
+        const rendered = renderMessagesWithRanges(messages);
+        currentRanges = rendered.ranges;
+        scrollBox.setContent(rendered.text);
 
         if (autoScrollToBottom) {
             scrollBox.setScrollPerc(100);
@@ -195,8 +229,31 @@ export function createChatView(screen, theme, { onLoadMoreHistory, onActionMenu
     });
 
     scrollBox.on("wheelup", () => {
-        if (scrollBox.getScroll() <= 0) {
-            onLoadMoreHistory?.();
+        handleScrollUp(3);
+    });
+
+    scrollBox.on("wheeldown", () => {
+        handleScrollDown(3);
+    });
+
+    container.on("wheelup", () => {
+        handleScrollUp(3);
+    });
+
+    container.on("wheeldown", () => {
+        handleScrollDown(3);
+    });
+
+    scrollBox.on("click", (data) => {
+        const clickY = data.y;
+        const itop = scrollBox.itop || 0;
+        const lineIndex = clickY - (scrollBox.atop || 0) + scrollBox.getScroll() - itop;
+        const clickedMsg = getMessageAtLine(lineIndex, currentRanges);
+        if (clickedMsg) {
+            onActionMenu?.(clickedMsg);
+        } else {
+            scrollBox.focus();
+            screen.render();
         }
     });
 

package/src/ui/components/header.js

@@ -2,13 +2,21 @@ import blessed from "neo-blessed";
 import { escapeBlessed } from "../../telegram/formatter.js";
 import { fg } from "../theme.js";
 
+import { getHeaderActionAt } from "../../utils/mouse.js";
+
 /**
  * Верхняя шапка приложения с информацией о пользователе, активном чате и статусе соединения.
  * @param {blessed.Widgets.Screen} screen
  * @param {object} theme
+ * @param {object} [callbacks]
+ * @param {() => void} [callbacks.onHelp]
+ * @param {() => void} [callbacks.onChatInfo]
+ * @param {() => void} [callbacks.onStatusClick]
  * @returns {blessed.Widgets.BoxElement & { updateInfo: (data: object) => void }}
  */
-export function createHeader(screen, theme) {
+export function createHeader(screen, theme, { onHelp, onChatInfo, onStatusClick } = {}) {
+    let currentActiveChat = null;
+
     const headerBox = blessed.box({
         parent: screen,
         top: 0,
@@ -17,6 +25,7 @@ export function createHeader(screen, theme) {
         // 4 = рамка (2) + две строки контента (профиль + активный чат)
         height: 4,
         tags: true,
+        mouse: true,
         border: {
             type: "line",
         },
@@ -29,6 +38,19 @@ export function createHeader(screen, theme) {
         },
     });
 
+    headerBox.on("click", (data) => {
+        const relX = data.x - (headerBox.aleft || 0);
+        const relY = data.y - (headerBox.atop || 0);
+        const action = getHeaderActionAt(relX, relY, { hasActiveChat: Boolean(currentActiveChat) });
+        if (action === "help") {
+            onHelp?.();
+        } else if (action === "info") {
+            onChatInfo?.();
+        } else if (action === "status") {
+            onStatusClick?.();
+        }
+    });
+
     /**
      * Обновляет содержимое шапки.
      * @param {object} data
@@ -38,6 +60,7 @@ export function createHeader(screen, theme) {
      * @param {string|null} [data.typingUser]
      */
     headerBox.updateInfo = function ({ me, status = "connected", activeChat, typingUser }) {
+        currentActiveChat = activeChat;
         let statusBadge = fg(theme.status.online, "● В сети");
         if (status === "connecting") {
             statusBadge = fg(theme.status.connecting, "◌ Подключение...");