vargai 0.4.0-alpha111 → 0.4.0-alpha113

package/package.json

@@ -107,7 +107,7 @@
   "license": "Apache-2.0",
   "author": "varg.ai <hello@varg.ai> (https://varg.ai)",
   "sideEffects": false,
-  "version": "0.4.0-alpha111",
+  "version": "0.4.0-alpha113",
   "exports": {
     ".": "./src/index.ts",
     "./ai": "./src/ai-sdk/index.ts",

package/src/ai-sdk/file.ts

@@ -59,7 +59,7 @@ export class File {
   }
 
   static fromUrl(url: string, mediaType?: string): File {
-    return new File({ url, mediaType });
+    return new File(mediaType != null ? { url, mediaType } : { url });
   }
 
   /** Hydrate a File from the render service response shape */
@@ -86,7 +86,7 @@ export class File {
     return new File({
       data: generated.uint8Array,
       mediaType: generated.mediaType,
-      url: generated.url,
+      ...(generated.url != null && { url: generated.url }),
     });
   }
 

package/src/ai-sdk/generate-element.ts

@@ -77,9 +77,9 @@ export async function generateElement(
     model,
     prompt: images ? { text, images } : text,
     n,
-    size,
-    aspectRatio,
-    seed,
+    ...(size != null && { size }),
+    ...(aspectRatio != null && { aspectRatio }),
+    ...(seed != null && { seed }),
   });
 
   return {

package/src/ai-sdk/generate-music.ts

@@ -32,8 +32,8 @@ export async function generateMusic(
     prompt,
     duration,
     providerOptions: providerOptions ?? {},
-    abortSignal,
-    headers,
+    ...(abortSignal != null && { abortSignal }),
+    ...(headers != null && { headers }),
   });
 
   return {

package/src/ai-sdk/generate-video.ts

@@ -151,8 +151,8 @@ export async function generateVideo(
     seed,
     files,
     providerOptions,
-    abortSignal,
-    headers,
+    ...(abortSignal != null && { abortSignal }),
+    ...(headers != null && { headers }),
   });
 
   const videos = result.videos.map((v) => new DefaultGeneratedVideo(v));

package/src/ai-sdk/providers/editly/backends/local.ts

@@ -35,10 +35,10 @@ export class LocalBackend implements FFmpegBackend {
 
     return {
       duration,
-      width: videoStream?.width,
-      height: videoStream?.height,
-      fps,
-      framerateStr,
+      ...(videoStream?.width != null ? { width: videoStream.width } : {}),
+      ...(videoStream?.height != null ? { height: videoStream.height } : {}),
+      ...(fps != null ? { fps } : {}),
+      ...(framerateStr != null ? { framerateStr } : {}),
     };
   }
 

package/src/ai-sdk/providers/editly/index.ts

@@ -64,7 +64,11 @@ async function getFirstVideoInfo(
     for (const layer of clip.layers) {
       if (layer.type === "video") {
         const info = await backend.ffprobe((layer as VideoLayer).path);
-        return { width: info.width, height: info.height, fps: info.fps };
+        return {
+          ...(info.width != null ? { width: info.width } : {}),
+          ...(info.height != null ? { height: info.height } : {}),
+          ...(info.fps != null ? { fps: info.fps } : {}),
+        };
       }
     }
   }
@@ -280,7 +284,9 @@ function buildBaseClipFilter(
           videoSources.push({
             inputIndex: inputIdx,
             cutFrom: videoLayer.cutFrom ?? 0,
-            mixVolume: videoLayer.mixVolume,
+            ...(videoLayer.mixVolume != null
+              ? { mixVolume: videoLayer.mixVolume }
+              : {}),
           });
         }
         inputIdx++;
