@kolbo/mcp 1.30.10 → 1.31.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolbo/mcp",
-  "version": "1.30.10",
+  "version": "1.31.0",
   "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

@@ -141,6 +141,10 @@ const BRIDGE_JS = `
     updateModelContext: function (text) {
       return request('ui/update-model-context', { content: [{ type: 'text', text: text }] });
     },
+    // Resolves with the mode the host ACTUALLY granted ('inline'|'fullscreen'|'pip').
+    requestDisplayMode: function (mode) {
+      return request('ui/request-display-mode', { mode: mode });
+    },
     notifySize: notifySize,
     hostContext: function () { return hostContext; }
   };

package/src/apps/theme.js

@@ -161,11 +161,21 @@ body {
 
 /* Keep the whole completed card under the host's iframe height cap (~800px):
    header + prompt + chips + viewer + thumbs + actions + footer must all fit,
-   or claude.ai adds an inner scrollbar. Click the image to open it full-size. */
+   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;
   border-radius: 12px; background: #000; border: 1px solid var(--border); cursor: zoom-in; }
 .k-viewer video { cursor: default; }
+
+/* ---- Fullscreen (ui/request-display-mode granted) ---- */
+html.k-fullscreen, html.k-fullscreen body { height: 100%; }
+html.k-fullscreen .k-card { height: 100%; display: flex; flex-direction: column; border-radius: 0; }
+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; }
+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; }
 .k-thumbs .k-thumb { width: 48px; height: 48px; border-radius: 8px; overflow: hidden; cursor: pointer;
   border: 2px solid transparent; opacity: 0.75; transition: all 150ms var(--smooth); flex: none; }

package/src/apps/widgets/generation.js

@@ -173,10 +173,12 @@ function renderImages(sc, urls) {
   // instead of a broken empty viewer.
   var viewer = '<div class="k-viewer"><img id="main-img" src="' + esc(urls[selected]) + '" alt="" onerror="window.__imgFail && window.__imgFail()"></div>';
   window.__imgFail = function () { renderLinks(urls); window.kolbo.notifySize(); };
-  // Constrained viewer → click opens the original full-size.
+  // Click → expand into an in-Claude fullscreen viewer (all actions stay
+  // available); click again (or Exit) collapses back. Hosts that refuse
+  // fullscreen fall back to opening the original in a new tab.
   setTimeout(function () {
     var img = el('main-img');
-    if (img) img.onclick = function () { window.kolbo.openLink(state.urls[selected]); };
+    if (img) img.onclick = toggleFullscreen;
   }, 0);
   var thumbs = '';
   if (urls.length > 1) {
@@ -262,6 +264,38 @@ function renderError(msg) {
   window.kolbo.notifySize();
 }
 
+/* ---------- fullscreen viewer ---------- */
+var isFullscreen = false;
+function toggleFullscreen() {
+  var want = isFullscreen ? 'inline' : 'fullscreen';
+  window.kolbo.requestDisplayMode(want).then(function (res) {
+    var granted = res && res.mode;
+    if (granted === 'fullscreen') { isFullscreen = true; applyFullscreen(true); }
+    else if (granted === 'inline' || isFullscreen) { isFullscreen = false; applyFullscreen(false); }
+    else if (!isFullscreen) {
+      // Host refused fullscreen — degrade to opening the original file.
+      window.kolbo.openLink(state.urls && state.urls[selected]);
+    }
+  }).catch(function () {
+    if (!isFullscreen) window.kolbo.openLink(state.urls && state.urls[selected]);
+  });
+}
+function applyFullscreen(on) {
+  document.documentElement.classList.toggle('k-fullscreen', on);
+  var c = el('phase-chip');
+  if (on) {
+    c.style.display = '';
+    c.innerHTML = '✕ ' + esc('Exit');
+    c.style.cursor = 'pointer';
+    c.onclick = toggleFullscreen;
+  } else {
+    c.style.display = 'none';
+    c.onclick = null;
+    c.style.cursor = '';
+  }
+  window.kolbo.notifySize();
+}
+
 function setPhaseChip(text, spinning) {
   var c = el('phase-chip');
   if (!text) { c.style.display = 'none'; return; }