@emaxe/tuigram 1.3.0 → 1.5.0

package/src/utils/image.js

@@ -6,6 +6,7 @@
 
 import jpegJs from "jpeg-js";
 import { PNG } from "pngjs";
+import { stringCellWidth } from "./mouse.js";
 
 /** Заголовок стандартного JPEG для распаковки Telegram PhotoStrippedSize. */
 const JPEG_HEADER = Buffer.from([
@@ -216,6 +217,9 @@ export function resizeRgba(src, srcW, srcH, dstW, dstH) {
     return dst;
 }
 
+/** Таблица предвычисленных двухсимвольных hex-значений 00-ff для быстрого рендеринга. */
+const HEX_TABLE = Array.from({ length: 256 }, (_, i) => (i < 16 ? "0" : "") + i.toString(16));
+
 /**
  * Преобразует компоненты цвета R, G, B в hex-строку вида "#rrggbb".
  * @param {number} r
@@ -224,10 +228,7 @@ export function resizeRgba(src, srcW, srcH, dstW, dstH) {
  * @returns {string}
  */
 export function rgbaToHex(r, g, b) {
-    const hexR = (r < 16 ? "0" : "") + r.toString(16);
-    const hexG = (g < 16 ? "0" : "") + g.toString(16);
-    const hexB = (b < 16 ? "0" : "") + b.toString(16);
-    return `#${hexR}${hexG}${hexB}`;
+    return `#${HEX_TABLE[r & 0xff]}${HEX_TABLE[g & 0xff]}${HEX_TABLE[b & 0xff]}`;
 }
 
 /**
@@ -258,8 +259,8 @@ export function rgbaToHalfBlockBlessed(data, width, height) {
             const topOffset = topRowOffset + x * 4;
             const botOffset = botRowOffset + x * 4;
 
-            const topHex = rgbaToHex(data[topOffset], data[topOffset + 1], data[topOffset + 2]);
-            const botHex = rgbaToHex(data[botOffset], data[botOffset + 1], data[botOffset + 2]);
+            const topHex = `#${HEX_TABLE[data[topOffset]]}${HEX_TABLE[data[topOffset + 1]]}${HEX_TABLE[data[topOffset + 2]]}`;
+            const botHex = `#${HEX_TABLE[data[botOffset]]}${HEX_TABLE[data[botOffset + 1]]}${HEX_TABLE[data[botOffset + 2]]}`;
 
             if (topHex !== currentFg) {
                 line += `{${topHex}-fg}`;
@@ -294,8 +295,11 @@ export function rgbaToHalfBlockBlessed(data, width, height) {
  * @returns {string}
  */
 export function renderImageBuffer(buffer, { mimeType = "", maxWidth = 36, maxHeight = 14, cacheKey } = {}) {
-    if (cacheKey && imagePreviewCache.has(cacheKey)) {
-        return imagePreviewCache.get(cacheKey);
+    // Размер входит в ключ: одно и то же фото рисуется и миниатюрой в ленте, и на весь
+    // экран в просмотрщике. Без размера полноэкранный рендер подменял бы превью в ленте.
+    const key = cacheKey ? `${cacheKey}@${maxWidth}x${maxHeight}` : null;
+    if (key && imagePreviewCache.has(key)) {
+        return imagePreviewCache.get(key);
     }
 
     try {
@@ -304,12 +308,12 @@ export function renderImageBuffer(buffer, { mimeType = "", maxWidth = 36, maxHei
         const resized = resizeRgba(decoded.data, decoded.width, decoded.height, dstW, dstH);
         const blessedText = rgbaToHalfBlockBlessed(resized, dstW, dstH);
 
-        if (cacheKey) {
+        if (key) {
             if (imagePreviewCache.size >= MAX_CACHE_SIZE) {
                 const firstKey = imagePreviewCache.keys().next().value;
                 imagePreviewCache.delete(firstKey);
             }
-            imagePreviewCache.set(cacheKey, blessedText);
+            imagePreviewCache.set(key, blessedText);
         }
 
         return blessedText;
@@ -330,10 +334,7 @@ export function renderImageBuffer(buffer, { mimeType = "", maxWidth = 36, maxHei
 export function renderStrippedThumbnail(strippedBytes, { maxWidth = 36, maxHeight = 14, cacheKey } = {}) {
     if (!strippedBytes || strippedBytes.length < 3) return "";
 
-    if (cacheKey && imagePreviewCache.has(cacheKey)) {
-        return imagePreviewCache.get(cacheKey);
-    }
-
+    // Кэш проверяет renderImageBuffer: только он знает итоговый ключ с размером
     try {
         const jpgBuf = strippedPhotoToJpg(strippedBytes);
         return renderImageBuffer(jpgBuf, { mimeType: "image/jpeg", maxWidth, maxHeight, cacheKey });
@@ -341,3 +342,306 @@ export function renderStrippedThumbnail(strippedBytes, { maxWidth = 36, maxHeigh
         return "";
     }
 }
+
+/**
+ * Извлекает исходные размеры медиа (ширину и высоту в пикселях) из объекта сообщения Telegram.
+ * @param {object} rawMessage исходное сообщение или объект медиа
+ * @returns {{ width: number, height: number }|null}
+ */
+export function getMediaDimensions(rawMessage) {
+    const media = rawMessage?.media || rawMessage;
+    if (!media) return null;
+
+    // 1. Фотография
+    if (media.className === "MessageMediaPhoto" || media.photo) {
+        const photo = media.photo || media;
+        let maxW = 0;
+        let maxH = 0;
+        for (const s of photo.sizes || []) {
+            if (s && typeof s.w === "number" && typeof s.h === "number" && s.w > 0 && s.h > 0) {
+                if (s.w * s.h > maxW * maxH) {
+                    maxW = s.w;
+                    maxH = s.h;
+                }
+            }
+        }
+        if (maxW > 0 && maxH > 0) {
+            return { width: maxW, height: maxH };
+        }
+    }
+
+    // 2. Документ (видео, изображение, gif)
+    if (media.className === "MessageMediaDocument" || media.document) {
+        const doc = media.document || media;
+        const attributes = doc.attributes || [];
+        for (const attr of attributes) {
+            if ((attr.className === "DocumentAttributeVideo" || attr.className === "DocumentAttributeImageSize") && attr.w && attr.h) {
+                return { width: attr.w, height: attr.h };
+            }
+        }
+        let maxW = 0;
+        let maxH = 0;
+        for (const t of doc.thumbs || []) {
+            if (t && typeof t.w === "number" && typeof t.h === "number" && t.w > 0 && t.h > 0) {
+                if (t.w * t.h > maxW * maxH) {
+                    maxW = t.w;
+                    maxH = t.h;
+                }
+            }
+        }
+        if (maxW > 0 && maxH > 0) {
+            return { width: maxW, height: maxH };
+        }
+    }
+
+    // 3. Веб-страница (встроенное медиа статьи/ссылки)
+    if (media.className === "MessageMediaWebPage" || media.webpage) {
+        const page = media.webpage || media;
+        if (page.photo) {
+            const dims = getMediaDimensions(page.photo);
+            if (dims) return dims;
+        }
+        if (page.document) {
+            const dims = getMediaDimensions(page.document);
+            if (dims) return dims;
+        }
+    }
+
+    return null;
+}
+
+/**
+ * Проверяет, является ли вложение визуальным медиа (фото, видео, анимация),
+ * для которого отображается визуальное превью в ленте сообщений.
+ * @param {object} rawMessage
+ * @returns {boolean}
+ */
+export function isPreviewableMedia(rawMessage) {
+    const media = rawMessage?.media || rawMessage;
+    if (!media) return false;
+
+    if (media.className === "MessageMediaPhoto" || media.photo) {
+        return true;
+    }
+
+    if (media.className === "MessageMediaDocument" || media.document) {
+        const doc = media.document || media;
+        if (typeof doc.mimeType === "string") {
+            if (doc.mimeType.startsWith("video/") || doc.mimeType.startsWith("image/")) {
+                return true;
+            }
+        }
+
+        const attributes = doc.attributes || [];
+        for (const attr of attributes) {
+            if (
+                attr.className === "DocumentAttributeVideo" ||
+                attr.className === "DocumentAttributeImageSize" ||
+                attr.className === "DocumentAttributeAnimated" ||
+                attr.className === "DocumentAttributeSticker"
+            ) {
+                return true;
+            }
+        }
+
+        if (Array.isArray(doc.thumbs) && doc.thumbs.length > 0) {
+            const isAudio = attributes.some((a) => a.className === "DocumentAttributeAudio");
+            if (!isAudio) {
+                return true;
+            }
+        }
+    }
+
+    if (media.className === "MessageMediaWebPage" || media.webpage) {
+        const page = media.webpage || media;
+        return Boolean(page.photo || (page.document && isPreviewableMedia(page.document)));
+    }
+
+    return false;
+}
+
+/** Цветовая палитра по умолчанию для прелоадера медиа-вложений. */
+const DEFAULT_PRELOADER_PALETTE = {
+    bg: "#1f2335",
+    border: "#3b4261",
+    fg: "#8288a6",
+    accent: "#7aa2f7",
+    dim: "#6874a0",
+};
+
+/**
+ * Генерирует строку Blessed-разметки для прелоадера / плейсхолдера медиа-вложения
+ * точного целевого размера, чтобы избежать скачков интерфейса и сдвигов сообщений
+ * при асинхронной подгрузке превью.
+ *
+ * @param {object} rawMessage исходное сообщение или объект медиа
+ * @param {object} [options]
+ * @param {number} [options.maxWidth=36]
+ * @param {number} [options.maxHeight=14]
+ * @param {string} [options.customLabel] пользовательская подпись
+ * @param {object} [options.palette] цвета темы (border, bg, fg, accent)
+ * @returns {string}
+ */
+export function renderMediaPreloader(rawMessage, {
+    maxWidth = 36,
+    maxHeight = 14,
+    customLabel,
+    palette,
+} = {}) {
+    const dims = getMediaDimensions(rawMessage);
+    const srcW = dims?.width || 320;
+    const srcH = dims?.height || 240;
+    const { dstW, rows } = calculateTargetDimensions(srcW, srcH, maxWidth, maxHeight);
+
+    const p = { ...DEFAULT_PRELOADER_PALETTE, ...(palette || {}) };
+
+    const media = rawMessage?.media || rawMessage;
+    const isDoc = media?.className === "MessageMediaDocument" || Boolean(media?.document);
+    const doc = media?.document || (isDoc ? media : null);
+    const attributes = doc?.attributes || [];
+
+    const isVideo = (typeof doc?.mimeType === "string" && doc.mimeType.startsWith("video/")) ||
+        attributes.some((a) => a?.className === "DocumentAttributeVideo");
+    const isGif = doc?.mimeType === "image/gif" ||
+        attributes.some((a) => a?.className === "DocumentAttributeAnimated");
+    const isSticker = attributes.some((a) => a?.className === "DocumentAttributeSticker");
+
+    // Определение длительности видео, если доступна
+    let duration = 0;
+    if (isVideo) {
+        const videoAttr = attributes.find((a) => a?.className === "DocumentAttributeVideo");
+        if (videoAttr?.duration) {
+            duration = videoAttr.duration;
+        }
+    }
+
+    // Подготовка текстовых меток
+    let primaryLabel = customLabel || "";
+    if (!primaryLabel) {
+        if (isVideo) {
+            primaryLabel = dstW >= 24 ? "⏳ Загрузка видео..." : (dstW >= 16 ? "⏳ Видео..." : "⏳ Видео");
+        } else if (isGif) {
+            primaryLabel = dstW >= 22 ? "⏳ Загрузка GIF..." : "⏳ GIF";
+        } else if (isSticker) {
+            primaryLabel = dstW >= 24 ? "⏳ Загрузка стикера..." : "⏳ Стикер";
+        } else {
+            primaryLabel = dstW >= 22 ? "⏳ Загрузка фото..." : (dstW >= 16 ? "⏳ Фото..." : "⏳ Фото");
+        }
+    }
+
+    let secondaryLabel = "";
+    if (duration > 0 && dims?.width && dims?.height) {
+        const minSec = `${Math.floor(duration / 60)}:${String(Math.floor(duration % 60)).padStart(2, "0")}`;
+        secondaryLabel = dstW >= 22 ? `${minSec} · ${dims.width}×${dims.height}` : minSec;
+    } else if (duration > 0) {
+        secondaryLabel = `${Math.floor(duration / 60)}:${String(Math.floor(duration % 60)).padStart(2, "0")}`;
+    } else if (dims?.width && dims?.height) {
+        secondaryLabel = `${dims.width}×${dims.height}`;
+    }
+
+    const innerWidth = Math.max(1, dstW - 2);
+    const innerHeight = Math.max(1, rows - 2);
+
+    const borderTag = `{${p.border}-fg}`;
+    const borderClose = `{/${p.border}-fg}`;
+    const bgTag = p.bg ? `{${p.bg}-bg}` : "";
+    const bgClose = p.bg ? `{/${p.bg}-bg}` : "";
+    const textTag = `{${p.fg}-fg}`;
+    const textClose = `{/${p.fg}-fg}`;
+    const dimTag = `{${p.dim}-fg}`;
+    const dimClose = `{/${p.dim}-fg}`;
+
+    // Если места слишком мало для рамки (высота 1-2 строки)
+    if (rows <= 1) {
+        const line = `[ ${primaryLabel} ]`;
+        const pad = Math.max(0, dstW - stringCellWidth(line));
+        return `${bgTag}${textTag}${line}${" ".repeat(pad)}${textClose}${bgClose}`;
+    }
+
+    if (rows === 2) {
+        const topLine = `${borderTag}┌─ ${borderClose}${textTag}${primaryLabel}${textClose} ${borderTag}${"─".repeat(Math.max(0, innerWidth - stringCellWidth(primaryLabel) - 3))}┐${borderClose}`;
+        const botLine = `${borderTag}└${"─".repeat(innerWidth)}┘${borderClose}`;
+        return `${bgTag}${topLine}${bgClose}\n${bgTag}${botLine}${bgClose}`;
+    }
+
+    const lines = [];
+
+    // Верхняя граница
+    lines.push(`${bgTag}${borderTag}┌${"─".repeat(innerWidth)}┐${borderClose}${bgClose}`);
+
+    // Вычисление строки размещения подписей
+    const hasSecondary = Boolean(secondaryLabel) && innerHeight >= 3 && stringCellWidth(secondaryLabel) <= innerWidth;
+    const contentLinesCount = hasSecondary ? 2 : 1;
+    const startContentRow = Math.max(0, Math.floor((innerHeight - contentLinesCount) / 2));
+
+    for (let r = 0; r < innerHeight; r++) {
+        let content = "";
+        if (r === startContentRow) {
+            let label = primaryLabel;
+            if (stringCellWidth(label) > innerWidth) {
+                label = label.slice(0, Math.max(1, innerWidth - 1)) + "…";
+            }
+            const width = stringCellWidth(label);
+            const leftPad = Math.max(0, Math.floor((innerWidth - width) / 2));
+            const rightPad = Math.max(0, innerWidth - width - leftPad);
+            content = " ".repeat(leftPad) + textTag + label + textClose + " ".repeat(rightPad);
+        } else if (hasSecondary && r === startContentRow + 1) {
+            let label = secondaryLabel;
+            if (stringCellWidth(label) > innerWidth) {
+                label = label.slice(0, Math.max(1, innerWidth - 1));
+            }
+            const width = stringCellWidth(label);
+            const leftPad = Math.max(0, Math.floor((innerWidth - width) / 2));
+            const rightPad = Math.max(0, innerWidth - width - leftPad);
+            content = " ".repeat(leftPad) + dimTag + label + dimClose + " ".repeat(rightPad);
+        } else {
+            content = " ".repeat(innerWidth);
+        }
+
+        lines.push(`${bgTag}${borderTag}│${borderClose}${content}${borderTag}│${borderClose}${bgClose}`);
+    }
+
+    // Нижняя граница
+    lines.push(`${bgTag}${borderTag}└${"─".repeat(innerWidth)}┘${borderClose}${bgClose}`);
+
+    return lines.join("\n");
+}
+
+/**
+ * Извлекает готовое превью изображения из кэша по объекту сообщения, если оно уже рендерилось.
+ * @param {object} rawMessage
+ * @param {object} [options]
+ * @param {number} [options.maxWidth=36]
+ * @param {number} [options.maxHeight=14]
+ * @returns {string|null}
+ */
+export function getCachedImagePreview(rawMessage, { maxWidth = 36, maxHeight = 14 } = {}) {
+    const media = rawMessage?.media || rawMessage;
+    if (!media) return null;
+
+    const photo = media.photo || (media.className === "MessageMediaPhoto" ? media : null);
+    const doc = media.document || (media.className === "MessageMediaDocument" ? media : null);
+
+    const keysToCheck = [];
+    if (photo?.id) {
+        keysToCheck.push(`photo_${photo.id}@${maxWidth}x${maxHeight}`);
+        keysToCheck.push(`photo_full_${photo.id}@${maxWidth}x${maxHeight}`);
+    }
+    if (doc?.id) {
+        keysToCheck.push(`doc_${doc.id}@${maxWidth}x${maxHeight}`);
+        keysToCheck.push(`doc_full_${doc.id}@${maxWidth}x${maxHeight}`);
+    }
+    if (rawMessage?.id) {
+        keysToCheck.push(`msg_${rawMessage.id}@${maxWidth}x${maxHeight}`);
+        keysToCheck.push(`photo_full_${rawMessage.id}@${maxWidth}x${maxHeight}`);
+        keysToCheck.push(`doc_full_${rawMessage.id}@${maxWidth}x${maxHeight}`);
+    }
+
+    for (const key of keysToCheck) {
+        if (imagePreviewCache.has(key)) {
+            return imagePreviewCache.get(key);
+        }
+    }
+
+    return null;
+}

package/src/utils/mouse.js

@@ -5,7 +5,7 @@
 import unicode from "neo-blessed/lib/unicode.js";
 
 /** Пиктограммы и эмодзи, занимающие две ячейки терминала. */
-const EMOJI_REGEX = /\p{Extended_Pictographic}/u;
+const EMOJI_REGEX = /\p{Extended_Pictographic}|[\u{1F000}-\u{1FAFF}]|[\u{2600}-\u{27BF}]/u;
 
 /**
  * Вычисляет ширину строки в терминальных ячейках.
@@ -24,6 +24,17 @@ export function stringCellWidth(text) {
     return width;
 }
 
+/**
+ * Отличает клик правой кнопкой от остальных.
+ * neo-blessed эмитит одно и то же событие "click" для любой кнопки мыши,
+ * поэтому компоненты, где правый клик не имеет смысла, обязаны его отсеивать.
+ * @param {{ button?: string }} [data] данные события мыши blessed
+ * @returns {boolean}
+ */
+export function isRightClick(data) {
+    return data?.button === "right";
+}
+
 /**
  * Проверяет, попадают ли координаты (x, y) внутрь прямоугольной области.
  * @param {number} x абсолютная или относительная X-координата
@@ -64,82 +75,43 @@ export function getTabByCoordinate(relativeX, tabKeys = DEFAULT_TAB_KEYS, tabNam
 }
 
 /**
- * Строит карту диапазонов строк для каждого сообщения в ленте чата.
- * Нужна для точного определения сообщения, по которому кликнули мышью в ChatView.
- * @param {Array<object>} messages список сообщений чата
- * @returns {Array<{ message: object, startLine: number, endLine: number }>}
+ * Находит сообщение в ленте по номеру отображаемой строки с учётом текущей прокрутки.
+ * Карту строк строит ChatView при отрисовке ленты — только он знает реальную вёрстку.
+ * @param {number} lineIndex индекс строки в буфере ленты (0-based)
+ * @param {Array<{ message: object, startLine: number, endLine: number }>} ranges
+ * @returns {object|null}
  */
-export function buildMessageLineRanges(messages) {
-    if (!messages || messages.length === 0) return [];
-
-    const ranges = [];
-    let currentLine = 0;
-    let lastDateString = "";
-
-    for (const msg of messages) {
-        // 1. Проверяем разделитель дат (если дата изменилась)
-        const dateDivider = msg.date ? new Date(msg.date).toLocaleDateString("ru-RU") : "";
-        if (dateDivider && dateDivider !== lastDateString) {
-            // Форматтер добавляет: \n ─────── дата ─────── \n\n (3 строки)
-            currentLine += 3;
-            lastDateString = dateDivider;
-        }
-
-        const startLine = currentLine;
-
-        // 2. Строка автора/времени
-        currentLine += 1;
-
-        // 3. Блок ответа (Reply), если есть
-        if (msg.replyToMsgId) {
-            currentLine += 1;
-        }
-
-        // 4. Тело сообщения (текст + медиа-описание + превью)
-        let bodyLinesCount = 1;
-        const parts = [];
-        if (msg.mediaDescription) parts.push(msg.mediaDescription);
-        if (msg.imagePreview) parts.push(msg.imagePreview);
-        if (msg.text) parts.push(msg.text);
-
-        if (parts.length > 0) {
-            const fullBody = parts.join("\n");
-            bodyLinesCount = fullBody.split("\n").length;
-        }
-        currentLine += bodyLinesCount;
+export function getMessageAtLine(lineIndex, ranges) {
+    if (!ranges || ranges.length === 0 || lineIndex < 0) return null;
 
-        // 5. Реакции, если есть
-        if (msg.reactions && msg.reactions.length > 0) {
-            currentLine += 1;
+    for (const item of ranges) {
+        if (lineIndex >= item.startLine && lineIndex <= item.endLine) {
+            return item.message;
         }
-
-        // 6. Замыкающий отступ между сообщениями (\n\n)
-        const endLine = currentLine;
-        currentLine += 2;
-
-        ranges.push({
-            message: msg,
-            startLine,
-            endLine,
-        });
     }
 
-    return ranges;
+    return null;
 }
 
 /**
- * Находит сообщение в ленте по номеру отображаемой строки с учётом текущей прокрутки.
+ * Определяет, в какую часть сообщения попал клик: в превью изображения или в остальной текст.
  * @param {number} lineIndex индекс строки в буфере ленты (0-based)
- * @param {Array<{ message: object, startLine: number, endLine: number }>} ranges
- * @returns {object|null}
+ * @param {number} relativeX смещение по X от левого края ленты (в ячейках)
+ * @param {Array<{ message: object, startLine: number, endLine: number, image?: object|null }>} ranges
+ * @returns {{ message: object, part: "image"|"body" }|null}
  */
-export function getMessageAtLine(lineIndex, ranges) {
+export function getMessagePartAtPoint(lineIndex, relativeX, ranges) {
     if (!ranges || ranges.length === 0 || lineIndex < 0) return null;
 
     for (const item of ranges) {
-        if (lineIndex >= item.startLine && lineIndex <= item.endLine) {
-            return item.message;
-        }
+        if (lineIndex < item.startLine || lineIndex > item.endLine) continue;
+
+        const image = item.image;
+        const insideImage = Boolean(image)
+            && lineIndex >= image.startLine && lineIndex <= image.endLine
+            && relativeX >= image.left && relativeX < image.right;
+
+        return { message: item.message, part: insideImage ? "image" : "body" };
     }
 
     return null;
@@ -179,6 +151,9 @@ export function getStatusBarActionAt(relativeX, totalWidth = 120) {
     return null;
 }
 
+/** Ширина логотипа « 🚀 TuiGram» в ячейках — кликабельная зона вызова справки. */
+const HEADER_LOGO_WIDTH = stringCellWidth(" 🚀 TuiGram");
+
 /**
  * Определяет действие при клике на верхнюю шапку приложения.
  * @param {number} relativeX смещение по X от левого края шапки
@@ -190,7 +165,8 @@ export function getStatusBarActionAt(relativeX, totalWidth = 120) {
 export function getHeaderActionAt(relativeX, relativeY, { hasActiveChat = false } = {}) {
     // Внутренняя строка 1 (верхняя линия контента): логотип TuiGram, имя пользователя, статус
     if (relativeY === 1) {
-        if (relativeX >= 1 && relativeX <= 14) {
+        // Контент шапки начинается после рамки, поэтому логотип занимает ячейки 1..HEADER_LOGO
+        if (relativeX >= 1 && relativeX <= HEADER_LOGO_WIDTH) {
             return "help";
         }
         return "status";
@@ -206,6 +182,20 @@ export function getHeaderActionAt(relativeX, relativeY, { hasActiveChat = false
     return null;
 }
 
+/**
+ * Сегменты подсказок контекстной строки ввода в том порядке и с теми подписями,
+ * какими их рисует inputBox.renderContext. Ширины считаются из самих подписей —
+ * зашитые вручную координаты разъезжались при любой правке текста.
+ */
+const INPUT_HINT_SEGMENTS = [
+    { id: null, label: " Введите сообщение...  " },
+    { id: null, label: "[Enter] Отправить  " },
+    { id: null, label: "[Ctrl+J] Новая строка  " },
+    { id: "reply", label: "[Ctrl+R] Ответ  " },
+    { id: "edit", label: "[Ctrl+E] Правка  " },
+    { id: "commands", label: "[/] Команды" },
+];
+
 /**
  * Определяет действие при клике на контекстную строку поля ввода.
  * @param {number} relativeX смещение по X от левого края контекстной строки
@@ -220,16 +210,13 @@ export function getInputContextActionAt(relativeX, mode) {
 
     if (relativeX < 0) return null;
 
-    // Подсказки в обычном режиме:
-    //  Введите сообщение...   [Enter] Отправить   [Ctrl+J] Новая строка   [Ctrl+R] Ответ   [Ctrl+E] Правка   [/] Команды
-    if (relativeX >= 55 && relativeX < 73) {
-        return "reply";
-    }
-    if (relativeX >= 73 && relativeX < 91) {
-        return "edit";
-    }
-    if (relativeX >= 91) {
-        return "commands";
+    let currentX = 0;
+    for (const seg of INPUT_HINT_SEGMENTS) {
+        const segWidth = stringCellWidth(seg.label);
+        if (relativeX >= currentX && relativeX < currentX + segWidth) {
+            return seg.id;
+        }
+        currentX += segWidth;
     }
 
     return null;