@sequent-org/moodboard 1.4.60 → 1.4.61

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sequent-org/moodboard",
-  "version": "1.4.60",
+  "version": "1.4.61",
   "type": "module",
   "description": "Interactive moodboard",
   "main": "./src/index.js",

package/src/assets/icons/ban.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-ban-icon lucide-ban"><circle cx="12" cy="12" r="10"/><path d="M4.929 4.929 19.07 19.071"/></svg>

package/src/tools/object-tools/connector/ConnectorDragController.js

@@ -101,34 +101,6 @@ export class ConnectorDragController {
         return { x: posData.position.x, y: posData.position.y, ...sizeData.size };
     }
 
-    /**
-     * Визуальные габариты объекта с учётом hover-трансформации (scale + подъём).
-     * Подсветка коннектора должна совпадать с тем, что видит пользователь, а не
-     * с логическими bounds из состояния. Привязка коннектора при этом остаётся
-     * на логических bounds — трансформируется только прямоугольник подсветки.
-     */
-    _visualBounds(objectId, bounds) {
-        const hoverLift = this.core?.pixi?.hoverLift;
-        if (!hoverLift) return bounds;
-
-        const pixiReq = { objectId, pixiObject: null };
-        this.eventBus.emit(Events.Tool.GetObjectPixi, pixiReq);
-        const pixiObject = pixiReq.pixiObject;
-        if (!pixiObject) return bounds;
-
-        const t = hoverLift.getVisualTransform(pixiObject);
-        if (!t) return bounds;
-
-        const width  = bounds.width  * t.scaleMulX;
-        const height = bounds.height * t.scaleMulY;
-        return {
-            x: t.centerX - width  / 2,
-            y: t.centerY - height / 2,
-            width,
-            height,
-        };
-    }
-
     /**
      * Возвращает ближайший якорь из TARGET_ANCHORS в пределах ANCHOR_SNAP_CSS от worldPt,
      * иначе null. Приоритет выше грани — вызывать в _resolveEnd первым.
@@ -200,6 +172,9 @@ export class ConnectorDragController {
             if (Math.abs(e.clientX - this._startX) < DRAG_THRESHOLD
              && Math.abs(e.clientY - this._startY) < DRAG_THRESHOLD) return;
             this._dragging = true;
+            // Гасим hover-lift на время протягивания: цель не должна масштабироваться
+            // и подниматься, иначе её границы вылезают за рамку подсветки.
+            this.core?.pixi?.hoverLift?.setConnecting(true);
             const world = this._world();
             if (world) {
                 this._previewGraphics   = new PIXI.Graphics();
@@ -220,9 +195,12 @@ export class ConnectorDragController {
         if (objectId && objectId !== this._sourceTerminal?.boundId) {
             const bounds = this._objectBounds(objectId);
             if (bounds) {
-                const visual = this._visualBounds(objectId, bounds);
+                // Рамку строим строго по логическим bounds — коннектор привязывается
+                // к ним же. Hover-трансформацию (scale/lift) не учитываем: иначе рамка
+                // выпирает за периметр объекта (раздув ×scale + подъём центра вверх) и
+                // отстаёт от анимации, т.к. перерисовывается только на pointermove.
                 this._highlightGraphics.lineStyle({ width: 2, color: 0x2563EB, alpha: 0.85 });
-                this._highlightGraphics.drawRect(visual.x, visual.y, visual.width, visual.height);
+                this._highlightGraphics.drawRect(bounds.x, bounds.y, bounds.width, bounds.height);
                 // Подводим превью к коннектору, если курсор в зоне магнита
                 const snapAnchor = this._snapToAnchor(bounds, worldPt);
                 if (snapAnchor) {
@@ -249,6 +227,7 @@ export class ConnectorDragController {
         const source      = this._sourceTerminal;
         this._dragging        = false;
         this._sourceTerminal  = null;
+        this.core?.pixi?.hoverLift?.setConnecting(false);
         this._clearGraphics();
 
         if (!source) return;
@@ -360,6 +339,7 @@ export class ConnectorDragController {
     destroy() {
         document.removeEventListener('pointermove', this._boundMove);
         document.removeEventListener('pointerup',   this._boundUp);
+        this.core?.pixi?.hoverLift?.setConnecting(false);
         if (this._pendingDupListener) {
             this.eventBus?.off(Events.Tool.DuplicateReady, this._pendingDupListener);
             this._pendingDupListener = null;

package/src/tools/object-tools/selection/NoteInlineEditorController.js

@@ -1,9 +1,33 @@
 import { Events } from '../../../core/events/Events.js';
 import {
+    applyNoteEditorBox,
     createNoteEditorUpdater,
     registerNoteEditorSync,
 } from './TextEditorSyncService.js';
 
+// Разметка иконки запрета (assets/icons/ban.svg). stroke=currentColor — цвет задаётся CSS.
+const NOTE_BAN_SVG = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M4.929 4.929 19.07 19.071"/></svg>';
+
+/**
+ * Создаёт (или переиспользует) оверлей запрета ввода внутри wrapper редактора записки
+ * и возвращает функцию переключения его видимости.
+ * @param {HTMLElement} wrapper
+ * @returns {(visible: boolean) => void}
+ */
+function ensureNoteLimitBan(wrapper) {
+    let banEl = wrapper.querySelector('.moodboard-note-limit-ban');
+    if (!banEl) {
+        banEl = document.createElement('div');
+        banEl.className = 'moodboard-note-limit-ban';
+        banEl.innerHTML = NOTE_BAN_SVG;
+        banEl.style.display = 'none';
+        wrapper.appendChild(banEl);
+    }
+    return (visible) => {
+        banEl.style.display = visible ? 'flex' : 'none';
+    };
+}
+
 export function setupNoteInlineEditor(controller, params) {
     const {
         objectId,
@@ -35,69 +59,50 @@ export function setupNoteInlineEditor(controller, params) {
         }
     }
 
-    // Текст у записки центрирован по обеим осям; textarea тоже центрируем
-    const horizontalPadding = 16; // немного больше, чем раньше
-    // Преобразуем мировые размеры/отступы в CSS-пиксели с учётом текущего зума
-    const viewResLocal = (controller.app?.renderer?.resolution) || (view.width && view.clientWidth ? (view.width / view.clientWidth) : 1);
+    // Текст у записки центрирован по обеим осям; редактор повторяет блок текста.
+    const horizontalPadding = 16;
+    // Мировые размеры/отступы → CSS-пиксели. Множитель = worldScale, БЕЗ деления на
+    // renderer.resolution: screenPos берётся из toGlobal (см. InlineEditorPositioningService),
+    // который уже возвращает CSS-px независимо от res, а сама записка рисуется в PIXI, где
+    // 1 мировая единица = worldScale CSS-px. Лишнее /res занижало ширину блока и слагаемое
+    // центрирования (noteWidth*scale/2) → при зуме браузера ≠100% (res≠1) редактор уезжал влево.
     const worldLayerRefForCss = controller.textEditor.world || (controller.app?.stage);
     const sForCss = worldLayerRefForCss?.scale?.x || 1;
-    const sCssLocal = sForCss / viewResLocal;
-    const editorWidthWorld = Math.min(360, Math.max(1, noteWidth - (horizontalPadding * 2)));
-    const editorHeightWorld = Math.min(180, Math.max(1, noteHeight - (horizontalPadding * 2)));
-    const editorWidthPx = Math.max(1, Math.round(editorWidthWorld * sCssLocal));
-    const editorHeightPx = Math.max(1, Math.round(editorHeightWorld * sCssLocal));
-    const textCenterXWorld = noteWidth / 2;
-    const textCenterYWorld = noteHeight / 2;
-    const editorLeftWorld = textCenterXWorld - (editorWidthWorld / 2);
-    const editorTopWorld = textCenterYWorld - (editorHeightWorld / 2);
-    wrapper.style.left = `${Math.round(screenPos.x + editorLeftWorld * sCssLocal)}px`;
-    wrapper.style.top = `${Math.round(screenPos.y + editorTopWorld * sCssLocal)}px`;
-    // Устанавливаем размеры редактора (центрируем по контенту) в CSS-пикселях
-    textarea.style.width = `${editorWidthPx}px`;
-    textarea.style.height = `${editorHeightPx}px`;
-    wrapper.style.width = `${editorWidthPx}px`;
-    wrapper.style.height = `${editorHeightPx}px`;
+    const sCssLocal = sForCss;
 
-    // Для записок: авто-ресайз редактора под содержимое с сохранением центрирования.
-    // backdrop (видимые глифы) обязан повторять выравнивание textarea, иначе каретка,
-    // позиционируемая по center-align textarea, уходит вправо от прижатого влево текста.
-    textarea.style.textAlign = 'center';
     const backdrop = wrapper.querySelector('.moodboard-text-backdrop');
-    if (backdrop) {
-        backdrop.style.textAlign = 'center';
-    }
-    const maxEditorWidthPx = Math.max(1, Math.round((noteWidth - (horizontalPadding * 2)) * sCssLocal));
-    const maxEditorHeightPx = Math.max(1, Math.round((noteHeight - (horizontalPadding * 2)) * sCssLocal));
-    const MIN_NOTE_EDITOR_W = 20;
-    const MIN_NOTE_EDITOR_H = Math.max(1, computeLineHeightPx(effectiveFontPx));
 
-    const autoSizeNote = () => {
-        // Сначала сбрасываем размеры, чтобы измерить естественные
-        textarea.style.width = 'auto';
-        textarea.style.height = 'auto';
+    // Оверлей запрета ввода: показывается по центру записки, когда достигнут лимит
+    // строк (NOTE_MAX_LINES). Иконка — assets/icons/ban.svg (stroke=currentColor).
+    const setBanVisible = ensureNoteLimitBan(wrapper);
 
-        // Ширина по содержимому, но не шире границ записки (в CSS-пикселях)
-        const naturalW = Math.ceil(textarea.scrollWidth + 1);
-        const targetW = Math.min(maxEditorWidthPx, Math.max(MIN_NOTE_EDITOR_W, naturalW));
-        textarea.style.width = `${targetW}px`;
-        wrapper.style.width = `${targetW}px`;
+    // Внутренний блок текста = границы записки минус отступы, ограничение ширины 360 —
+    // как в NoteObject._getVisibleTextWidth.
+    const MIN_NOTE_EDITOR_H = Math.max(1, computeLineHeightPx(effectiveFontPx));
+    const innerWorldW = Math.max(1, Math.min(360, noteWidth - (horizontalPadding * 2)));
+    const innerWorldH = Math.max(1, noteHeight - (horizontalPadding * 2));
+    const boxW = Math.max(1, Math.round(innerWorldW * sCssLocal));
+    const innerH = Math.max(MIN_NOTE_EDITOR_H, Math.round(innerWorldH * sCssLocal));
 
-        // Высота по содержимому, c нижним пределом = одна строка
-        const computed = (typeof window !== 'undefined') ? window.getComputedStyle(textarea) : null;
-        const lineH = (computed ? parseFloat(computed.lineHeight) : computeLineHeightPx(effectiveFontPx));
-        const naturalH = Math.ceil(textarea.scrollHeight);
-        const targetH = Math.min(maxEditorHeightPx, Math.max(MIN_NOTE_EDITOR_H, naturalH));
-        textarea.style.height = `${targetH}px`;
-        wrapper.style.height = `${targetH}px`;
+    const autoSizeNote = () => {
+        const result = applyNoteEditorBox(textarea, backdrop, {
+            boxW,
+            innerH,
+            effectiveFontPx,
+        });
+        wrapper.style.width = `${boxW}px`;
+        wrapper.style.height = `${result.contentH}px`;
 
-        // Центрируем wrapper внутри записки после смены размеров (в CSS-пикселях)
-        const left = Math.round(screenPos.x + (noteWidth * sCssLocal) / 2 - (targetW / 2));
-        const top = Math.round(screenPos.y + (noteHeight * sCssLocal) / 2 - (targetH / 2));
+        // Центрируем блок контента внутри записки по обеим осям (как PIXI-текст).
+        const left = Math.round(screenPos.x + (noteWidth * sCssLocal) / 2 - (boxW / 2));
+        const top = Math.round(screenPos.y + (noteHeight * sCssLocal) / 2 - (result.contentH / 2));
         wrapper.style.left = `${left}px`;
         wrapper.style.top = `${top}px`;
+        return result;
     };
     // Первый вызов — синхронизировать с текущим содержимым
-    autoSizeNote();
+    const initial = autoSizeNote();
+    setBanVisible(!!(initial && initial.full));
 
     // Динамическое обновление позиции/размера редактора при зуме/панорамировании/трансформациях
     const updateNoteEditor = createNoteEditorUpdater(controller, {
@@ -115,5 +120,5 @@ export function setupNoteInlineEditor(controller, params) {
     });
     registerNoteEditorSync(controller, { objectId, updateNoteEditor });
 
-    return { updateNoteEditor };
+    return { updateNoteEditor, setBanVisible };
 }

package/src/tools/object-tools/selection/TextEditorCaretService.js

@@ -8,6 +8,45 @@ const propertiesToCopy = [
 ];
 
 let mirrorDiv = null;
+let glyphMeasureCanvas = null;
+
+// Возвращает выступ чернил (ink) глифа за его advance width в CSS-px. У рукописных и
+// наклонных шрифтов (например Caveat) правый край буквы выходит за ширину продвижения,
+// по которой считается позиция каретки, поэтому она визуально наезжает на символ.
+// actualBoundingBoxRight — расстояние от точки отрисовки до правого края чернил;
+// разница с width даёт величину выступа. <=0 для обычных прямых шрифтов.
+function measureGlyphRightOverflow(computed, ch) {
+    if (!ch || ch === '\n') {
+        return 0;
+    }
+    try {
+        if (typeof document === 'undefined') {
+            return 0;
+        }
+        if (!glyphMeasureCanvas) {
+            glyphMeasureCanvas = document.createElement('canvas');
+        }
+        const ctx = glyphMeasureCanvas.getContext('2d');
+        if (!ctx) {
+            return 0;
+        }
+        const fontStyle = computed.fontStyle || 'normal';
+        const fontWeight = computed.fontWeight || 'normal';
+        const fontSize = computed.fontSize || '16px';
+        const fontFamily = computed.fontFamily || 'sans-serif';
+        ctx.font = `${fontStyle} ${fontWeight} ${fontSize} ${fontFamily}`;
+        const metrics = ctx.measureText(ch);
+        const advance = metrics.width || 0;
+        const inkRight = metrics.actualBoundingBoxRight;
+        if (!Number.isFinite(inkRight)) {
+            return 0;
+        }
+        const overflow = inkRight - advance;
+        return overflow > 0 ? overflow : 0;
+    } catch (_) {
+        return 0;
+    }
+}
 
 export function getCaretCoordinates(element, position) {
     if (!mirrorDiv) {
@@ -84,6 +123,17 @@ export function updateCustomCaret(textarea, caretEl) {
     // Calculate width based on font size to match stroke thickness
     const computed = window.getComputedStyle(textarea);
     const fontSize = parseFloat(computed.fontSize) || 16;
+
+    // Сдвиг каретки вправо складывается из выступа чернил последней буквы (у рукописных/
+    // наклонных шрифтов глиф вылазит за advance width) и межбуквенного интервала текста.
+    // Применяем только в конце строки — в середине следующий символ и так перекрывает выступ.
+    const value = textarea.value || '';
+    const atLineEnd = pos >= value.length || value[pos] === '\n';
+    const lastChar = pos > 0 ? value[pos - 1] : '';
+    const inkOverflow = atLineEnd ? measureGlyphRightOverflow(computed, lastChar) : 0;
+    const letterSpacing = parseFloat(computed.letterSpacing);
+    const spacingGap = Number.isFinite(letterSpacing) ? Math.max(0, letterSpacing) : 0;
+    const caretGap = inkOverflow + spacingGap;
     // Толщина каретки пропорциональна шрифту (≈7% размера). Минимум 1px — при сильном
     // отдалении каретка остаётся видимой и не нарушает пропорцию. Жёсткий пол 2px убран,
     // чтобы при уменьшении масштаба каретка масштабировалась вместе с текстом.
@@ -103,7 +153,7 @@ export function updateCustomCaret(textarea, caretEl) {
     }
 
     caretEl.style.top = `${top - 2}px`;
-    caretEl.style.left = `${left - Math.floor(caretWidth / 2)}px`;
+    caretEl.style.left = `${left - Math.floor(caretWidth / 2) + caretGap}px`;
     caretEl.style.height = `${coords.height}px`;
     caretEl.style.width = `${caretWidth}px`;
     caretEl.style.backgroundColor = caretColor;

package/src/tools/object-tools/selection/TextEditorInteractionController.js

@@ -214,6 +214,7 @@ export function bindTextEditorInteractions(controller, {
     isShape,
     autoSize,
     updateNoteEditor,
+    setNoteBanVisible,
     finalize,
     listType,
 }) {
@@ -327,7 +328,31 @@ export function bindTextEditorInteractions(controller, {
     // уносил текст вправо от фигуры. Поэтому ввод в фигуре границы не меняет.
     let inputHandler;
     if (isNote) {
-        inputHandler = () => { try { if (updateNoteEditor) updateNoteEditor(); } catch (_) {} };
+        // Лимит строк записки: если очередной ввод превышает вместимость (>25 строк или
+        // не влезает по высоте при минимальном шрифте), откатываем значение и показываем
+        // иконку запрета. Иначе пересчитываем подгонку и держим иконку, пока записка полна.
+        let lastGoodValue = textarea.value;
+        let lastGoodSel = textarea.selectionStart || 0;
+        inputHandler = () => {
+            try {
+                const res = updateNoteEditor ? updateNoteEditor() : null;
+                // Откатываем только рост текста, превысивший вместимость. Удаление/замену
+                // на более короткое значение всегда принимаем, иначе из переполненного
+                // состояния нельзя выйти.
+                const growing = textarea.value.length > lastGoodValue.length;
+                if (res && res.fits === false && growing) {
+                    const restorePos = Math.min(lastGoodSel, lastGoodValue.length);
+                    textarea.value = lastGoodValue;
+                    textarea.selectionStart = textarea.selectionEnd = restorePos;
+                    if (updateNoteEditor) updateNoteEditor();
+                    if (setNoteBanVisible) setNoteBanVisible(true);
+                } else {
+                    lastGoodValue = textarea.value;
+                    lastGoodSel = textarea.selectionStart || 0;
+                    if (setNoteBanVisible) setNoteBanVisible(!!(res && res.full));
+                }
+            } catch (_) {}
+        };
     } else if (isShape) {
         inputHandler = () => {};
     } else {

package/src/tools/object-tools/selection/TextEditorSyncService.js

@@ -1,7 +1,18 @@
 import * as PIXI from 'pixi.js';
 import { Events } from '../../../core/events/Events.js';
 import { registerEditorListeners } from './InlineEditorListenersRegistry.js';
-import { computeTextRightPadPx } from '../../../services/text/TextBoxMetrics.js';
+import {
+    computeTextRightPadPx,
+    resolveLineHeightRatio,
+} from '../../../services/text/TextBoxMetrics.js';
+
+// Максимальное число визуальных строк в записке. По достижении лимита ввод
+// блокируется (см. note inputHandler), шрифт до этого сжимается без нижнего предела,
+// чтобы строки помещались по высоте записки.
+export const NOTE_MAX_LINES = 25;
+// Жёсткий пол только чтобы шрифт не стал 0/отрицательным. Ограничения по размеру нет —
+// единственный лимит ввода это NOTE_MAX_LINES.
+const NOTE_MIN_FONT_PX = 1;
 
 // Измеряет ширину текста textarea по реальным глифам через скрытый span.
 // Возвращает ширину самой длинной строки в CSS-px (white-space: pre — без переносов),
@@ -28,6 +39,106 @@ function measureTextareaContentWidth(textarea, value) {
     }
 }
 
+// Высота блока текста (px) при заданном шрифте и ширине, измеренная скрытым div c
+// тем же переносом, что и редактор. Возвращает 0, если layout недоступен (jsdom).
+function measureNoteBlockHeight(text, boxW, fontPx, fontFamily, ratio) {
+    try {
+        if (typeof document === 'undefined' || !document.body) return 0;
+        const m = document.createElement('div');
+        m.style.cssText = 'position:absolute;visibility:hidden;top:-9999px;left:-9999px;padding:0;margin:0;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;';
+        m.style.width = `${boxW}px`;
+        m.style.fontFamily = fontFamily || '';
+        m.style.fontSize = `${fontPx}px`;
+        m.style.lineHeight = `${ratio}`;
+        // \u200b в конце сохраняет высоту хвостового перевода строки при измерении.
+        m.textContent = text && text.length ? `${text}\u200b` : 'W';
+        document.body.appendChild(m);
+        const h = m.getBoundingClientRect().height;
+        m.remove();
+        return Number.isFinite(h) ? h : 0;
+    } catch (_) {
+        return 0;
+    }
+}
+
+// Считает число визуальных строк текста при ЕСТЕСТВЕННОМ размере шрифта (effectiveFontPx),
+// не зависящем от сжатия для отображения. Сжатие меняет fitFont, но не количество строк —
+// поэтому лимит строк должен меряться по неизменному шрифту, иначе блокировка срабатывает
+// преждевременно (при просевшем fitFont деление давало раздутый счёт).
+function countNoteVisualLines(text, boxW, fontPx, fontFamily) {
+    const ratio = resolveLineHeightRatio(fontPx);
+    const oneLine = measureNoteBlockHeight('W', boxW, fontPx, fontFamily, ratio);
+    if (!(oneLine > 0)) return 1;
+    const fullH = measureNoteBlockHeight(text, boxW, fontPx, fontFamily, ratio);
+    return Math.max(1, Math.round(fullH / oneLine));
+}
+
+// Подгоняет inline-редактор записки под её внутренние границы так же, как
+// NoteObject._fitTextToBounds: текст переносится по фиксированной ширине блока (boxW),
+// размер шрифта уменьшается, пока высота контента не влезет в innerH (без нижнего предела).
+// Число строк (для лимита) меряется отдельно по естественному шрифту effectiveFontPx.
+export function applyNoteEditorBox(textarea, backdrop, { boxW, innerH, effectiveFontPx }) {
+    // line-height задаём коэффициентом по текущему размеру (как NoteObject), чтобы
+    // высота строки совпадала с отрисованной запиской.
+    const setWrapStyles = (el, fontPx) => {
+        if (!el) return;
+        el.style.whiteSpace = 'pre-wrap';
+        el.style.wordBreak = 'break-word';
+        el.style.overflowWrap = 'anywhere';
+        el.style.textAlign = 'center';
+        el.style.boxSizing = 'content-box';
+        el.style.padding = '0';
+        el.style.overflow = 'hidden';
+        el.style.fontSize = `${fontPx}px`;
+        el.style.lineHeight = `${resolveLineHeightRatio(fontPx)}`;
+        el.style.width = `${boxW}px`;
+    };
+
+    const fontFamily = (typeof window !== 'undefined' && window.getComputedStyle)
+        ? window.getComputedStyle(textarea).fontFamily
+        : (textarea.style.fontFamily || '');
+    const naturalFont = Math.max(NOTE_MIN_FONT_PX, Math.round(effectiveFontPx));
+    const value = textarea.value || '';
+    const lineCount = countNoteVisualLines(value, boxW, naturalFont, fontFamily);
+
+    // Подбор шрифта детерминированный — высоту блока меряем скрытым div
+    // (measureNoteBlockHeight), а НЕ textarea.scrollHeight. Chromium при быстрых
+    // правках возвращает устаревший (завышенный) scrollHeight даже после смены
+    // font-size, из-за чего цикл уводил шрифт в минимум (1px), а скачок contentH
+    // дёргал каретку. Скрытый div пересоздаётся на каждом замере и стейл-значения
+    // не накапливает. Тот же подход уже применён в createRegularTextAutoSize.
+    let fitFont = naturalFont;
+    let measuredH = measureNoteBlockHeight(value, boxW, fitFont, fontFamily, resolveLineHeightRatio(fitFont));
+    // measuredH === 0 → layout недоступен (jsdom): сжимать нечем, оставляем естественный шрифт.
+    if (measuredH > 0) {
+        for (let safety = 0; safety < 256; safety++) {
+            if (measuredH <= innerH || fitFont <= NOTE_MIN_FONT_PX) break;
+            fitFont = Math.max(NOTE_MIN_FONT_PX, fitFont - 1);
+            measuredH = measureNoteBlockHeight(value, boxW, fitFont, fontFamily, resolveLineHeightRatio(fitFont));
+        }
+    }
+
+    setWrapStyles(textarea, fitFont);
+    textarea.style.minHeight = '0px';
+
+    const naturalH = measuredH > 0
+        ? Math.max(1, Math.ceil(measuredH))
+        : Math.max(1, Math.ceil(textarea.scrollHeight));
+    const contentH = Math.max(1, Math.min(innerH, naturalH));
+
+    textarea.style.height = `${contentH}px`;
+    setWrapStyles(backdrop, fitFont);
+    if (backdrop) {
+        backdrop.style.height = `${contentH}px`;
+    }
+
+    // Единственный лимит — число строк, посчитанное по естественному шрифту.
+    const fits = lineCount <= NOTE_MAX_LINES;
+    const full = lineCount >= NOTE_MAX_LINES;
+
+    return { fitFont, contentH, naturalH, lineCount, fits, full };
+}
+
 export function createRegularTextAutoSize({
     textarea,
     wrapper,
@@ -119,10 +230,10 @@ export function createNoteEditorUpdater(controller, {
     effectiveFontPx,
     toScreen,
 }) {
-    const minNoteEditorWidthPx = 20;
     const minNoteEditorHeightPx = Math.max(1, computeLineHeightPx(effectiveFontPx));
 
     return () => {
+        let result = null;
         try {
             const posDataNow = { objectId, position: null };
             const sizeDataNow = { objectId, size: null };
@@ -131,41 +242,38 @@ export function createNoteEditorUpdater(controller, {
             const posNow = posDataNow.position || position;
             const sizeNow = sizeDataNow.size || { width: noteWidth, height: noteHeight };
             const screenNow = toScreen(posNow.x, posNow.y);
-            const viewRes = (controller.app?.renderer?.resolution) || (view.width && view.clientWidth ? (view.width / view.clientWidth) : 1);
             const worldLayerRef = controller.textEditor.world || (controller.app?.stage);
             const scaleX = worldLayerRef?.scale?.x || 1;
-            const scaleCss = scaleX / viewRes;
-            const maxWpx = Math.max(1, Math.round((sizeNow.width - (horizontalPadding * 2)) * scaleCss));
-            const maxHpx = Math.max(1, Math.round((sizeNow.height - (horizontalPadding * 2)) * scaleCss));
-
-            textarea.style.width = 'auto';
-            textarea.style.height = 'auto';
-            const naturalW = Math.ceil(textarea.scrollWidth + 1);
-            const naturalH = Math.ceil(textarea.scrollHeight);
-            const widthPx = Math.min(maxWpx, Math.max(minNoteEditorWidthPx, naturalW));
-            const heightPx = Math.min(maxHpx, Math.max(minNoteEditorHeightPx, naturalH));
-
-            textarea.style.width = `${widthPx}px`;
-            wrapper.style.width = `${widthPx}px`;
-            textarea.style.height = `${heightPx}px`;
-            wrapper.style.height = `${heightPx}px`;
-
-            // backdrop рисует видимые глифы и имеет фиксированную высоту в px с момента
-            // открытия (applyEditorSizing — одна строка). Без синхронизации с textarea
-            // многострочный ввод (Enter) обрезается снизу (overflow: hidden).
+            // worldScale без /res: screenNow приходит из toScreen→toGlobal (CSS-px, res-независим),
+            // а записка — PIXI (1 мир. ед. = worldScale CSS-px). Деление на res уводило бы редактор
+            // влево и сжимало блок при зуме браузера ≠100% (res≠1). См. NoteInlineEditorController.
+            const scaleCss = scaleX;
+            // Внутренний блок текста = границы записки минус отступы, ограничение
+            // ширины 360 — как в NoteObject._getVisibleTextWidth.
+            const innerWorldW = Math.max(1, Math.min(360, sizeNow.width - (horizontalPadding * 2)));
+            const innerWorldH = Math.max(1, sizeNow.height - (horizontalPadding * 2));
+            const boxW = Math.max(1, Math.round(innerWorldW * scaleCss));
+            const innerH = Math.max(minNoteEditorHeightPx, Math.round(innerWorldH * scaleCss));
+
             const backdrop = wrapper.querySelector('.moodboard-text-backdrop');
-            if (backdrop) {
-                backdrop.style.width = `${widthPx}px`;
-                backdrop.style.height = `${heightPx}px`;
-            }
 
-            const left = Math.round(screenNow.x + (sizeNow.width * scaleCss) / 2 - (widthPx / 2));
-            const top = Math.round(screenNow.y + (sizeNow.height * scaleCss) / 2 - (heightPx / 2));
+            result = applyNoteEditorBox(textarea, backdrop, {
+                boxW,
+                innerH,
+                effectiveFontPx,
+            });
+            const contentH = result.contentH;
+
+            wrapper.style.width = `${boxW}px`;
+            wrapper.style.height = `${contentH}px`;
+
+            // Центрируем блок контента внутри записки по обеим осям (как PIXI-текст).
+            const left = Math.round(screenNow.x + (sizeNow.width * scaleCss) / 2 - (boxW / 2));
+            const top = Math.round(screenNow.y + (sizeNow.height * scaleCss) / 2 - (contentH / 2));
             wrapper.style.left = `${left}px`;
             wrapper.style.top = `${top}px`;
-            textarea.style.width = `${widthPx}px`;
-            textarea.style.height = `${heightPx}px`;
         } catch (_) {}
+        return result;
     };
 }
 

package/src/tools/object-tools/selection/TextInlineEditorController.js

@@ -140,7 +140,10 @@ export function openTextEditor(object, create = false) {
                     const wt = inst.textField.worldTransform;
                     const scaleY = Math.max(0.0001, Math.hypot(wt.c || 0, wt.d || 0));
                     const baseFS = parseFloat(inst.textField.style?.fontSize || fontSize || 14) || (fontSize || 14);
-                    effectiveFontPx = Math.max(1, Math.round(baseFS * (scaleY / viewResEarly)));
+                    // worldTransform.scaleY = worldScale; CSS-размер глифа PIXI-записки = baseFS*worldScale
+                    // (res в трансформ сцены не входит). Деление на viewResEarly делало шрифт редактора
+                    // мельче статического при res≠1 и рассогласовывало перенос строк с записанным текстом.
+                    effectiveFontPx = Math.max(1, Math.round(baseFS * scaleY));
                 }
             } catch (_) {}
         } else if (typeof window !== 'undefined' && window.moodboardHtmlTextLayer) {
@@ -317,6 +320,7 @@ export function openTextEditor(object, create = false) {
 
     // Для записок позиционируем редактор внутри записки
     let updateNoteEditor = null;
+    let setNoteBanVisible = null;
     let regularEditorVisualBox = null;
     if (objectType === 'note') {
         const noteSetup = setupNoteInlineEditor(this, {
@@ -332,6 +336,7 @@ export function openTextEditor(object, create = false) {
             toScreen,
         });
         updateNoteEditor = noteSetup.updateNoteEditor;
+        setNoteBanVisible = noteSetup.setBanVisible;
     } else if (isShape) {
         // Shape: редактор занимает весь bounds фигуры, текст вертикально центрирован
         const viewResShape = (this.app?.renderer?.resolution) ||
@@ -444,8 +449,12 @@ export function openTextEditor(object, create = false) {
     const s = worldLayerRef?.scale?.x || 1;
     const viewRes = (this.app?.renderer?.resolution) || (view.width && view.clientWidth ? (view.width / view.clientWidth) : 1);
     // Синхронизируем стартовый размер шрифта textarea с текущим зумом (как HtmlTextLayer)
-    // Используем ранее вычисленный effectiveFontPx (до вставки в DOM), если он есть в замыкании
-    textarea.style.fontSize = `${effectiveFontPx}px`;
+    // Используем ранее вычисленный effectiveFontPx (до вставки в DOM), если он есть в замыкании.
+    // Для записки шрифт уже подобран autoSizeNote (fit-to-bounds): сброс к effectiveFontPx
+    // рассинхронизировал бы textarea (по нему считается каретка) с backdrop.
+    if (!isNote) {
+        textarea.style.fontSize = `${effectiveFontPx}px`;
+    }
     // Высоту/ширину поля при входе в редактор берём как максимум из видимого DOM-бокса
     // и размера в состоянии объекта. DOM-бокс .mb-text к этому моменту может быть схлопнут
     // до высоты контента (auto), тогда как в состоянии хранится вручную заданная высота рамки —
@@ -528,6 +537,11 @@ export function openTextEditor(object, create = false) {
         autoSize();
     }
     textarea.focus();
+    // Записка: после фокуса повторно подгоняем блок (focus может изменить layout),
+    // чтобы стартовая каретка считалась от уже подобранного размера шрифта, а не от 32px.
+    if (isNote && updateNoteEditor) {
+        try { updateNoteEditor(); } catch (_) {}
+    }
     // Ручки скрыты в режиме input
     // Локальная CSS-настройка placeholder (меньше базового шрифта)
     const styleEl = attachTextEditorPlaceholderStyle(textarea, {
@@ -588,6 +602,7 @@ export function openTextEditor(object, create = false) {
         isShape,
         autoSize,
         updateNoteEditor,
+        setNoteBanVisible,
         finalize,
         listType: properties.listType || 'none',
     });

package/src/ui/animation/HoverLiftController.js

@@ -83,6 +83,7 @@ export class HoverLiftController {
         this._isDragging = false;
         this._isResizing = false;
         this._isRotating = false;
+        this._isConnecting = false;
         /** Set<id> — выделенные объекты (по _mb.objectId) */
         this._selectedIds = new Set();
 
@@ -217,9 +218,20 @@ export class HoverLiftController {
         return world?.scale?.x ?? 1;
     }
 
+    /**
+     * Внешняя блокировка hover на время протягивания коннектора.
+     * Цель коннектора не должна играть scale/lift: иначе её визуальные
+     * границы выходят за рамку подсветки, которая строится по логическим bounds.
+     * @param {boolean} active
+     */
+    setConnecting(active) {
+        this._isConnecting = !!active;
+        if (this._isConnecting) this._snapBackAll();
+    }
+
     /** Можно ли сейчас показывать hover */
     _isBlocked(pixiObject) {
-        if (this._isDragging || this._isResizing || this._isRotating) return true;
+        if (this._isDragging || this._isResizing || this._isRotating || this._isConnecting) return true;
         const id = pixiObject._mb?.objectId;
         if (id && this._selectedIds.has(id)) return true;
         return false;

package/src/ui/styles/workspace.css

@@ -676,6 +676,28 @@
     border-radius: 1px;
 }
 
+/* Иконка запрета ввода при достижении лимита строк записки */
+.moodboard-note-limit-ban {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    width: 48px;
+    height: 48px;
+    align-items: center;
+    justify-content: center;
+    color: #b0b0b0;
+    opacity: 0.9;
+    pointer-events: none;
+    z-index: 10002;
+}
+
+.moodboard-note-limit-ban svg {
+    width: 100%;
+    height: 100%;
+    display: block;
+}
+
 @keyframes mb-caret-blink {
     0%, 100% { opacity: 1; }
     50% { opacity: 0; }