@vibeframe/mcp-server 0.33.0 → 0.35.0

package/dist/index.js

@@ -62,6 +62,7 @@ __export(remotion_exports, {
   ensureRemotionInstalled: () => ensureRemotionInstalled,
   generateAnimatedCaptionComponent: () => generateAnimatedCaptionComponent,
   generateCaptionComponent: () => generateCaptionComponent,
+  generateTextOverlayComponent: () => generateTextOverlayComponent,
   renderAndComposite: () => renderAndComposite,
   renderMotion: () => renderMotion,
   renderWithEmbeddedImage: () => renderWithEmbeddedImage,
@@ -75,15 +76,19 @@ import { writeFile as writeFile4, mkdir as mkdir2, rm, copyFile } from "node:fs/
 import { existsSync } from "node:fs";
 import { join } from "node:path";
 import { tmpdir } from "node:os";
+import { createHash } from "node:crypto";
 async function ensureRemotionInstalled() {
   try {
-    await execSafe("npx", ["remotion", "--help"], { timeout: 3e4 });
+    await execSafe("npx", ["--yes", "remotion", "--help"], { timeout: 6e4 });
     return null;
-  } catch {
+  } catch (error) {
+    const detail = error instanceof Error ? error.message : String(error);
+    console.error(`[Remotion] ensureRemotionInstalled failed: ${detail.slice(0, 300)}`);
     return [
-      "Remotion CLI not found. Install it with:",
-      "  npm install -g @remotion/cli",
-      "Or ensure npx is available and can download @remotion/cli on demand."
+      "Remotion CLI not found or failed to initialize.",
+      `  Debug: ${detail.slice(0, 200)}`,
+      "  Fix: npm install -g @remotion/cli",
+      "  Or ensure npx is available and can download @remotion/cli on demand."
     ].join("\n");
   }
 }
@@ -91,14 +96,14 @@ async function scaffoldRemotionProject(componentCode, componentName, opts) {
   const dir = join(tmpdir(), `vibe_motion_${Date.now()}`);
   await mkdir2(dir, { recursive: true });
   const deps = {
-    remotion: "^4.0.0",
-    "@remotion/cli": "^4.0.0",
+    remotion: REMOTION_VERSION,
+    "@remotion/cli": REMOTION_VERSION,
     react: "^18.0.0",
     "react-dom": "^18.0.0",
     "@types/react": "^18.0.0"
   };
   if (opts.useMediaPackage) {
-    deps["@remotion/media"] = "^4.0.0";
+    deps["@remotion/media"] = REMOTION_VERSION;
   }
   const packageJson = {
     name: "vibe-motion-render",
@@ -106,7 +111,8 @@ async function scaffoldRemotionProject(componentCode, componentName, opts) {
     private: true,
     dependencies: deps
   };
-  await writeFile4(join(dir, "package.json"), JSON.stringify(packageJson, null, 2));
+  const packageJsonStr = JSON.stringify(packageJson, null, 2);
+  await writeFile4(join(dir, "package.json"), packageJsonStr);
   const tsconfig = {
     compilerOptions: {
       target: "ES2020",
@@ -139,16 +145,48 @@ const Root = () => {
 registerRoot(Root);
 `;
   await writeFile4(join(dir, "Root.tsx"), rootCode);
-  if (!existsSync(join(dir, "node_modules"))) {
-    const { execFile: execFile2 } = await import("node:child_process");
-    const { promisify: promisify2 } = await import("node:util");
-    const execFileAsync2 = promisify2(execFile2);
+  const depsHash = createHash("md5").update(packageJsonStr).digest("hex").slice(0, 12);
+  const cacheMarker = join(REMOTION_CACHE_DIR, `.deps-${depsHash}`);
+  const cachedModules = join(REMOTION_CACHE_DIR, "node_modules");
+  if (existsSync(cacheMarker) && existsSync(cachedModules)) {
+    const { symlink } = await import("node:fs/promises");
+    try {
+      await symlink(cachedModules, join(dir, "node_modules"), "dir");
+    } catch {
+      await this_npmInstall(dir);
+    }
+  } else {
+    await this_npmInstall(dir);
+    try {
+      await mkdir2(REMOTION_CACHE_DIR, { recursive: true });
+      await writeFile4(join(REMOTION_CACHE_DIR, "package.json"), packageJsonStr);
+      if (existsSync(join(dir, "node_modules"))) {
+        const { rename: rename3, symlink } = await import("node:fs/promises");
+        await rename3(join(dir, "node_modules"), cachedModules).catch(() => {
+        });
+        await symlink(cachedModules, join(dir, "node_modules"), "dir").catch(() => {
+        });
+        await writeFile4(cacheMarker, depsHash);
+      }
+    } catch {
+    }
+  }
+  return dir;
+}
+async function this_npmInstall(dir) {
+  const { execFile: execFile2 } = await import("node:child_process");
+  const { promisify: promisify2 } = await import("node:util");
+  const execFileAsync2 = promisify2(execFile2);
+  try {
     await execFileAsync2("npm", ["install", "--prefer-offline", "--no-audit", "--no-fund"], {
       cwd: dir,
       timeout: 18e4
     });
+  } catch (error) {
+    const msg = error instanceof Error ? error.stderr || error.message : String(error);
+    console.error(`[Remotion] npm install failed: ${msg.slice(0, 300)}`);
+    throw error;
   }
-  return dir;
 }
 async function renderMotion(options) {
   const transparent = options.transparent !== false;
@@ -220,7 +258,12 @@ async function renderMotion(options) {
     ], { cwd: dir, timeout: 3e5 });
     return { success: true, outputPath: mp4Out };
   } catch (error) {
+    const errObj = error;
+    const stderr = errObj.stderr?.slice(0, 500) || "";
     const msg = error instanceof Error ? error.message : String(error);
+    console.error(`[Remotion] Render failed:
+  ${msg.slice(0, 300)}${stderr ? `
+  stderr: ${stderr}` : ""}`);
     return { success: false, error: `Remotion render failed: ${msg}` };
   } finally {
     await rm(dir, { recursive: true, force: true }).catch(() => {
@@ -403,6 +446,98 @@ async function renderWithEmbeddedVideo(options) {
     });
   }
 }
+function generateTextOverlayComponent(options) {
+  const { texts, style, fontSize, fontColor, startTime, endTime, fadeDuration, width, height, videoFileName } = options;
+  const name = "TextOverlay";
+  const textsJSON = JSON.stringify(texts);
+  const styleMap = {
+    "lower-third": {
+      justify: "flex-end",
+      align: "flex-start",
+      padding: `paddingBottom: ${Math.round(height * 0.12)}, paddingLeft: ${Math.round(width * 0.05)},`,
+      extraCss: `backgroundColor: "rgba(0,0,0,0.5)", padding: "8px 20px", borderRadius: 4,`
+    },
+    "center-bold": {
+      justify: "center",
+      align: "center",
+      padding: "",
+      extraCss: `fontWeight: "bold" as const, textShadow: "3px 3px 6px rgba(0,0,0,0.9)",`
+    },
+    "subtitle": {
+      justify: "flex-end",
+      align: "center",
+      padding: `paddingBottom: ${Math.round(height * 0.08)},`,
+      extraCss: `backgroundColor: "rgba(0,0,0,0.6)", padding: "6px 16px", borderRadius: 4,`
+    },
+    "minimal": {
+      justify: "flex-start",
+      align: "flex-start",
+      padding: `paddingTop: ${Math.round(height * 0.05)}, paddingLeft: ${Math.round(width * 0.05)},`,
+      extraCss: `opacity: 0.85,`
+    }
+  };
+  const s = styleMap[style];
+  const scaledFontSize = style === "center-bold" ? Math.round(fontSize * 1.5) : fontSize;
+  const code = `import { AbsoluteFill, useCurrentFrame, useVideoConfig, interpolate, staticFile } from "remotion";
+import { Video } from "@remotion/media";
+
+const texts: string[] = ${textsJSON};
+const START_TIME = ${startTime};
+const END_TIME = ${endTime};
+const FADE_DURATION = ${fadeDuration};
+
+export const ${name} = () => {
+  const frame = useCurrentFrame();
+  const { fps } = useVideoConfig();
+  const currentTime = frame / fps;
+
+  const visible = currentTime >= START_TIME && currentTime <= END_TIME;
+
+  const opacity = visible
+    ? interpolate(
+        currentTime,
+        [START_TIME, START_TIME + FADE_DURATION, END_TIME - FADE_DURATION, END_TIME],
+        [0, 1, 1, 0],
+        { extrapolateLeft: "clamp", extrapolateRight: "clamp" }
+      )
+    : 0;
+
+  return (
+    <AbsoluteFill>
+      <Video src={staticFile("${videoFileName}")} style={{ width: "100%", height: "100%" }} muted />
+      {visible && (
+        <AbsoluteFill
+          style={{
+            display: "flex",
+            flexDirection: "column",
+            justifyContent: "${s.justify}",
+            alignItems: "${s.align}",
+            ${s.padding}
+            opacity,
+          }}
+        >
+          <div
+            style={{
+              fontSize: ${scaledFontSize},
+              fontFamily: "Arial, Helvetica, sans-serif",
+              color: "${fontColor}",
+              lineHeight: 1.4,
+              maxWidth: "${Math.round(width * 0.9)}px",
+              ${s.extraCss}
+            }}
+          >
+            {texts.map((text, i) => (
+              <div key={i}>{text}</div>
+            ))}
+          </div>
+        </AbsoluteFill>
+      )}
+    </AbsoluteFill>
+  );
+};
+`;
+  return { code, name };
+}
 function generateCaptionComponent(options) {
   const { segments, style, fontSize, fontColor, position, width, videoFileName } = options;
   const name = videoFileName ? "VideoCaptioned" : "CaptionOverlay";
@@ -762,10 +897,13 @@ async function renderAndComposite(motionOpts, baseVideo, finalOutput) {
   });
   return compositeResult;
 }
+var REMOTION_VERSION, REMOTION_CACHE_DIR;
 var init_remotion = __esm({
   "../cli/src/utils/remotion.ts"() {
     "use strict";
     init_exec_safe();
+    REMOTION_VERSION = "4.0.447";
+    REMOTION_CACHE_DIR = join(tmpdir(), "vibe_remotion_cache");
   }
 });
 
@@ -1556,6 +1694,16 @@ async function resolveProjectPath(inputPath) {
   }
   return filePath;
 }
+async function getMediaDuration(filePath, mediaType, defaultImageDuration = 5) {
+  if (mediaType === "image") {
+    return defaultImageDuration;
+  }
+  try {
+    return await ffprobeDuration(filePath);
+  } catch {
+    return defaultImageDuration;
+  }
+}
 async function checkHasAudio(filePath) {
   try {
     const { stdout } = await execSafe("ffprobe", [
@@ -1600,11 +1748,19 @@ async function runExport(projectPath, outputPath, options = {}) {
     const clips = project.getClips().sort((a, b) => a.startTime - b.startTime);
     const sources = project.getSources();
     const sourceAudioMap = /* @__PURE__ */ new Map();
+    const sourceActualDurationMap = /* @__PURE__ */ new Map();
     for (const clip of clips) {
       const source = sources.find((s) => s.id === clip.sourceId);
       if (source) {
         try {
           await access(source.url);
+          if (!sourceActualDurationMap.has(source.id)) {
+            try {
+              const dur = await getMediaDuration(source.url, source.type);
+              if (dur > 0) sourceActualDurationMap.set(source.id, dur);
+            } catch {
+            }
+          }
           if (source.type === "video" && !sourceAudioMap.has(source.id)) {
             sourceAudioMap.set(source.id, await checkHasAudio(source.url));
           }
@@ -1616,7 +1772,7 @@ async function runExport(projectPath, outputPath, options = {}) {
         }
       }
     }
-    const ffmpegArgs = buildFFmpegArgs(clips, sources, presetSettings, finalOutputPath, { overwrite, format, gapFill }, sourceAudioMap);
+    const ffmpegArgs = buildFFmpegArgs(clips, sources, presetSettings, finalOutputPath, { overwrite, format, gapFill }, sourceAudioMap, sourceActualDurationMap);
     await runFFmpegProcess(ffmpegPath, ffmpegArgs, () => {
     });
     return {
@@ -1687,11 +1843,19 @@ No API keys needed. Requires FFmpeg.`).action(async (projectPath, options) => {
     const sources = project.getSources();
     spinner.text = "Verifying source files...";
     const sourceAudioMap = /* @__PURE__ */ new Map();
+    const sourceActualDurationMap = /* @__PURE__ */ new Map();
     for (const clip of clips) {
       const source = sources.find((s) => s.id === clip.sourceId);
       if (source) {
         try {
           await access(source.url);
+          if (!sourceActualDurationMap.has(source.id)) {
+            try {
+              const dur = await getMediaDuration(source.url, source.type);
+              if (dur > 0) sourceActualDurationMap.set(source.id, dur);
+            } catch {
+            }
+          }
           if (source.type === "video" && !sourceAudioMap.has(source.id)) {
             sourceAudioMap.set(source.id, await checkHasAudio(source.url));
           }
@@ -1703,7 +1867,7 @@ No API keys needed. Requires FFmpeg.`).action(async (projectPath, options) => {
     }
     spinner.text = "Building export command...";
     const gapFillStrategy = options.gapFill === "black" ? "black" : "extend";
-    const ffmpegArgs = buildFFmpegArgs(clips, sources, presetSettings, outputPath, { ...options, gapFill: gapFillStrategy }, sourceAudioMap);
+    const ffmpegArgs = buildFFmpegArgs(clips, sources, presetSettings, outputPath, { ...options, gapFill: gapFillStrategy }, sourceAudioMap, sourceActualDurationMap);
     if (process.env.DEBUG) {
       console.log("\nFFmpeg command:");
       console.log("ffmpeg", ffmpegArgs.join(" "));
@@ -1827,7 +1991,7 @@ function createGapFillPlans(gaps, clips, sources) {
     return { gap, fills };
   });
 }
-function buildFFmpegArgs(clips, sources, presetSettings, outputPath, options, sourceAudioMap = /* @__PURE__ */ new Map()) {
+function buildFFmpegArgs(clips, sources, presetSettings, outputPath, options, sourceAudioMap = /* @__PURE__ */ new Map(), sourceActualDurationMap = /* @__PURE__ */ new Map()) {
   const args = [];
   if (options.overwrite) {
     args.push("-y");
@@ -1912,6 +2076,12 @@ function buildFFmpegArgs(clips, sources, presetSettings, outputPath, options, so
         const trimStart = clip.sourceStartOffset;
         const trimEnd = clip.sourceStartOffset + clip.duration;
         videoFilter = `[${srcIdx}:v]trim=start=${trimStart}:end=${trimEnd},setpts=PTS-STARTPTS`;
+        const sourceDuration = sourceActualDurationMap.get(source.id) || source.duration || 0;
+        const availableDuration = sourceDuration - clip.sourceStartOffset;
+        if (availableDuration > 0 && availableDuration < clip.duration - 0.1) {
+          const padDuration = clip.duration - availableDuration;
+          videoFilter += `,tpad=stop_mode=clone:stop_duration=${padDuration.toFixed(3)}`;
+        }
       }
       videoFilter += `,scale=${targetWidth}:${targetHeight}:force_original_aspect_ratio=decrease,pad=${targetWidth}:${targetHeight}:(ow-iw)/2:(oh-ih)/2,setsar=1`;
       for (const effect of clip.effects || []) {
@@ -2704,11 +2874,14 @@ IMPORTANT GUIDELINES:
    - ALWAYS include the character description when the person appears
 
 3. NARRATION LENGTH (CRITICAL for audio-video sync):
-   - Each scene narration MUST be 12-25 words (fits within 5-10 seconds of speech)
-   - NEVER exceed 30 words per scene narration \u2014 long content MUST be split into multiple scenes
-   - Set duration to 5 for short narrations (12-18 words) or 10 for longer ones (19-25 words)
+   - Average TTS speaking rate is ~2.5 words/second
+   - For duration=5: narration MUST be 10-12 words (4-5 seconds of speech)
+   - For duration=10: narration MUST be 20-24 words (8-10 seconds of speech)
+   - NEVER exceed the word limit \u2014 count every word before finalizing
+   - ALWAYS leave 0.5-1s buffer (narration should be slightly shorter than video)
    - If the script has a long paragraph, break it into 2-3 shorter scenes rather than one long narration
    - This prevents freeze frames where video stops but narration continues
+   - VALIDATION: After writing each narration, count the words. If over limit, shorten it.
 
 4. NARRATION-VISUAL ALIGNMENT: The narration must directly describe what's visible:
    - When narration mentions something specific, the visual must show it
@@ -6618,7 +6791,7 @@ var openaiImageProvider = new OpenAIImageProvider();
 
 // ../ai-providers/dist/runway/RunwayProvider.js
 var DEFAULT_MODEL2 = "gen4.5";
-var RunwayProvider = class {
+var RunwayProvider = class _RunwayProvider {
   constructor() {
     this.id = "runway";
     this.name = "Runway";
@@ -6683,12 +6856,12 @@ var RunwayProvider = class {
       if (options?.seed !== void 0) {
         body.seed = options.seed;
       }
-      const response = await fetch(`${this.baseUrl}/${endpoint}`, {
+      const response = await this.fetchWithRetry(`${this.baseUrl}/${endpoint}`, {
         method: "POST",
         headers: {
           Authorization: `Bearer ${this.apiKey}`,
           "Content-Type": "application/json",
-          "X-Runway-Version": "2024-11-06"
+          "X-Runway-Version": _RunwayProvider.API_VERSION
         },
         body: JSON.stringify(body)
       });
@@ -6701,6 +6874,9 @@ var RunwayProvider = class {
         } catch {
           errorMessage = errorText;
         }
+        console.error(`[Runway] POST /${endpoint} -> ${response.status} ${response.statusText}
+  Model: ${model}, Ratio: ${apiRatio}, Duration: ${body.duration}
+  Response: ${errorText.slice(0, 500)}`);
         return {
           id: "",
           status: "failed",
@@ -6749,7 +6925,7 @@ var RunwayProvider = class {
       const response = await fetch(`${this.baseUrl}/tasks/${id}`, {
         headers: {
           Authorization: `Bearer ${this.apiKey}`,
-          "X-Runway-Version": "2024-11-06"
+          "X-Runway-Version": _RunwayProvider.API_VERSION
         }
       });
       if (!response.ok) {
@@ -6801,7 +6977,7 @@ var RunwayProvider = class {
         method: "POST",
         headers: {
           Authorization: `Bearer ${this.apiKey}`,
-          "X-Runway-Version": "2024-11-06"
+          "X-Runway-Version": _RunwayProvider.API_VERSION
         }
       });
       return response.ok;
@@ -6821,7 +6997,7 @@ var RunwayProvider = class {
         method: "DELETE",
         headers: {
           Authorization: `Bearer ${this.apiKey}`,
-          "X-Runway-Version": "2024-11-06"
+          "X-Runway-Version": _RunwayProvider.API_VERSION
         }
       });
       return response.ok;
@@ -6850,6 +7026,24 @@ var RunwayProvider = class {
       error: "Generation timed out"
     };
   }
+  /**
+   * Fetch with retry for transient errors (429, 503)
+   */
+  async fetchWithRetry(url, init) {
+    let lastResponse;
+    for (let attempt = 0; attempt < _RunwayProvider.MAX_RETRIES; attempt++) {
+      const response = await fetch(url, init);
+      if (response.status !== 429 && response.status !== 503) {
+        return response;
+      }
+      lastResponse = response;
+      const retryAfter = response.headers.get("Retry-After");
+      const delayMs = retryAfter ? parseInt(retryAfter, 10) * 1e3 : 2 ** (attempt + 1) * 1e3;
+      console.error(`[Runway] ${response.status} \u2014 retrying in ${delayMs / 1e3}s (attempt ${attempt + 1}/${_RunwayProvider.MAX_RETRIES})`);
+      await this.sleep(delayMs);
+    }
+    return lastResponse;
+  }
   /**
    * Clamp duration to valid range for the given model
    */
@@ -6876,6 +7070,8 @@ var RunwayProvider = class {
     return new Promise((resolve13) => setTimeout(resolve13, ms));
   }
 };
+RunwayProvider.API_VERSION = "2024-11-06";
+RunwayProvider.MAX_RETRIES = 3;
 var runwayProvider = new RunwayProvider();
 
 // ../ai-providers/dist/kling/KlingProvider.js
@@ -9383,9 +9579,17 @@ async function applyTextOverlays(options) {
   if (!commandExists("ffmpeg")) {
     return { success: false, error: "FFmpeg not found. Please install FFmpeg." };
   }
+  let hasDrawtext = true;
   try {
     const { stdout } = await execSafe("ffmpeg", ["-filters"]);
-    if (!stdout.includes("drawtext")) {
+    hasDrawtext = stdout.includes("drawtext");
+  } catch {
+  }
+  if (!hasDrawtext) {
+    console.log("FFmpeg missing drawtext filter (libfreetype) \u2014 using Remotion fallback...");
+    const { generateTextOverlayComponent: generateTextOverlayComponent2, renderWithEmbeddedVideo: renderWithEmbeddedVideo2, ensureRemotionInstalled: ensureRemotionInstalled2 } = await Promise.resolve().then(() => (init_remotion(), remotion_exports));
+    const remotionErr = await ensureRemotionInstalled2();
+    if (remotionErr) {
       const platform = process.platform;
       let hint = "";
       if (platform === "darwin") {
@@ -9395,10 +9599,41 @@ async function applyTextOverlays(options) {
       }
       return {
         success: false,
-        error: `FFmpeg 'drawtext' filter not available. Your FFmpeg was built without libfreetype.${hint}`
-      };
-    }
-  } catch {
+        error: `FFmpeg 'drawtext' filter not available and Remotion fallback unavailable.
+${remotionErr}${hint}`
+      };
+    }
+    const { width: width2, height: height2 } = await getVideoResolution(absVideoPath);
+    const videoDuration2 = await getVideoDuration(absVideoPath);
+    const baseFontSize2 = customFontSize || Math.round(height2 / 20);
+    const endTime2 = options.endTime ?? videoDuration2;
+    const fps = 30;
+    const durationInFrames = Math.ceil(videoDuration2 * fps);
+    const videoFileName = "source_video.mp4";
+    const { code, name } = generateTextOverlayComponent2({
+      texts,
+      style,
+      fontSize: baseFontSize2,
+      fontColor,
+      startTime,
+      endTime: endTime2,
+      fadeDuration,
+      width: width2,
+      height: height2,
+      videoFileName
+    });
+    const renderResult = await renderWithEmbeddedVideo2({
+      componentCode: code,
+      componentName: name,
+      width: width2,
+      height: height2,
+      fps,
+      durationInFrames,
+      videoPath: absVideoPath,
+      videoFileName,
+      outputPath: absOutputPath
+    });
+    return renderResult.success ? { success: true, outputPath: renderResult.outputPath || absOutputPath } : { success: false, error: renderResult.error || "Remotion render failed" };
   }
   const { width, height } = await getVideoResolution(absVideoPath);
   const baseFontSize = customFontSize || Math.round(height / 20);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vibeframe/mcp-server",
-  "version": "0.33.0",
+  "version": "0.35.0",
   "description": "VibeFrame MCP Server - AI-native video editing via Model Context Protocol",
   "type": "module",
   "bin": {
@@ -57,8 +57,8 @@
     "tsx": "^4.21.0",
     "typescript": "^5.3.3",
     "vitest": "^1.2.2",
-    "@vibeframe/cli": "0.33.0",
-    "@vibeframe/core": "0.33.0"
+    "@vibeframe/core": "0.35.0",
+    "@vibeframe/cli": "0.35.0"
   },
   "engines": {
     "node": ">=20"