@kolbo/mcp 1.31.5 → 1.31.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolbo/mcp",
-  "version": "1.31.5",
+  "version": "1.31.6",
   "description": "Kolbo AI MCP Server - Generate images, videos, music, speech, and sound effects from Claude Code",
   "main": "src/index.js",
   "bin": {

package/src/apps/bridge.js

@@ -94,12 +94,18 @@ const BRIDGE_JS = `
     readyFns.forEach(function (f) { try { f(hostContext); } catch (e) {} });
   }).catch(function () { /* host without apps support — widget stays static */ });
 
+  var fsMode = false; // fullscreen: the HOST owns layout — size reports there
+                      // made the inline iframe balloon over the chat composer.
   function notifySize() {
+    if (fsMode) return;
     // Measure the widget card itself — documentElement.scrollHeight over-reports
     // in some hosts and leaves a huge empty iframe below the card.
     var card = document.querySelector('.k-card');
     var rect = card ? card.getBoundingClientRect() : null;
     var height = rect ? Math.ceil(rect.bottom + 8) : document.documentElement.scrollHeight;
+    // Never ask the host for more than a viewport of inline height — a card
+    // taller than the screen overlaps Claude's prompt area.
+    height = Math.min(height, Math.max(window.innerHeight || 900, 500));
     notify('ui/notifications/size-changed', {
       width: document.documentElement.scrollWidth, height: height
     });
@@ -151,6 +157,12 @@ const BRIDGE_JS = `
       return request('ui/request-display-mode', { mode: mode });
     },
     notifySize: notifySize,
+    // Toggle fullscreen mode: suppresses size reports while the host owns the
+    // layout, and re-syncs the inline size on exit.
+    setFullscreen: function (on) {
+      fsMode = !!on;
+      if (!on) queueSize(60);
+    },
     hostContext: function () { return hostContext; }
   };
 })();

package/src/apps/theme.js

@@ -175,7 +175,8 @@ body {
    header + prompt + chips + viewer + thumbs + actions + footer must all fit,
    or claude.ai adds an inner scrollbar. Click the image to expand in-Claude. */
 .k-viewer { margin-bottom: 10px; }
-.k-viewer img, .k-viewer video { display: block; width: 100%; max-height: 340px; object-fit: contain;
+.k-viewer img, .k-viewer video { display: block; width: 100%;
+  max-height: min(340px, 55vh); object-fit: contain;
   border-radius: 12px; background: #000; border: 1px solid var(--border); cursor: zoom-in; }
 .k-viewer video { cursor: default; }
 
@@ -185,7 +186,10 @@ html.k-fullscreen .k-card { height: 100%; display: flex; flex-direction: column;
 html.k-fullscreen .k-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
 html.k-fullscreen .k-viewer { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; }
 html.k-fullscreen .k-viewer img, html.k-fullscreen .k-viewer video {
-  max-height: 100%; max-width: 100%; width: auto; margin: 0 auto; cursor: zoom-out; }
+  /* hard viewport cap — the image must NEVER exceed the screen or cover the
+     host's chrome, whatever the host's iframe sizing does */
+  max-height: min(100%, calc(100dvh - 130px)); max-width: 100%;
+  width: auto; margin: 0 auto; cursor: zoom-out; object-fit: contain; }
 html.k-fullscreen .k-thumbs .k-thumb { width: 64px; height: 64px; }
 .k-expand-hint { display: none; }
 .k-thumbs { display: flex; gap: 6px; margin: 10px 0 2px; }

package/src/apps/widgets/generation.js

@@ -258,23 +258,43 @@ function wireDlButtons(root) {
   });
 }
 
+// CD scenes render as the SAME viewer+thumbnail carousel as image batches —
+// a stacked column of full-size scenes buried the card (and the chat).
+function sceneItems(sc) {
+  var items = [];
+  (sc.scenes || []).forEach(function (scene) {
+    var label = 'Scene ' + scene.scene_number + (scene.title ? ' — ' + scene.title : '');
+    (scene.image_urls || []).forEach(function (u) { items.push({ url: u, type: 'image', label: label }); });
+    (scene.video_urls || []).forEach(function (u) { items.push({ url: u, type: 'video', label: label }); });
+  });
+  return items;
+}
+
 function renderScenes(sc) {
-  el('stage').innerHTML = sc.scenes.map(function (scene) {
-    var media = (scene.video_urls || []).map(function (u) {
-      return '<div class="k-media"><video src="' + esc(u) + '" controls playsinline></video>' + dlBtnHTML(u) + '</div>';
-    }).join('') + (scene.image_urls || []).map(function (u) {
-      return '<div class="k-media" data-focus="' + esc(u) + '"><img src="' + esc(u) + '" alt="">' + dlBtnHTML(u) + '</div>';
-    }).join('');
-    return '<div style="margin-bottom:14px"><div style="font-size:12px;font-weight:600;color:var(--text-muted);margin-bottom:8px">Scene ' +
-      esc(scene.scene_number) + (scene.title ? ' — ' + esc(scene.title) : '') + '</div>' +
-      '<div class="k-gen-grid n2">' + media + '</div></div>';
-  }).join('');
+  var items = sceneItems(sc);
+  if (!items.length) return renderError('No completed scenes received');
+  selected = Math.min(selected, items.length - 1);
+  var it = items[selected];
+  var mediaHtml = it.type === 'video'
+    ? '<video id="scene-main" src="' + esc(it.url) + '" controls playsinline></video>'
+    : '<img id="scene-main" src="' + esc(it.url) + '" alt="" style="cursor:zoom-in">';
+  var thumbs = '<div class="k-thumbs">' + items.map(function (t, i) {
+    var inner = t.type === 'video'
+      ? '<span style="display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:rgba(255,255,255,0.06);font-size:14px">▶</span>'
+      : '<img src="' + esc(t.url) + '" alt="" loading="lazy">';
+    return '<div class="k-thumb' + (i === selected ? ' active' : '') + '" data-i="' + i + '" title="' + esc(t.label) + '">' + inner + '</div>';
+  }).join('') + '</div>';
+  el('stage').innerHTML =
+    '<div class="k-viewer">' + mediaHtml + dlBtnHTML(it.url) + '</div>' +
+    '<div style="font-size:11px;color:var(--text-faint);margin:2px 2px 0">' + esc(it.label) + '</div>' +
+    thumbs;
   wireDlButtons(el('stage'));
-  // Click a scene image → fullscreen focus on THAT image (videos keep their
-  // native controls; clicking them shouldn't hijack playback).
-  Array.prototype.forEach.call(el('stage').querySelectorAll('.k-media[data-focus]'), function (m) {
-    m.style.cursor = 'zoom-in';
-    m.onclick = function () { focusMedia(m.getAttribute('data-focus')); };
+  if (it.type === 'image') {
+    var main = el('scene-main');
+    if (main) main.onclick = function () { focusMedia(it.url); };
+  }
+  Array.prototype.forEach.call(el('stage').querySelectorAll('.k-thumb'), function (t) {
+    t.onclick = function () { selected = +t.getAttribute('data-i'); renderScenes(sc); window.kolbo.notifySize(); };
   });
   renderActions(sc);
 }
@@ -331,6 +351,7 @@ function toggleFullscreen() {
 }
 function applyFullscreen(on, exitHandler) {
   document.documentElement.classList.toggle('k-fullscreen', on);
+  if (window.kolbo.setFullscreen) window.kolbo.setFullscreen(on);
   var c = el('phase-chip');
   if (on) {
     c.style.display = '';