@@ -793,10 +799,10 @@ export async function editly(config: EditlyConfig): Promise<EditlyResult> {
         startTime: currentClipTime,
         duration: clip.duration,
         cutFrom,
-        mixVolume,
-        fadeInDuration: fadeInDuration > 0 ? fadeInDuration : undefined,
+        ...(mixVolume != null ? { mixVolume } : {}),
+        ...(fadeInDuration > 0 ? { fadeInDuration } : {}),
         fadeInCurve,
-        fadeOutDuration: fadeOutDuration > 0 ? fadeOutDuration : undefined,
+        ...(fadeOutDuration > 0 ? { fadeOutDuration } : {}),
         fadeOutCurve,
       });
     }
@@ -1067,7 +1073,7 @@ export async function editly(config: EditlyConfig): Promise<EditlyResult> {
     filterComplex,
     outputArgs,
     outputPath: outPath,
-    verbose,
+    ...(verbose != null ? { verbose } : {}),
   });
 
   if (result.output.type === "file" && verbose) {

package/src/ai-sdk/providers/editly/layers.ts

@@ -129,14 +129,15 @@ export function getVideoFilter(
     filters.push("setsar=1");
     filters.push("fps=30");
     filters.push("settb=1/30");
+    const overlayDuration = layer.cutTo
+      ? layer.cutTo - (layer.cutFrom ?? 0)
+      : undefined;
     return {
       inputs: [
         {
           label: inputLabel,
           path: layer.path,
-          duration: layer.cutTo
-            ? layer.cutTo - (layer.cutFrom ?? 0)
-            : undefined,
+          ...(overlayDuration != null ? { duration: overlayDuration } : {}),
         },
       ],
       filterComplex: `[${inputLabel}]${filters.join(",")}[${outputLabel}]`,
@@ -154,14 +155,17 @@ export function getVideoFilter(
       `[${fgLabel}]scale=${width}:${height}:force_original_aspect_ratio=decrease,setsar=1[${fgLabel}fg]`,
       `[${blurLabel}bg][${fgLabel}fg]overlay=(W-w)/2:(H-h)/2,fps=30,settb=1/30[${outputLabel}]`,
     ].join(";");
+    const containBlurDuration = layer.cutTo
+      ? layer.cutTo - (layer.cutFrom ?? 0)
+      : undefined;
     return {
       inputs: [
         {
           label: inputLabel,
           path: layer.path,
-          duration: layer.cutTo
-            ? layer.cutTo - (layer.cutFrom ?? 0)
-            : undefined,
+          ...(containBlurDuration != null
+            ? { duration: containBlurDuration }
+            : {}),
         },
       ],
       filterComplex,
@@ -186,12 +190,15 @@ export function getVideoFilter(
   filters.push("fps=30");
   filters.push("settb=1/30");
 
+  const fullDuration = layer.cutTo
+    ? layer.cutTo - (layer.cutFrom ?? 0)
+    : undefined;
   return {
     inputs: [
       {
         label: inputLabel,
         path: layer.path,
-        duration: layer.cutTo ? layer.cutTo - (layer.cutFrom ?? 0) : undefined,
+        ...(fullDuration != null ? { duration: fullDuration } : {}),
       },
     ],
     filterComplex: `[${inputLabel}]${filters.join(",")}[${outputLabel}]`,

package/src/ai-sdk/providers/editly/rendi/index.ts

@@ -104,9 +104,9 @@ export class RendiBackend implements FFmpegBackend {
         }
         return {
           duration: output.duration ?? 0,
-          width: output.width,
-          height: output.height,
-          fps: output.frame_rate,
+          ...(output.width != null ? { width: output.width } : {}),
+          ...(output.height != null ? { height: output.height } : {}),
+          ...(output.frame_rate != null ? { fps: output.frame_rate } : {}),
         };
       }
 

package/src/ai-sdk/providers/elevenlabs.ts

@@ -89,7 +89,9 @@ class ElevenLabsMusicModel implements MusicModelV3 {
     const elevenLabsOptions = providerOptions?.elevenlabs ?? {};
     const audio = await this.client.music.compose({
       prompt,
-      musicLengthMs: duration ? Math.round(duration * 1000) : undefined,
+      ...(duration != null
+        ? { musicLengthMs: Math.round(duration * 1000) }
+        : {}),
       modelId: this.modelId,
       ...elevenLabsOptions,
     } as Parameters<typeof this.client.music.compose>[0]);
@@ -230,9 +232,8 @@ class ElevenLabsSpeechModel implements SpeechModelV3 {
       response: {
         timestamp: new Date(),
         modelId: this.modelId,
-        headers: undefined,
       },
-      providerMetadata,
+      ...(providerMetadata != null ? { providerMetadata } : {}),
     };
   }
 }
@@ -318,7 +319,9 @@ export async function generateMusic(
 
   const audio = await client.music.compose({
     prompt,
-    musicLengthMs: durationSeconds ? durationSeconds * 1000 : undefined,
+    ...(durationSeconds != null
+      ? { musicLengthMs: durationSeconds * 1000 }
+      : {}),
     modelId: "music_v1",
   });
 

package/src/ai-sdk/providers/fal.ts

@@ -90,7 +90,7 @@ function createFalCache(name: string): CacheStorage {
 
 const pendingStorage = createFalCache("fal-pending");
 
-const DEFAULT_TIMEOUT_MS = 10 * 60 * 1000;
+const DEFAULT_TIMEOUT_MS = 30 * 60 * 1000;
 const FAL_TIMEOUT_MS = (() => {
   if (!process.env.FAL_TIMEOUT_MS) return DEFAULT_TIMEOUT_MS;
   const parsed = Number.parseInt(process.env.FAL_TIMEOUT_MS, 10);
@@ -438,7 +438,7 @@ async function executeWithQueueRecovery<T>(
           requestId: pending.request_id,
           logs,
           timeout: FAL_TIMEOUT_MS,
-          onQueueUpdate,
+          ...(onQueueUpdate != null ? { onQueueUpdate } : {}),
         });
         const result = await fal.queue.result(pending.endpoint, {
           requestId: pending.request_id,
@@ -490,7 +490,7 @@ async function executeWithQueueRecovery<T>(
       requestId: request_id,
       logs,
       timeout: FAL_TIMEOUT_MS,
-      onQueueUpdate,
+      ...(onQueueUpdate != null ? { onQueueUpdate } : {}),
     });
 
     const result = await fal.queue.result(endpoint, {
@@ -872,7 +872,7 @@ class FalVideoModel implements VideoModelV3 {
     const result = await executeWithQueueRecovery<{ data: unknown }>(
       endpoint,
       input,
-      { logs: true, stableKey },
+      { logs: true, ...(stableKey != null ? { stableKey } : {}) },
     );
 
     const data = result.data as { video?: { url?: string } };
@@ -882,7 +882,9 @@ class FalVideoModel implements VideoModelV3 {
       throw new Error("No video URL in fal response");
     }
 
-    const videoResponse = await fetch(videoUrl, { signal: abortSignal });
+    const videoResponse = await fetch(videoUrl, {
+      ...(abortSignal != null ? { signal: abortSignal } : {}),
+    });
     const videoBuffer = await videoResponse.arrayBuffer();
 
     return {
@@ -1101,7 +1103,7 @@ class FalImageModel implements ImageModelV3 {
     const result = await executeWithQueueRecovery<{ data: unknown }>(
       finalEndpoint,
       input,
-      { logs: true, stableKey },
+      { logs: true, ...(stableKey != null ? { stableKey } : {}) },
     );
 
     const data = result.data as {
@@ -1118,7 +1120,9 @@ class FalImageModel implements ImageModelV3 {
     const imageBuffers = await Promise.all(
       images.map(async (img) => {
         if (!img.url) throw new Error("Image URL is missing");
-        const response = await fetch(img.url, { signal: abortSignal });
+        const response = await fetch(img.url, {
+          ...(abortSignal != null ? { signal: abortSignal } : {}),
+        });
         return new Uint8Array(await response.arrayBuffer());
       }),
     );
@@ -1200,7 +1204,6 @@ class FalTranscriptionModel implements TranscriptionModelV3 {
       response: {
         timestamp: new Date(),
         modelId: this.modelId,
-        headers: undefined,
       },
     };
   }

package/src/ai-sdk/providers/google.ts

@@ -209,7 +209,9 @@ class GoogleVideoModel implements VideoModelV3 {
       options.polling?.pollIntervalMs ?? DEFAULT_POLL_INTERVAL_MS;
     this.maxPollDurationMs =
       options.polling?.maxPollDurationMs ?? DEFAULT_MAX_POLL_DURATION_MS;
-    this.onProgress = options.polling?.onProgress;
+    if (options.polling?.onProgress != null) {
+      this.onProgress = options.polling.onProgress;
+    }
   }
 
   async doGenerate(options: VideoModelV3CallOptions) {
@@ -269,7 +271,9 @@ class GoogleVideoModel implements VideoModelV3 {
             mimeType: imageFile.mediaType ?? "image/png",
           };
         } else {
-          const response = await fetch(imageFile.url, { signal: abortSignal });
+          const response = await fetch(imageFile.url, {
+            ...(abortSignal != null ? { signal: abortSignal } : {}),
+          });
           if (!response.ok) {
             throw new Error(
               `Failed to fetch image from ${imageFile.url}: ${response.status} ${response.statusText}`,
@@ -286,7 +290,7 @@ class GoogleVideoModel implements VideoModelV3 {
     let operation = await this.client.models.generateVideos({
       model,
       prompt,
-      image,
+      ...(image != null ? { image } : {}),
       config,
     });
 
@@ -336,7 +340,9 @@ class GoogleVideoModel implements VideoModelV3 {
 
       const videoUrl = `${videoUri}&key=${this.apiKey}`;
 
-      const response = await fetch(videoUrl, { signal: abortSignal });
+      const response = await fetch(videoUrl, {
+        ...(abortSignal != null ? { signal: abortSignal } : {}),
+      });
       if (!response.ok) {
         throw new Error(`Failed to download video: ${response.statusText}`);
       }
@@ -400,10 +406,15 @@ export function createGoogle(
   return {
     specificationVersion: "v3",
     imageModel(modelId: string): GoogleImageModel {
-      return new GoogleImageModel(modelId, { apiKey });
+      return new GoogleImageModel(modelId, {
+        ...(apiKey != null ? { apiKey } : {}),
+      });
     },
     videoModel(modelId: string): GoogleVideoModel {
-      return new GoogleVideoModel(modelId, { apiKey, polling });
+      return new GoogleVideoModel(modelId, {
+        ...(apiKey != null ? { apiKey } : {}),
+        ...(polling != null ? { polling } : {}),
+      });
     },
     languageModel(modelId: string): LanguageModelV3 {
       throw new NoSuchModelError({

package/src/ai-sdk/providers/heygen.ts

@@ -161,7 +161,7 @@ async function pollVideoStatus(
           "X-Api-Key": apiKey,
           Accept: "application/json",
         },
-        signal,
+        ...(signal != null ? { signal } : {}),
       },
     );
 
@@ -331,7 +331,7 @@ class HeyGenVideoModel implements VideoModelV3 {
         Accept: "application/json",
       },
       body: submitBody,
-      signal: abortSignal,
+      ...(abortSignal != null ? { signal: abortSignal } : {}),
     });
 
     if (!submitRes.ok) {
@@ -353,7 +353,7 @@ class HeyGenVideoModel implements VideoModelV3 {
 
     // ---- Download video ----
     const videoRes = await fetch(statusData.video_url!, {
-      signal: abortSignal,
+      ...(abortSignal != null ? { signal: abortSignal } : {}),
     });
     if (!videoRes.ok) {
       throw new Error(`Failed to download HeyGen video (${videoRes.status})`);

package/src/ai-sdk/providers/higgsfield.ts

@@ -163,9 +163,11 @@ class HiggsfieldImageModel implements ImageModelV3 {
     this.apiSecret = options.apiSecret ?? process.env.HIGGSFIELD_SECRET ?? "";
     this.baseURL = options.baseURL ?? "https://platform.higgsfield.ai";
     this.modelSettings = {
-      styleId: options.styleId,
-      quality: options.quality,
-      enhancePrompt: options.enhancePrompt,
+      ...(options.styleId != null ? { styleId: options.styleId } : {}),
+      ...(options.quality != null ? { quality: options.quality } : {}),
+      ...(options.enhancePrompt != null
+        ? { enhancePrompt: options.enhancePrompt }
+        : {}),
     };
   }
 
@@ -225,7 +227,7 @@ class HiggsfieldImageModel implements ImageModelV3 {
         Accept: "application/json",
       },
       body: JSON.stringify(requestBody),
-      signal: abortSignal,
+      ...(abortSignal != null ? { signal: abortSignal } : {}),
     });
 
     if (!response.ok) {
@@ -246,7 +248,9 @@ class HiggsfieldImageModel implements ImageModelV3 {
     const imageUrl = await this.pollForResult(jobId, abortSignal);
 
     // Download image
-    const imageResponse = await fetch(imageUrl, { signal: abortSignal });
+    const imageResponse = await fetch(imageUrl, {
+      ...(abortSignal != null ? { signal: abortSignal } : {}),
+    });
     const imageBuffer = new Uint8Array(await imageResponse.arrayBuffer());
 
     return {
@@ -275,7 +279,7 @@ class HiggsfieldImageModel implements ImageModelV3 {
           "hf-secret": this.apiSecret,
           Accept: "application/json",
         },
-        signal: abortSignal,
+        ...(abortSignal != null ? { signal: abortSignal } : {}),
       });
 
       if (!response.ok) {
@@ -365,9 +369,11 @@ export function createHiggsfield(
       modelSettings?: HiggsfieldImageModelSettings,
     ): ImageModelV3 {
       return new HiggsfieldImageModel(modelId, {
-        apiKey: settings.apiKey,
-        apiSecret: settings.apiSecret,
-        baseURL: settings.baseURL,
+        ...(settings.apiKey != null ? { apiKey: settings.apiKey } : {}),
+        ...(settings.apiSecret != null
+          ? { apiSecret: settings.apiSecret }
+          : {}),
+        ...(settings.baseURL != null ? { baseURL: settings.baseURL } : {}),
         ...settings.defaultModelSettings,
         ...modelSettings,
       });

package/src/ai-sdk/providers/openai.ts

@@ -93,7 +93,9 @@ class OpenAIVideoModel implements VideoModelV3 {
               : imageFile.data;
           blob = new Blob([data], { type: imageFile.mediaType });
         } else {
-          const response = await fetch(imageFile.url, { signal: abortSignal });
+          const response = await fetch(imageFile.url, {
+            ...(abortSignal != null ? { signal: abortSignal } : {}),
+          });
           blob = await response.blob();
         }
         formData.append("input_reference", blob, "input.png");
@@ -147,7 +149,7 @@ class OpenAIVideoModel implements VideoModelV3 {
         Authorization: `Bearer ${this.apiKey}`,
       },
       body: formData,
-      signal: abortSignal,
+      ...(abortSignal != null ? { signal: abortSignal } : {}),
     });
 
     if (!createResponse.ok) {
@@ -172,7 +174,7 @@ class OpenAIVideoModel implements VideoModelV3 {
         headers: {
           Authorization: `Bearer ${this.apiKey}`,
         },
-        signal: abortSignal,
+        ...(abortSignal != null ? { signal: abortSignal } : {}),
       });
 
       if (!statusResponse.ok) {
@@ -199,7 +201,7 @@ class OpenAIVideoModel implements VideoModelV3 {
         headers: {
           Authorization: `Bearer ${this.apiKey}`,
         },
-        signal: abortSignal,
+        ...(abortSignal != null ? { signal: abortSignal } : {}),
       },
     );
 
@@ -241,8 +243,8 @@ export function createOpenAI(
   // add videoModel method
   provider.videoModel = (modelId: VideoModelId): VideoModelV3 =>
     new OpenAIVideoModel(modelId, {
-      apiKey: settings.apiKey,
-      baseURL: settings.baseURL,
+      ...(settings.apiKey != null ? { apiKey: settings.apiKey } : {}),
+      ...(settings.baseURL != null ? { baseURL: settings.baseURL } : {}),
     });
 
   return provider;

package/src/ai-sdk/providers/together.ts

@@ -106,7 +106,7 @@ class TogetherImageModel implements ImageModelV3 {
         "Content-Type": "application/json",
       },
       body: JSON.stringify(body),
-      signal: abortSignal,
+      ...(abortSignal != null ? { signal: abortSignal } : {}),
     });
 
     if (!response.ok) {
@@ -138,7 +138,9 @@ class TogetherImageModel implements ImageModelV3 {
         }
         if (img.url) {
           // URL response - download
-          const imgResponse = await fetch(img.url, { signal: abortSignal });
+          const imgResponse = await fetch(img.url, {
+            ...(abortSignal != null ? { signal: abortSignal } : {}),
+          });
           return new Uint8Array(await imgResponse.arrayBuffer());
         }
         throw new Error("Image has neither url nor b64_json");

package/src/ai-sdk/providers/varg.ts

@@ -101,7 +101,7 @@ async function pollJob(
   baseUrl: string,
   apiKey: string,
   jobId: string,
-  maxAttempts = 450,
+  maxAttempts = 900,
   intervalMs = 2000,
 ) {
   for (let i = 0; i < maxAttempts; i++) {

package/src/react/resolve.ts

@@ -904,100 +904,34 @@ async function resolveSourceUrl(
   throw new Error("cannot resolve source URL from input");
 }
 
-/** Get the varg gateway client settings. */
-function getGatewayConfig(): { apiKey: string; baseUrl: string } | null {
-  const apiKey = process.env.VARG_API_KEY;
-  if (!apiKey) return null;
-  return {
-    apiKey,
-    baseUrl: process.env.VARG_API_URL ?? "https://api.varg.ai",
-  };
-}
-
-/** Call gateway and wait for job completion. */
-async function gatewayJobRequest(
-  path: string,
-  body: Record<string, unknown>,
-): Promise<Record<string, unknown>> {
-  const config = getGatewayConfig();
-  if (!config) throw new Error("VARG_API_KEY not set");
-
-  const submitRes = await fetch(`${config.baseUrl}/v1${path}`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      Authorization: `Bearer ${config.apiKey}`,
-    },
-    body: JSON.stringify(body),
-    signal: AbortSignal.timeout(30_000),
-  });
-  if (!submitRes.ok) {
-    const text = await submitRes.text().catch(() => "");
-    throw new Error(`gateway ${path} failed: ${submitRes.status} ${text}`);
-  }
-  const job = (await submitRes.json()) as {
-    job_id: string;
-    status: string;
-    output?: Record<string, unknown>;
-  };
-
-  if (job.status === "completed" && job.output) return job;
-
-  const maxAttempts = 300;
-  for (let i = 0; i < maxAttempts; i++) {
-    await new Promise((r) => setTimeout(r, 2_000));
-    const pollRes = await fetch(`${config.baseUrl}/v1/jobs/${job.job_id}`, {
-      headers: { Authorization: `Bearer ${config.apiKey}` },
-      signal: AbortSignal.timeout(15_000),
-    });
-    if (!pollRes.ok) continue;
-    const result = (await pollRes.json()) as {
-      status: string;
-      output?: Record<string, unknown>;
-      error?: string;
-    };
-    if (result.status === "completed") return result;
-    if (result.status === "failed")
-      throw new Error(`gateway job failed: ${result.error ?? "unknown"}`);
-  }
-  throw new Error("gateway job timed out");
-}
-
 /**
- * Resolve a Slice element -- splits video into segments.
- * Returns a ResolvedElement with `.segments` populated (same pattern as Speech).
+ * Resolve a Slice element -- splits video into segments via gateway.
+ * Requires `gateway` prop (e.g., varg) for authenticated API access.
  */
 export async function resolveSliceElement(
   element: VargElement<"slice">,
   props: import("./types").SliceProps,
 ): Promise<ResolvedElement<"slice">> {
+  if (!props.gateway) {
+    throw new Error(
+      "await Slice() requires 'gateway' prop (e.g., Slice({ gateway: varg, src: video, every: 5 }))",
+    );
+  }
+
   const srcUrl = await resolveSourceUrl(props.src);
 
-  const body: Record<string, unknown> = {
+  const result = await props.gateway.slice({
     video_url: srcUrl,
     codec: props.codec ?? "copy",
-  };
-  if (props.every !== undefined) body.every = props.every;
-  if (props.at !== undefined) body.at = props.at;
-  if (props.count !== undefined) body.count = props.count;
-  if (props.ranges !== undefined) body.ranges = props.ranges;
-
-  const result = await gatewayJobRequest("/ffmpeg/slice", body);
-  const output = result.output as
-    | { url?: string; metadata?: Record<string, unknown> }
-    | undefined;
-  const metadata = output?.metadata as
-    | {
-        segments?: Array<{ url: string; index: number; filename: string }>;
-        total_segments?: number;
-      }
-    | undefined;
-
-  const segmentData = metadata?.segments ?? [];
+    every: props.every,
+    at: props.at,
+    count: props.count,
+    ranges: props.ranges,
+  });
 
   const segments: import("./types").SliceSegment[] = [];
   let cursor = 0;
-  for (const seg of segmentData) {
+  for (const seg of result.segments) {
     const segFile = File.fromUrl(seg.url);
     const segDuration = await probeDuration(segFile);
     const segElement = new ResolvedElement(
@@ -1015,8 +949,8 @@ export async function resolveSliceElement(
     cursor += segDuration;
   }
 
-  const firstFile = segmentData[0]
-    ? File.fromUrl(segmentData[0].url)
+  const firstFile = result.segments[0]
+    ? File.fromUrl(result.segments[0].url)
     : File.fromBuffer(new Uint8Array(0), "video/mp4");
 
   return new ResolvedElement(element, {
@@ -1028,11 +962,18 @@ export async function resolveSliceElement(
 
 /**
  * Resolve an FFmpeg element -- runs arbitrary FFmpeg command via gateway.
+ * Requires `gateway` prop (e.g., varg) for authenticated API access.
  */
 export async function resolveFFmpegElement(
   element: VargElement<"ffmpeg">,
   props: import("./types").FFmpegProps,
 ): Promise<ResolvedElement<"ffmpeg">> {
+  if (!props.gateway) {
+    throw new Error(
+      "await FFmpeg() requires 'gateway' prop (e.g., FFmpeg({ gateway: varg, command: '...' }))",
+    );
+  }
+
   const inputFiles: Record<string, string> = {};
   if (props.src) {
     inputFiles.in_1 = await resolveSourceUrl(props.src);
@@ -1049,64 +990,39 @@ export async function resolveFFmpegElement(
   }
 
   const outputFiles = command.includes("OUTPUT_FOLDER")
-    ? "OUTPUT_FOLDER"
+    ? ("OUTPUT_FOLDER" as const)
     : { out_1: "output.mp4" };
 
-  const result = await gatewayJobRequest("/ffmpeg", {
+  const result = await props.gateway.ffmpeg({
     command,
     input_files: inputFiles,
     output_files: outputFiles,
   });
 
-  const output = result.output as
-    | { url?: string; media_type?: string }
-    | undefined;
-  const url = output?.url ?? "";
-  const file = url
-    ? File.fromUrl(url)
+  const file = result.url
+    ? File.fromUrl(result.url)
     : File.fromBuffer(new Uint8Array(0), "video/mp4");
-  const duration = url ? await probeDuration(file) : 0;
+  const duration = result.url ? await probeDuration(file) : 0;
 
   return new ResolvedElement(element, { file, duration });
 }
 
 /**
  * Resolve a Probe element -- gets media metadata via gateway.
+ * Requires `gateway` prop (e.g., varg) for authenticated API access.
  */
 export async function resolveProbeElement(
   element: VargElement<"probe">,
   props: import("./types").ProbeProps,
 ): Promise<ResolvedElement<"probe">> {
-  const srcUrl = await resolveSourceUrl(props.src);
-
-  const config = getGatewayConfig();
-  if (!config) throw new Error("VARG_API_KEY not set");
-
-  const res = await fetch(`${config.baseUrl}/v1/ffmpeg/probe`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      Authorization: `Bearer ${config.apiKey}`,
-    },
-    body: JSON.stringify({ url: srcUrl }),
-    signal: AbortSignal.timeout(30_000),
-  });
-  if (!res.ok) {
-    const text = await res.text().catch(() => "");
-    throw new Error(`probe failed: ${res.status} ${text}`);
+  if (!props.gateway) {
+    throw new Error(
+      "await Probe() requires 'gateway' prop (e.g., Probe({ gateway: varg, src: video }))",
+    );
   }
 
-  const probeData = (await res.json()) as {
-    duration?: number;
-    width?: number;
-    height?: number;
-    codec?: string;
-    audio_codec?: string;
-    format?: string;
-    bitrate?: number;
-    fps?: number;
-    size_bytes?: number;
-  };
+  const srcUrl = await resolveSourceUrl(props.src);
+  const probeData = await props.gateway.probe({ url: srcUrl });
 
   const file = File.fromUrl(srcUrl);
 

package/src/react/types.ts

@@ -4,10 +4,10 @@ import type {
   SpeechModelV3,
   TranscriptionModelV3,
 } from "@ai-sdk/provider";
-import type { FFmpegBackend } from "@/ai-sdk/providers/editly/backends";
 import type { CacheStorage } from "../ai-sdk/cache";
 import type { File } from "../ai-sdk/file";
 import type { MusicModelV3 } from "../ai-sdk/music-model";
+import type { FFmpegBackend } from "../ai-sdk/providers/editly/backends";
 import type {
   CropPosition,
   Position,
@@ -406,6 +406,43 @@ export interface RenderResult {
 
 // ── FFmpeg processing element props ──────────────────────────────────
 
+/** Minimal gateway interface for FFmpeg utility methods. Implemented by VargProvider. */
+export interface FFmpegGateway {
+  slice(params: {
+    video_url: string;
+    codec?: "copy" | "reencode";
+    every?: number;
+    at?: number[];
+    count?: number;
+    ranges?: Array<{ start: number; end: number }>;
+  }): Promise<{
+    url: string;
+    segments: Array<{ url: string; index: number; filename: string }>;
+    jobId: string;
+  }>;
+  probe(params: { url: string }): Promise<{
+    duration?: number;
+    width?: number;
+    height?: number;
+    codec?: string;
+    audio_codec?: string;
+    format?: string;
+    bitrate?: number;
+    fps?: number;
+    size_bytes?: number;
+  }>;
+  ffmpeg(params: {
+    command: string;
+    input_files?: Record<string, string>;
+    output_files?: Record<string, string> | string;
+  }): Promise<{
+    url: string;
+    mediaType: string;
+    jobId: string;
+    metadata?: Record<string, unknown>;
+  }>;
+}
+
 export interface SliceProps {
   /** Source video: URL string, File object, or ResolvedElement */
   src: string | File | VargElement;
@@ -419,6 +456,8 @@ export interface SliceProps {
   count?: number;
   /** Split at explicit time ranges */
   ranges?: Array<{ start: number; end: number }>;
+  /** Authenticated gateway provider (e.g., varg). Required for cloud rendering. */
+  gateway?: FFmpegGateway;
 }
 
 export interface FFmpegProps {
@@ -428,11 +467,15 @@ export interface FFmpegProps {
   inputs?: Record<string, string | File | VargElement>;
   /** FFmpeg command flags (without -i input, which is added automatically for src) */
   command: string;
+  /** Authenticated gateway provider (e.g., varg). Required for cloud rendering. */
+  gateway?: FFmpegGateway;
 }
 
 export interface ProbeProps {
   /** Source to probe: URL string, File object, or ResolvedElement */
   src: string | File | VargElement;
+  /** Authenticated gateway provider (e.g., varg). Required for cloud rendering. */
+  gateway?: FFmpegGateway;
 }
 
 /**