kingkont 0.18.5 → 0.18.7

package/index.html

@@ -63,8 +63,10 @@
   </div>
   <div class="sidebar-footer">
     <div id="balancesAll" style="display:flex; flex-direction:column; gap:4px;"></div>
-    <span id="jobsInfo" class="jobs-info" style="display:none;"></span>
-    <span class="hint">Перетаскивай файлы на холст · @имя для ссылок</span>
+    <!-- jobsInfo + hint убраны (юзер: «убери инфу 'в фоне' и 'перетаскивай
+         файлы на холст'»). Отступ сохранён через min-height в CSS — UI
+         не должен «прыгнуть» вверх. Активные процессы показываются на
+         кнопке 🔔 (см. notifyPanel.js _renderBellState). -->
   </div>
 </aside>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kingkont",
-  "version": "0.18.5",
+  "version": "0.18.7",
   "description": "KingKont · Chatium — нод-редактор сцен с AI-генерацией (картинки/видео/голос/SFX/музыка/текст)",
   "main": "main.js",
   "bin": {

package/renderer/board.js

@@ -2461,11 +2461,16 @@ async function createNodeEl(node) {
   el.dataset.id = node.id;
   el.style.left = node.x + 'px';
   el.style.top  = node.y + 'px';
-  // Label-ноды всегда auto-размер (по тексту) — фиксированный width/height
-  // создавал «невидимые боксы» вокруг текста, что ломало hit-testing когда
-  // несколько label оказывались рядом (клик попадал в перекрывающий, а не
-  // в видимый текст). Игнорируем сохранённые width/height для label-нод.
-  if (node.type !== 'label') {
+  // Label-ноды: высоту НЕ применяем (auto по контенту), но ширину — ДА,
+  // если юзер явно её задал через label-width-handle. Это позволяет
+  // сделать многострочный label («ширина задаёт перенос»). Без width
+  // → auto-width по тексту (как раньше).
+  if (node.type === 'label') {
+    if (node.width) {
+      el.style.width = node.width + 'px';
+      el.dataset.fixedWidth = '1';   // CSS: разрешаем label-text занять 100%
+    }
+  } else {
     if (node.width)  el.style.width  = node.width + 'px';
     if (node.height) el.style.height = node.height + 'px';
   }
@@ -2514,6 +2519,18 @@ async function createNodeEl(node) {
   el.appendChild(rh);
   attachResize(el, node, rh);
 
+  // Label-ноды получают ВТОРОЙ хендл — на правом краю — для управления
+  // только ШИРИНОЙ (юзер просил: «ноде лейбл позволь менять ширину
+  // отдельно, чтобы менялось количество строк если текст длинный»).
+  // Существующий .resize-handle (правый-нижний угол) меняет fontSize.
+  if (node.type === 'label') {
+    const wh = document.createElement('div');
+    wh.className = 'label-width-handle';
+    wh.title = 'Тяни — ширина (для переноса строк)';
+    el.appendChild(wh);
+    attachLabelWidthResize(el, node, wh);
+  }
+
   const anchor = document.createElement('div');
   anchor.className = 'anchor';
   anchor.title = 'Тяни, чтобы сослаться или сгенерировать ноду со ссылкой';

package/renderer/chat.js

@@ -77,24 +77,63 @@
     },
 
     read_scene: {
-      description: 'Текущая доска: список нод (id, type, name?, prompt?, file?, x, y) и связи.',
+      description: 'Текущая доска: список нод (id, type, name?, prompt?, file?, x, y, width, height) и связи. ВАЖНО: x/y — top-left ноды; width/height — реальные размеры (либо измеренные ResizeObserver\'ом, либо дефолт по типу). Используй при размещении новых нод чтобы не накладывались. Также возвращается scene.bbox (общий rect используемой области) и canvasSize (где можно ставить — типичный canvas 6000×4000).',
       params: '{}',
       async handler() {
         const b = state.currentBoard;
         if (!b) throw new Error('доска не выбрана — используй select_scene');
-        const nodes = (b.metadata.nodes || []).map(n => ({
-          id: n.id,
-          type: n.type,
-          name: n.name || null,
-          x: n.x, y: n.y,
-          prompt: n.generated?.rawPrompt || n.generated?.prompt || null,
-          file: n.file || null,
-          status: n.status || (n.file ? 'done' : 'draft'),
-          modelKey: n.generated?.modelKey || null,
-          aspectRatio: n.generated?.aspectRatio || null,
-        }));
+        // Дефолты width/height по типу — синхронизированы с _defaultH в board.js
+        // и overlap-detection в add_node ниже. Если ResizeObserver уже измерил
+        // ноду — используем кэш n.width/n.height (точнее).
+        function defW(t) { return (t === 'text' || t === 'label' || t === 'audio') ? 200 : 280; }
+        function defH(t) {
+          if (t === 'text') return 120;
+          if (t === 'audio') return 110;
+          if (t === 'image' || t === 'video') return 220;
+          if (t === 'label') return 60;
+          return 80;
+        }
+        const nodes = (b.metadata.nodes || []).map(n => {
+          const w = n.width  || defW(n.type);
+          const h = n.height || defH(n.type);
+          return {
+            id: n.id,
+            type: n.type,
+            name: n.name || null,
+            x: n.x, y: n.y,
+            width: w, height: h,
+            // Удобно для LLM: rect = {left, top, right, bottom} — не надо
+            // считать самому при поиске свободного места.
+            rect: { left: n.x, top: n.y, right: n.x + w, bottom: n.y + h },
+            prompt: n.generated?.rawPrompt || n.generated?.prompt || null,
+            file: n.file || null,
+            status: n.status || (n.file ? 'done' : 'draft'),
+            modelKey: n.generated?.modelKey || null,
+            aspectRatio: n.generated?.aspectRatio || null,
+          };
+        });
         const connections = (b.metadata.connections || []).map(c => ({ from: c.from, to: c.to, toPort: c.toPort || null }));
-        return { kind: b.kind, name: b.name, nodes, connections, settings: b.metadata.settings || {} };
+        // BBox всей сцены — даёт LLM понимание «где плотно, где свободно».
+        let bbox = null;
+        if (nodes.length) {
+          let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+          for (const n of nodes) {
+            if (n.rect.left   < minX) minX = n.rect.left;
+            if (n.rect.top    < minY) minY = n.rect.top;
+            if (n.rect.right  > maxX) maxX = n.rect.right;
+            if (n.rect.bottom > maxY) maxY = n.rect.bottom;
+          }
+          bbox = { left: minX, top: minY, right: maxX, bottom: maxY,
+                   width: maxX - minX, height: maxY - minY };
+        }
+        return {
+          kind: b.kind, name: b.name,
+          nodes, connections,
+          settings: b.metadata.settings || {},
+          bbox,
+          canvasSize: { width: 6000, height: 4000 },
+          hint: 'Размещая новую ноду, проверь чтобы её rect (x, y, x+width, y+height) не пересекался с существующими. Шаг 40-60px между нодами выглядит аккуратно.',
+        };
       },
     },
 
@@ -643,6 +682,17 @@
   // Забираем историю с сервера (server-side state — source of truth).
   // Если на сервере есть pending tool-loop — сразу стартуем polling.
   async function loadHistoryFromCurrentProject() {
+    // Восстанавливаем «был ли чат открыт» в этом проекте. Юзер просил:
+    // «если в проекте был открыт чат — открывай его при переходе в проект».
+    // Делаем ДО загрузки истории — чтобы UI открылся сразу, история подтянется.
+    try {
+      const k = _chatOpenKey();
+      if (k && localStorage.getItem(k) === '1') {
+        ensureUI();
+        $('chatPanel').classList.remove('hidden');
+        // Не зовём _persistChatOpen(true) — флаг и так стоит.
+      }
+    } catch {}
     const key = sessionKey();
     if (!key) { history = []; renderHistory(); return; }
     try {
@@ -1230,14 +1280,16 @@
         // Финальный ответ — показать toast + system notification
         // (даже если чат-панель скрыта).
         if (m.event?.kind === 'final') {
+          // target.chat — navigateToTarget откроет чат-панель вместо доски.
+          const chatTarget = { target: { chat: true } };
           if (m.event.error) {
-            if (typeof showToast === 'function') showToast(`💬 KingKont: ⚠ ${m.event.error.slice(0, 80)}`, 'error');
+            if (typeof showToast === 'function') showToast(`💬 KingKont: ⚠ ${m.event.error.slice(0, 80)}`, 'error', chatTarget);
             if (typeof systemNotify === 'function' && document.hidden) {
               systemNotify('KingKont chat', '⚠ ' + m.event.error.slice(0, 100), { tag: 'chat-final' }).catch(() => {});
             }
           } else if (m.event.text) {
             const preview = m.event.text.length > 100 ? m.event.text.slice(0, 100) + '…' : m.event.text;
-            if (typeof showToast === 'function') showToast(`💬 KingKont: ${preview}`, 'ok');
+            if (typeof showToast === 'function') showToast(`💬 KingKont: ${preview}`, 'ok', chatTarget);
             if (typeof systemNotify === 'function' && document.hidden) {
               systemNotify('KingKont chat', preview, { tag: 'chat-final' }).catch(() => {});
             }
@@ -1570,7 +1622,10 @@
       e.preventDefault();
       for (const f of files) await attachFileToChat(f);
     });
-    $('chatClose').addEventListener('click', () => panel.classList.add('hidden'));
+    $('chatClose').addEventListener('click', () => {
+      panel.classList.add('hidden');
+      _persistChatOpen(false);
+    });
     $('chatClear').addEventListener('click', () => {
       if (!confirm('Очистить историю чата?')) return;
       history = [];
@@ -1591,11 +1646,29 @@
     });
   }
 
+  // Per-project флаг «чат был открыт». При openFilm восстанавливаем
+  // (юзер: «если в проекте был открыт чат — открывай его при переходе в проект»).
+  function _chatOpenKey() {
+    const pk = state.cloudProjectId ? 'cloud:' + state.cloudProjectId
+             : state.filmHandle?.name ? 'folder:' + state.filmHandle.name : null;
+    return pk ? 'chatOpen:' + pk : null;
+  }
+  function _persistChatOpen(open) {
+    const k = _chatOpenKey();
+    if (!k) return;
+    try {
+      if (open) localStorage.setItem(k, '1');
+      else localStorage.removeItem(k);
+    } catch {}
+  }
+
   function toggle() {
     ensureUI();
     const panel = $('chatPanel');
     panel.classList.toggle('hidden');
-    if (!panel.classList.contains('hidden')) {
+    const isOpen = !panel.classList.contains('hidden');
+    _persistChatOpen(isOpen);
+    if (isOpen) {
       // Z-index сам разруливает: preview.collapsed → ниже чата (z=40 vs 45),
       // preview открыт → поверх (z=50). Auto-collapse больше не нужен.
       // Отрисовываем сохранённую историю при показе (на случай если она
@@ -1627,7 +1700,17 @@
   // Public API.
   window.kingChat = {
     toggle,
-    open: () => { ensureUI(); $('chatPanel').classList.remove('hidden'); setTimeout(() => $('chatInput')?.focus(), 50); },
+    open: () => {
+      ensureUI();
+      $('chatPanel').classList.remove('hidden');
+      _persistChatOpen(true);
+      renderHistory();
+      renderContextRow();
+      setTimeout(() => $('chatInput')?.focus(), 50);
+    },
+    // close() — implicit (board.js closeProject) — НЕ persist'им флаг,
+    // иначе при следующем открытии проекта чат не восстановится.
+    // Юзерское × persists через свой handler ниже (chatClose).
     close: () => $('chatPanel')?.classList.add('hidden'),
     send,
     // User-clear: стираем И на сервере (юзер явно нажал ⌫).

package/renderer/notifyPanel.js

@@ -55,21 +55,36 @@
       `;
       document.head.appendChild(style);
     }
-    // Кнопка-колокольчик в нижнем-левом углу — там есть свободное место,
-    // не перекрывает sidebar/canvas-toolbar/welcome-status.
+    // Контейнер: 🔔-кнопка + описание справа. Раньше была только кнопка,
+    // теперь юзер хочет видеть «что происходит в фоне» рядом с ней
+    // (info про активные генерации убрана из sidebar-footer).
+    const wrap = document.createElement('div');
+    wrap.id = 'notifyBtnWrap';
+    wrap.style.cssText = 'position:fixed; bottom:12px; left:12px; z-index:9998; display:flex; align-items:center; gap:8px; pointer-events:none;';
+    document.body.appendChild(wrap);
+
     const btn = document.createElement('button');
     btn.id = 'notifyBtn';
-    btn.title = 'События (генерации, чат, ошибки)';
-    btn.style.cssText = 'position:fixed; bottom:12px; left:12px; z-index:9998; background:rgba(30,30,40,0.85); border:1px solid #444; color:#ccc; font-size:14px; width:32px; height:32px; border-radius:50%; cursor:pointer; backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; transition:background 0.2s;';
-    btn.innerHTML = '🔔';
-    document.body.appendChild(btn);
+    btn.title = 'События (генерации, чат, ошибки) — клик чтобы открыть';
+    btn.style.cssText = 'position:relative; background:rgba(30,30,40,0.85); border:1px solid #444; color:#ccc; font-size:14px; width:32px; height:32px; border-radius:50%; cursor:pointer; backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; transition:background 0.2s; pointer-events:auto; flex-shrink:0;';
+    btn.innerHTML = '<span id="notifyBtnIcon">🔔</span>';
+    wrap.appendChild(btn);
     btn.addEventListener('click', toggle);
-    // Бейдж со счётчиком unread.
+    // Бейдж со счётчиком unread (события, не задачи).
     const badge = document.createElement('span');
     badge.id = 'notifyBadge';
     badge.style.cssText = 'position:absolute; top:-4px; right:-4px; background:#e33377; color:#fff; font-size:9px; min-width:14px; height:14px; line-height:14px; text-align:center; border-radius:8px; padding:0 4px; display:none; pointer-events:none;';
     btn.appendChild(badge);
 
+    // Описание текущей фоновой активности — справа от кнопки.
+    // Показывается когда есть активные jobs; иначе hidden.
+    const desc = document.createElement('div');
+    desc.id = 'notifyActivityDesc';
+    desc.style.cssText = 'background:rgba(30,30,40,0.85); border:1px solid #444; color:#cde; font-size:11px; line-height:1.3; padding:5px 10px; border-radius:14px; backdrop-filter:blur(4px); max-width:380px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:none; pointer-events:auto; cursor:pointer;';
+    desc.title = 'Текущие фоновые задачи (клик — раскрыть события)';
+    desc.addEventListener('click', () => setOpen(true, 'manual'));
+    wrap.appendChild(desc);
+
     // Панель — bottom-left как и кнопка.
     const panel = document.createElement('div');
     panel.id = 'notifyPanel';
@@ -217,6 +232,7 @@
       render();
     }
     _pulseBell();
+    _renderBellState();
     // Авто-открытие панели на 3.5s — юзер видит событие сразу, потом
     // панель прячется. Если юзер сам открыл — не трогаем (проверка в
     // openAuto). Каждое новое событие сбрасывает таймер.
@@ -232,6 +248,91 @@
     void btn.offsetWidth;
     btn.classList.add('pulsing');
   }
+
+  // === Bell-state: счётчик активных задач + описание ===
+  // Юзер: «количество актуальных процессов выводи на месте колокольчика,
+  // справа от него описывай что происходит». Источник — state.jobs (local
+  // pollers) + window.bgJobsAll() (server-side jobs hub). Берём максимум
+  // (server может видеть больше, если renderer недавно открылся).
+  function _renderBellState() {
+    const icon = $('notifyBtnIcon');
+    const desc = $('notifyActivityDesc');
+    if (!icon || !desc) return;
+    // Считаем АКТИВНЫЕ задачи только для ТЕКУЩЕГО проекта (если открыт).
+    // Иначе welcome-экран показал бы все задачи всех проектов — confusing.
+    const items = _collectActiveJobs();
+    if (!items.length) {
+      icon.textContent = '🔔';
+      desc.style.display = 'none';
+      desc.textContent = '';
+      return;
+    }
+    // На месте колокольчика — число.
+    icon.textContent = String(items.length);
+    icon.style.fontSize = items.length > 9 ? '11px' : '12px';
+    icon.style.fontWeight = '700';
+    // Справа — описание. Формат: «🖼 image «name» + N ещё», или, если
+    // одна — полное описание; если несколько типов — kind-counters.
+    desc.textContent = _describeActivity(items);
+    desc.style.display = '';
+  }
+  function _collectActiveJobs() {
+    const out = [];
+    const seen = new Set();
+    // 1) state.jobs (local pollers) — это in-flight для текущего board.
+    if (window.state?.jobs) {
+      for (const [nodeId, j] of window.state.jobs.entries?.() || []) {
+        if (seen.has(nodeId)) continue;
+        seen.add(nodeId);
+        out.push({ nodeId, kind: j.kind || 'gen', name: _resolveNodeName(nodeId) });
+      }
+    }
+    // 2) bgJobsAll (localStorage source) — для текущего проекта.
+    const pk = _currentProjectKey();
+    if (pk && typeof window.bgJobsAll === 'function') {
+      const all = window.bgJobsAll();
+      const list = all[pk] || [];
+      for (const j of list) {
+        if (seen.has(j.nodeId)) continue;
+        seen.add(j.nodeId);
+        out.push({ nodeId: j.nodeId, kind: j.kind || 'gen', name: j.name || null });
+      }
+    }
+    return out;
+  }
+  function _currentProjectKey() {
+    const s = window.state;
+    if (!s) return null;
+    if (s.cloudProjectId) return 'cloud:' + s.cloudProjectId;
+    if (s.filmHandle?.name) return 'folder:' + s.filmHandle.name;
+    return null;
+  }
+  function _resolveNodeName(nodeId) {
+    const nodes = window.state?.currentBoard?.metadata?.nodes;
+    if (!Array.isArray(nodes)) return null;
+    const n = nodes.find(x => x.id === nodeId);
+    return n?.name || null;
+  }
+  function _describeActivity(items) {
+    const KIND_ICON = { image: '🖼', video: '🎬', text: '📝', audio: '🎙', chat: '💬' };
+    if (items.length === 1) {
+      const it = items[0];
+      const ic = KIND_ICON[it.kind] || '⚙';
+      const label = it.name ? `«${it.name}»` : '(без имени)';
+      return `${ic} ${it.kind} ${label}`;
+    }
+    // Группируем по kind для краткой сводки.
+    const counts = {};
+    for (const it of items) counts[it.kind] = (counts[it.kind] || 0) + 1;
+    const parts = Object.entries(counts).map(([k, n]) => {
+      const ic = KIND_ICON[k] || '⚙';
+      return `${ic} ${k}×${n}`;
+    });
+    return parts.join(' · ');
+  }
+  // Public, чтобы generate.js / state.js / etc могли явно ткнуть rerender.
+  window.notifyPanel = window.notifyPanel || {};
+  // (расширим объект публичного API ниже — здесь просто резерв.)
   // Auto-flash: открыть в auto-режиме и закрыть через таймер. Срабатывает
   // на КАЖДОЕ addEvent. Если юзер уже manual'но открыл — открытие no-op'ится.
   let _autoFlashT = null;
@@ -245,10 +346,18 @@
     }, 5000);
   }
 
-  // Navigate from notification to scene/node.
-  // target: {projectKey, boardKey, nodeId?}
+  // Navigate from notification to scene/node — или в чат для chat-event'ов.
+  // target: {projectKey, boardKey, nodeId?} | {chat: true}
   async function navigateToTarget(target) {
-    if (!target?.projectKey) return;
+    if (!target) return;
+    // Чат-нотификация — открыть чат-панель (а не доску). Юзер: «когда
+    // уведомление приходит из чата — клик по уведомлению должен вести в чат».
+    if (target.chat) {
+      setOpen(false);
+      if (window.kingChat?.open) window.kingChat.open();
+      return;
+    }
+    if (!target.projectKey) return;
     setOpen(false);
     const [pkType, pkId] = String(target.projectKey).split(':', 2);
     const currentKey = state.cloudProjectId ? 'cloud:' + state.cloudProjectId
@@ -333,6 +442,15 @@
         q.length = 0;
       }
     } catch {}
+    // Bell-state: первичная отрисовка + подписка на bgjobs:changed.
+    // Этот event кидают bgJobStart/bgJobEnd (state.js) — счётчик и
+    // описание мгновенно обновляются.
+    _renderBellState();
+    window.addEventListener('bgjobs:changed', _renderBellState);
+    // Selection / current-board меняются без event'а — лёгкий poll
+    // даёт мгновенное название ноды («когда state.jobs обновился, но
+    // bgjobs:changed не прилетел»).
+    setInterval(_renderBellState, 1500);
     // WS-канал jobs:all для start/end/done/failed events. Connect к /ws.
     function _connect() {
       let ws;

package/renderer/settings.js

@@ -746,6 +746,48 @@ async function openGenerateForRef(fromNode, clientX, clientY, forceKind) {
   }, 50);
 }
 
+// Width-only resize для label-нод. Юзер тянет хендл на правом краю —
+// устанавливаем node.width, label-text оборачивается. Высота auto.
+// Двойной клик по хендлу — снять width (вернуть auto-width по тексту).
+function attachLabelWidthResize(el, node, handle) {
+  handle.addEventListener('mousedown', e => {
+    e.preventDefault();
+    e.stopPropagation();
+    const startX = e.clientX;
+    const startW = el.offsetWidth;
+    const labelText = el.querySelector('.label-text');
+    const onMove = ev => {
+      const dx = (ev.clientX - startX) / state.zoom;
+      const newW = Math.max(80, Math.min(2000, startW + dx));
+      node.width = Math.round(newW);
+      el.style.width = node.width + 'px';
+      el.dataset.fixedWidth = '1';
+      // Force label-text to fill — иначе inline-block остаётся узким.
+      if (labelText) labelText.style.width = '100%';
+      renderConnections();
+    };
+    const onUp = () => {
+      document.removeEventListener('mousemove', onMove);
+      document.removeEventListener('mouseup', onUp);
+      scheduleSave();
+    };
+    document.addEventListener('mousemove', onMove);
+    document.addEventListener('mouseup', onUp);
+  });
+  // dblclick — сбросить ширину (вернуть auto-size).
+  handle.addEventListener('dblclick', e => {
+    e.preventDefault();
+    e.stopPropagation();
+    delete node.width;
+    el.style.width = '';
+    delete el.dataset.fixedWidth;
+    const labelText = el.querySelector('.label-text');
+    if (labelText) labelText.style.width = '';
+    renderConnections();
+    scheduleSave();
+  });
+}
+
 function attachResize(el, node, handle) {
   handle.addEventListener('mousedown', e => {
     e.preventDefault();
@@ -1062,6 +1104,22 @@ async function deleteNode(node, el) {
     const ok = confirm(`Эта нода используется в таймлайне (${timelineRefs} клип${timelineRefs === 1 ? '' : 'ов'}). Удалить вместе с клипами?`);
     if (!ok) return;
   }
+  // Останавливаем активные генерации для этой ноды (юзер: «если нода
+  // удаляется — останавливай связанные с ней задания»). Иначе server
+  // продолжал бы поллить провайдера, скачивал бы результат и пытался
+  // записать файл к удалённой ноде → битое состояние.
+  // 1) Local poll loop — выйдет на следующей итерации (state.jobs.delete).
+  if (state.jobs?.has(node.id)) {
+    state.jobs.delete(node.id);
+    if (typeof updateJobsBadge === 'function') updateJobsBadge();
+  }
+  // 2) Server-side jobsHub — explicit end, чтобы _startPoller остановился
+  //    сразу, не ждал auto-end через 60s.
+  if (typeof window.bgJobEnd === 'function') {
+    const pk = state.cloudProjectId ? 'cloud:' + state.cloudProjectId
+             : state.filmHandle?.name ? 'folder:' + state.filmHandle.name : null;
+    if (pk) window.bgJobEnd(node.id, pk);
+  }
   // Snapshot ДО мутации — чтобы undo вернул всё как было.
   const snap = captureScene();
   const movedFiles = [];
@@ -1130,6 +1188,15 @@ async function deleteSelectedNodes() {
     if (!confirm(`Удалить ${nodesToDelete.length} нод?`)) return;
   }
 
+  // Останавливаем активные генерации для каждой удаляемой ноды (см. deleteNode).
+  const _pk = state.cloudProjectId ? 'cloud:' + state.cloudProjectId
+            : state.filmHandle?.name ? 'folder:' + state.filmHandle.name : null;
+  for (const n of nodesToDelete) {
+    if (state.jobs?.has(n.id)) state.jobs.delete(n.id);
+    if (_pk && typeof window.bgJobEnd === 'function') window.bgJobEnd(n.id, _pk);
+  }
+  if (typeof updateJobsBadge === 'function') updateJobsBadge();
+
   // Снимок сцены ДО — для undo
   const snapshot = JSON.stringify({
     nodes: board.metadata.nodes,

package/renderer/styles.css

@@ -123,12 +123,12 @@
     border-top: 1px solid #333; padding: 10px 12px;
     display: flex; flex-direction: column; gap: 6px;
     font-size: 11px; color: #777;
+    /* Отступ сохранён даже когда jobsInfo и hint убраны — иначе sidebar
+       «прыгнет» вверх. 56px ≈ высота прежних двух строк + padding. */
+    min-height: 56px;
   }
-  /* «В фоне: N» и hint «Перетаскивай файлы…» — отступаем влево на ширину
-     🔔-кнопки (32px + 12px gap слева от sidebar = 44px), чтобы кнопка
-     событий (position:fixed; left:12px; bottom:12px) их не перекрывала. */
-  .sidebar-footer .hint { color: #777; font-size: 11px; line-height: 1.4; padding-left: 44px; }
-  .sidebar-footer .jobs-info { color: #aaccdd; font-size: 11px; padding-left: 44px; }
+  .sidebar-footer .hint { color: #777; font-size: 11px; line-height: 1.4; }
+  .sidebar-footer .jobs-info { color: #aaccdd; font-size: 11px; }
   .sidebar-footer .balance-info {
     display: flex; align-items: center; gap: 6px; font-size: 11px;
     color: #c4c4c4; padding: 4px 8px; background: #2a2a2a;
@@ -519,6 +519,12 @@
     overflow: hidden;
   }
   .welcome-card-thumb {
+    /* position:absolute + inset:0 — заполняем всю карточку (4:3).
+       БАДЖИ внутри (cloud/bg) тоже absolute → этот thumb работает как
+       positioning context для них. РАНЬШЕ ниже было `.welcome-card-thumb
+       { position: relative; }` — оно переопределяло absolute → thumb
+       shrink'ался до размера контента (символ «+» / «☁» / «🎬») и
+       прибивался к верху карточки. Слились в один rule. */
     position: absolute; inset: 0;
     background: #1a1a1a;
     display: flex; align-items: center; justify-content: center;
@@ -528,7 +534,6 @@
   .welcome-card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
   /* ☁-бейдж в углу обложки облачного проекта. Делает cloud/folder-проекты
      визуально различимыми в общем grid'е (без необходимости второго рядa). */
-  .welcome-card-thumb { position: relative; }
   .welcome-card-cloud-badge {
     position: absolute; right: 6px; bottom: 6px;
     background: rgba(20, 30, 50, 0.85); color: #9cf;
@@ -764,6 +769,32 @@
   }
   .node.label-node:hover .resize-handle,
   .node.label-node:focus-within .resize-handle { opacity: 1; }
+  /* Width-only handle на правом краю — отдельно от font-size handle.
+     Тянуть → меняется ширина label, текст переносится. dblclick →
+     сбросить ширину обратно к auto. */
+  .node.label-node .label-width-handle {
+    position: absolute;
+    right: -3px; top: 50%;
+    transform: translateY(-50%);
+    width: 6px; height: 36px;
+    background: rgba(90,168,255,0.7);
+    border: 1px solid rgba(255,255,255,0.35);
+    border-radius: 3px;
+    cursor: ew-resize;
+    opacity: 0; transition: opacity 0.15s;
+    z-index: 11;
+  }
+  .node.label-node:hover .label-width-handle,
+  .node.label-node:focus-within .label-width-handle { opacity: 1; }
+  /* Когда label имеет explicit width (data-fixed-width="1") — внутренний
+     label-text должен ЗАПОЛНЯТЬ родителя, иначе inline-block остаётся
+     узким и текст не переносится. Сбрасываем min/max-width inner'a. */
+  .node.label-node[data-fixed-width="1"] .label-text {
+    width: 100%;
+    min-width: 0;
+    max-width: none;
+    box-sizing: border-box;
+  }
 
   /* Body — wrapper без визуального вклада. */
   .node.label-node .node-body {