kingkont 0.18.6 → 0.18.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kingkont",
-  "version": "0.18.6",
+  "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/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();

package/renderer/styles.css

@@ -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 {