Oma Video

# oma-video skill configuration.
# Mirrors cli/commands/video/config/video-config.yaml (the CLI is the source of
# truth; keep these in sync). Precedence at runtime: this config -> env vars ->
# CLI flags (lowest to highest).
default_output_dir: .agents/results/videos
default_mode: shorts
default_aspect: auto
default_locale: en
default_captions: tiktok
default_visual: auto
default_voice: none
default_music: none
default_compositor: remotion
default_timeout_sec: 600

providers:
  script:
    order: [agent-script]
  voice:
    order: [oma-voice]
  visual:
    order: [oma-image, pexels, pixelle]
  caption:
    order: [oma-captions]
  capture:
    order: [cap]
  compositor:
    order: [remotion, mpt]
  # Paid providers — auto-enabled only when their env key is present (backend
  # rule 11: real path gated on key, key-free fallback otherwise).
  pexels:
    enabled: false
    envVar: PEXELS_API_KEY
  pixelle:
    enabled: false
    envVar: RUNNINGHUB_API_KEY

cost:
  guardrail_usd: 0.20

limits:
  max_duration_sec: 180
  max_scenes: 40

naming:
  single_folder_pattern: "{timestamp}-{shortid}-{mode}"

#!/usr/bin/env python3
# pyright: reportMissingImports=false
# The `app.*` imports below are MoneyPrinterTurbo's modules. MPT is never
# vendored into this repo; this driver only ever runs under the MPT checkout's
# own venv (`<MPT>/.venv/bin/python`), where `app` is importable. The repo's
# Python analyzer cannot see them, so this third-party-runtime directive is
# expected — it is not a suppression of any first-party issue.
"""Headless MoneyPrinterTurbo (MPT) driver — boundary-safe subprocess entrypoint.

oma-video never imports MPT. The TypeScript compositor (`internal/mpt-project.ts`
+ `providers/compositor.ts`) spawns *this* script with the MPT venv's python and
a single JSON argument describing the run. The driver loads MPT in-process here
(inside MPT's own venv, never inside oma's runtime) and drives the full pipeline
via `app.services.task.start(...)`, then copies the produced mp4 to the caller's
output path.

Key-free by construction (design 013 §5, backend rule 11):
  * video_script is injected directly -> MPT's custom-script mode, NO LLM key.
  * voice defaults to an edge-tts voice -> NO TTS key.
  * subtitle_provider="edge" (MPT config) reuses the edge sub_maker -> no
    faster-whisper model download.
  * video_source defaults to "local": the driver synthesizes a few ffmpeg
    test-pattern clips into MPT's storage/local_videos so composition needs NO
    Pexels key. video_source="pexels" is used only when a key is provided.

Contract — stdin/argv is one JSON object, stdout's LAST line is one JSON result:
  IN  {
        "mpt_dir":     "<abs path to MPT repo>",      # required
        "script":      "<narration text, one line per scene>",  # required
        "subject":     "<short subject>",             # optional, default "video"
        "out_path":    "<abs output mp4 path>",       # required
        "aspect":      "9:16" | "16:9" | "1:1",       # optional, default 9:16
        "voice_name":  "<edge voice>",                # optional, default en-US
        "video_source":"local" | "pexels",            # optional, default local
        "pexels_api_key": "<key>",                    # optional (pexels source)
        "materials":   ["<abs clip path>", ...],      # optional, local source
        "clip_duration": 5,                            # optional
        "subtitle":    true | false                    # optional, default true
      }
  OUT {"ok": true,  "output": "<abs mp4>", "duration": <float>, "source": "..."}
   |  {"ok": false, "error": "<message>"}

Exit code is 0 on success, 1 on failure; the JSON result line is authoritative.
"""

from __future__ import annotations

import json
import os
import shutil
import subprocess
import sys
import traceback
import uuid

# Default key-free edge-tts voice. parse_voice_name() strips the gender suffix.
DEFAULT_VOICE = "en-US-AvaNeural-Female"
# MPT's preprocess_video rejects materials below 480x480; portrait shorts need
# height >= width, so 1080x1920 is both safe and matches the design's frame.
RESOLUTIONS = {
    "9:16": (1080, 1920),
    "16:9": (1920, 1080),
    "1:1": (1080, 1080),
}
# A small palette of solid colors so synthesized local clips are visually
# distinct (deterministic order — same input yields the same clips).
COLORS = ["0x1a2332", "0x2d3a4f", "0x3f5168", "0x52687f", "0x6a7f96"]


def _emit(result: dict) -> None:
    """Print the single authoritative JSON result line and flush."""
    sys.stdout.write(json.dumps(result) + "\n")
    sys.stdout.flush()


def _ffmpeg_bin() -> str:
    return os.environ.get("IMAGEIO_FFMPEG_EXE") or shutil.which("ffmpeg") or "ffmpeg"


def _make_test_clip(out_path: str, width: int, height: int, seconds: int,
                    color: str, label: str) -> None:
    """Synthesize a solid-color test clip with ffmpeg (key-free local material).

    Drawn at the target resolution so MPT's >=480x480 check passes and no
    upscaling/letterboxing is required. libx264 + yuv420p keeps the clip a
    standard, broadly decodable mp4.
    """
    ffmpeg = _ffmpeg_bin()
    cmd = [
        ffmpeg, "-y",
        "-f", "lavfi",
        "-i", f"color=c={color}:s={width}x{height}:d={seconds}:r=30",
        "-vf", (
            f"drawtext=text='{label}':fontcolor=white:fontsize={max(width, height)//22}"
            ":x=(w-text_w)/2:y=(h-text_h)/2"
        ),
        "-c:v", "libx264", "-pix_fmt", "yuv420p", "-t", str(seconds),
        out_path,
    ]
    proc = subprocess.run(cmd, capture_output=True, text=True)
    if proc.returncode != 0 or not os.path.isfile(out_path):
        # Fallback without drawtext (some ffmpeg builds lack the freetype filter).
        cmd_plain = [
            ffmpeg, "-y",
            "-f", "lavfi",
            "-i", f"color=c={color}:s={width}x{height}:d={seconds}:r=30",
            "-c:v", "libx264", "-pix_fmt", "yuv420p", "-t", str(seconds),
            out_path,
        ]
        proc2 = subprocess.run(cmd_plain, capture_output=True, text=True)
        if proc2.returncode != 0 or not os.path.isfile(out_path):
            raise RuntimeError(
                f"ffmpeg failed to synthesize local material: "
                f"{(proc2.stderr or proc.stderr or '').strip()[-400:]}"
            )


def _prepare_local_materials(spec: dict, width: int, height: int,
                             clip_duration: int):
    """Resolve local material clips into MPT's storage/local_videos directory.

    MPT's preprocess_video resolves each material.url *within* storage/local_videos
    (file_security.resolve_path_within_directory). So provided clips are copied in
    and synthesized clips are written there. Returns a list of MaterialInfo.
    """
    from app.models.schema import MaterialInfo  # noqa: E402  (MPT import)
    from app.utils import utils  # noqa: E402

    local_dir = utils.storage_dir("local_videos", create=True)
    materials = []

    # MaterialInfo.url must be an ABSOLUTE path inside storage/local_videos.
    # preprocess_video only rewrites .url for *image* materials; for video clips
    # it returns the original url unchanged, and combine_videos then opens that
    # url directly. A bare filename would be opened relative to cwd and fail
    # ("'oma-synth-00.mp4' not found"). Absolute paths still pass MPT's
    # resolve_path_within_directory guard because they live under local_videos.
    provided = spec.get("materials") or []
    if provided:
        for idx, src in enumerate(provided):
            if not os.path.isfile(src):
                continue
            ext = os.path.splitext(src)[1] or ".mp4"
            dst = os.path.join(local_dir, f"oma-material-{idx:02d}{ext}")
            shutil.copyfile(src, dst)
            materials.append(MaterialInfo(provider="local", url=dst, duration=0))
    if not materials:
        # Synthesize a few deterministic test-pattern clips (key-free path).
        count = 3
        for idx in range(count):
            dst = os.path.join(local_dir, f"oma-synth-{idx:02d}.mp4")
            _make_test_clip(
                dst, width, height, clip_duration,
                COLORS[idx % len(COLORS)], f"scene {idx + 1}",
            )
            materials.append(MaterialInfo(provider="local", url=dst, duration=0))
    return materials


def run(spec: dict) -> dict:
    mpt_dir = spec.get("mpt_dir")
    if not mpt_dir or not os.path.isdir(mpt_dir):
        return {"ok": False, "error": f"mpt_dir not found: {mpt_dir!r}"}
    script = (spec.get("script") or "").strip()
    if not script:
        return {"ok": False, "error": "script is required and must be non-empty"}
    out_path = spec.get("out_path")
    if not out_path:
        return {"ok": False, "error": "out_path is required"}

    aspect = spec.get("aspect") or "9:16"
    if aspect not in RESOLUTIONS:
        aspect = "9:16"
    width, height = RESOLUTIONS[aspect]
    voice_name = spec.get("voice_name") or DEFAULT_VOICE
    video_source = spec.get("video_source") or "local"
    clip_duration = int(spec.get("clip_duration") or 5)
    subtitle = bool(spec.get("subtitle", True))
    subject = spec.get("subject") or "video"

    # Make MPT importable. This driver runs under MPT's OWN venv python, so its
    # third-party deps resolve; we only need MPT's package root on sys.path.
    if mpt_dir not in sys.path:
        sys.path.insert(0, mpt_dir)

    # Pexels key (only when the pexels source is selected) — env-only, never
    # logged. MPT reads pexels keys from its config; set it on config in-memory.
    from app.config import config  # noqa: E402

    if video_source == "pexels":
        key = spec.get("pexels_api_key") or os.environ.get("PEXELS_API_KEY")
        if not key:
            return {"ok": False, "error": "video_source=pexels but no PEXELS_API_KEY"}
        config.app["pexels_api_keys"] = [key]

    from app.models.schema import VideoConcatMode, VideoParams  # noqa: E402
    from app.services import task  # noqa: E402
    from app.utils import utils  # noqa: E402

    video_materials = None
    if video_source == "local":
        video_materials = _prepare_local_materials(
            spec, width, height, clip_duration
        )
        if not video_materials:
            return {"ok": False, "error": "no local materials available"}

    params = VideoParams(
        video_subject=subject,
        # Injecting video_script puts MPT in custom-script mode: generate_script
        # returns it verbatim, no LLM call (backend rule 11 key-free path).
        video_script=script,
        # Empty terms + local source avoids generate_terms' LLM call too.
        video_terms=[] if video_source == "local" else None,
        video_aspect=aspect,
        video_concat_mode=VideoConcatMode.sequential.value,
        video_clip_duration=clip_duration,
        video_count=1,
        video_source=video_source,
        video_materials=video_materials,
        voice_name=voice_name,
        voice_rate=1.0,
        bgm_type="",  # no background music (key-free, deterministic)
        bgm_volume=0.0,
        subtitle_enabled=subtitle,
        n_threads=2,
        paragraph_number=1,
    )

    task_id = "oma-" + uuid.uuid4().hex[:12]
    result = task.start(task_id=task_id, params=params, stop_at="video")
    if not result or not result.get("videos"):
        return {
            "ok": False,
            "error": "MPT task.start produced no videos (see stderr for the MPT log)",
        }

    final = result["videos"][0]
    if not os.path.isfile(final):
        return {"ok": False, "error": f"MPT reported video but file missing: {final}"}

    os.makedirs(os.path.dirname(os.path.abspath(out_path)), exist_ok=True)
    shutil.copyfile(final, out_path)

    duration = 0.0
    try:
        duration = float(result.get("audio_duration") or 0.0)
    except (TypeError, ValueError):
        duration = 0.0

    # Clean up MPT's per-task storage so the cache clone does not grow unbounded.
    try:
        shutil.rmtree(utils.task_dir(task_id), ignore_errors=True)
    except Exception:  # noqa: BLE001  (cleanup is best-effort)
        pass

    return {
        "ok": True,
        "output": os.path.abspath(out_path),
        "duration": duration,
        "source": video_source,
    }


def main() -> int:
    # Spec JSON comes from argv[1] (a path or inline JSON) or stdin.
    raw = None
    if len(sys.argv) > 1:
        arg = sys.argv[1]
        if os.path.isfile(arg):
            with open(arg, "r", encoding="utf-8") as fh:
                raw = fh.read()
        else:
            raw = arg
    if raw is None:
        raw = sys.stdin.read()

    try:
        spec = json.loads(raw)
    except Exception as exc:  # noqa: BLE001
        _emit({"ok": False, "error": f"invalid spec JSON: {exc}"})
        return 1

    try:
        result = run(spec)
    except Exception as exc:  # noqa: BLE001
        traceback.print_exc(file=sys.stderr)
        _emit({"ok": False, "error": f"{type(exc).__name__}: {exc}"})
        return 1

    _emit(result)
    return 0 if result.get("ok") else 1


if __name__ == "__main__":
    sys.exit(main())

#!/usr/bin/env node
// Headed web-app capture driver — boundary-safe subprocess entrypoint.
//
// oma-video NEVER imports Playwright. The TypeScript provider
// (`providers/capture-playwright.ts` + `internal/playwright-project.ts`) spawns
// *this* script with the node interpreter of a resolved Playwright install
// (its node_modules reachable via cwd / NODE_PATH). The driver drives a real
// headed Chromium, records a live human-driven flow, and muxes the result to a
// single mp4 — then prints ONE authoritative JSON result line on stdout.
//
// MECHANISM ONLY. The driver assumes NOTHING about the flow or its purpose:
//   * any URL (local / staging / prod),
//   * any number of pages (popups / new tabs / cross-origin redirects are
//     recorded generically — never tied to a specific auth or app shape),
//   * NO credential handling or automation of any kind — a human drives the
//     on-screen flow and logs in themselves if the flow needs it.
//
// SECURITY:
//   * the URL + any query tokens are MASKED in every stderr log line,
//   * the recording + all outputs are confined to --out's directory,
//   * credentials are never read, stored, or printed; on-screen sensitive input
//     is captured as-is (the human controls what is on screen).
//
// Contract — flags in, ONE JSON result line out (stdout's LAST line):
//   IN  --url <url>            target (required)
//       --out <abs mp4 path>   output, inside a run dir (required)
//       --size <WxH>           recording frame size (required; derived upstream)
//       --headless <0|1>       headed (0, default, real use) | headless (1, CI)
//       --ready-selector <css> await before the meaningful capture (optional)
//       --show-cursor          overlay a visible cursor (optional)
//       --timeout <ms>         hard ceiling for the whole capture (optional)
//       --stop <mode>          NON-interactive stop for CI/tests:
//                                duration:<sec>  stop after N seconds
//                                selector:<css>  stop when the selector appears
//                              omitted -> interactive ENTER prompt (real path)
//   OUT {"ok":true, "output":"<abs mp4>", "pages":<n>, "durationSec":<float>}
//    |  {"ok":false,"error":"<message>","code":"<reason>"}
//
// Exit code is 0 on success, 1 on failure; the JSON result line is authoritative.
import { spawn } from "node:child_process";
import { createRequire } from "node:module";
import {
  existsSync,
  mkdtempSync,
  readdirSync,
  rmSync,
  statSync,
} from "node:fs";
import { tmpdir } from "node:os";
import path from "node:path";
import process from "node:process";
import { pathToFileURL } from "node:url";

// All mutable state + scratch handle are declared FIRST, so the early-`fail`
// path (and its `cleanup()`) never touches a binding in its temporal dead zone.
let scratch = null;
let browser;
let hardTimer;
let aborted = false;
// Pages recorded, in chronological open order. Each entry: { video, openedAt }.
const recorded = [];
// Stop coordinators — resolved by ENTER / duration / selector / timeout / SIGINT.
const stopWaiters = [];

const args = parseArgs(process.argv.slice(2));
const url = args.url;
const out = args.out;
const size = parseSize(args.size);
const headless = args.headless === "1";
const readySelector = args["ready-selector"];
const showCursor = args["show-cursor"] === true || args["show-cursor"] === "1";
const timeoutMs = Number.parseInt(args.timeout ?? "", 10);
const stopMode = parseStop(args.stop);

if (!url) fail("missing --url", "bad-args");
if (!out) fail("missing --out", "bad-args");
if (!size) fail("missing or invalid --size (expected WxH)", "bad-args");

const outDir = path.dirname(path.resolve(out));
if (!existsSync(outDir)) fail(`--out directory does not exist: ${mask(outDir)}`, "bad-out");

// Resolve Playwright from the install the provider passes via --playwright-dir
// (its node_modules), falling back to a bare resolution from cwd. ESM ignores
// NODE_PATH, so we resolve the package's absolute entry explicitly and import
// it by file URL — boundary-safe (this script is never imported into the CLI).
const chromium = await resolveChromium(args["playwright-dir"]);

// Recordings land in a private temp dir we own, then get muxed into --out.
// Confinement: nothing is written outside outDir (final mp4) or this scratch
// dir (intermediate webms, cleaned up at the end).
scratch = mkdtempSync(path.join(tmpdir(), "oma-video-pwcap-"));

log(`opening ${mask(url)} (${size.width}x${size.height}, ${headless ? "headless" : "headed"})`);

try {
  browser = await chromium.launch({ headless });
  const context = await browser.newContext({
    viewport: { width: size.width, height: size.height },
    recordVideo: { dir: scratch, size: { width: size.width, height: size.height } },
  });

  // Record EVERY page generically — popups, new tabs, cross-origin redirects.
  // We never inspect or interpret the page; we only track open order so the
  // final concat is chronological.
  context.on("page", (page) => {
    recorded.push({ page, openedAt: Date.now() });
    if (showCursor) injectCursor(page).catch(() => undefined);
  });

  const firstPage = await context.newPage();
  if (recorded.length === 0) {
    recorded.push({ page: firstPage, openedAt: Date.now() });
  }
  if (showCursor) await injectCursor(firstPage).catch(() => undefined);

  // Hard ceiling: abort the whole capture cleanly if it runs past --timeout.
  if (Number.isFinite(timeoutMs) && timeoutMs > 0) {
    hardTimer = setTimeout(() => {
      aborted = true;
      log(`capture timeout (${timeoutMs}ms) reached — stopping`);
      stopWaiters.forEach((resolve) => {
        resolve("timeout");
      });
    }, timeoutMs);
    hardTimer.unref?.();
  }

  await firstPage.goto(url, { waitUntil: "load", timeout: 60_000 }).catch((err) => {
    log(`navigation warning: ${stringifyError(err)}`);
  });
  // Hydration: settle the network, then await an optional readiness selector.
  await firstPage
    .waitForLoadState("networkidle", { timeout: 30_000 })
    .catch(() => log("networkidle not reached within 30s — continuing"));
  if (readySelector) {
    await firstPage
      .waitForSelector(readySelector, { timeout: 30_000 })
      .catch(() => log(`ready-selector not found within 30s — continuing`));
  }

  // STOP: interactive ENTER (real human path) OR a non-interactive mode (CI).
  const reason = await waitForStop(firstPage, stopMode);
  log(`stopping (${reason})`);

  // Close the context to flush every page's video to disk.
  await context.close();
  await browser.close();
  browser = undefined;

  // Collect the produced webms in chronological page order. Playwright names
  // them unpredictably, so we sort scratch entries by mtime to approximate the
  // open order (the first page is always first).
  const webms = collectWebms(scratch);
  if (webms.length === 0) {
    fail("no video produced (0-frame recording)", "empty-recording");
  }

  const durationSec = await muxToMp4(webms, path.resolve(out));
  if (durationSec === null || !existsSync(path.resolve(out))) {
    fail("ffmpeg produced no output mp4", "mux-failed");
  }

  emit({
    ok: true,
    output: path.resolve(out),
    pages: webms.length,
    durationSec,
  });
  cleanup();
  process.exit(0);
} catch (err) {
  cleanup();
  // Ctrl-C / SIGINT surfaces here as an abort; report it without partial output.
  emit({
    ok: false,
    code: aborted ? "aborted" : "capture-error",
    error: stringifyError(err),
  });
  if (browser) await browser.close().catch(() => undefined);
  process.exit(1);
}

// ---------------------------------------------------------------------------
// Stop coordination
// ---------------------------------------------------------------------------

/**
 * Resolve when the capture should stop. Interactive: the first ENTER on stdin.
 * Non-interactive: `duration:<sec>` after N seconds, or `selector:<css>` when
 * the selector appears on the first page. The hard --timeout also resolves it.
 */
function waitForStop(firstPage, stop) {
  return new Promise((resolve) => {
    let settled = false;
    const done = (reason) => {
      if (settled) return;
      settled = true;
      resolve(reason);
    };
    stopWaiters.push(done);

    if (stop?.kind === "duration") {
      log(`non-interactive stop: after ${stop.seconds}s`);
      const t = setTimeout(() => done("duration"), stop.seconds * 1000);
      t.unref?.();
      return;
    }
    if (stop?.kind === "selector") {
      log(`non-interactive stop: when selector appears`);
      firstPage
        .waitForSelector(stop.selector, { timeout: 0 })
        .then(() => done("selector"))
        .catch(() => undefined);
      return;
    }

    // Interactive ENTER. The prompt goes to stderr so stdout stays pure JSON.
    process.stderr.write(
      "\n[oma-video] Browser is open. Perform your flow, then press ENTER here to stop recording.\n",
    );
    process.stdin.resume();
    const onData = () => {
      process.stdin.off("data", onData);
      process.stdin.pause();
      done("enter");
    };
    process.stdin.on("data", onData);
    // Ctrl-C: clean stop, no partial output (caller sees a non-ok result).
    process.once("SIGINT", () => {
      aborted = true;
      done("sigint");
    });
  });
}

// ---------------------------------------------------------------------------
// Media helpers
// ---------------------------------------------------------------------------

/** Sorted list of produced webm paths (chronological by mtime). */
function collectWebms(dir) {
  let entries;
  try {
    entries = readdirSync(dir);
  } catch {
    return [];
  }
  return entries
    .filter((name) => name.toLowerCase().endsWith(".webm"))
    .map((name) => path.join(dir, name))
    .sort((a, b) => mtime(a) - mtime(b));
}

function mtime(file) {
  try {
    return statSync(file).mtimeMs;
  } catch {
    return 0;
  }
}

/**
 * Mux the recorded webms into a single mp4 at `outPath`. One page -> a straight
 * transcode; multiple pages -> a chronological concat (filtergraph, so differing
 * codecs/sizes are normalized to the first page's frame). Returns the muxed
 * duration (seconds) or null on failure.
 */
async function muxToMp4(webms, outPath) {
  if (webms.length === 1) {
    const code = await runFfmpeg([
      "-y",
      "-i",
      webms[0],
      "-c:v",
      "libx264",
      "-pix_fmt",
      "yuv420p",
      "-movflags",
      "+faststart",
      outPath,
    ]);
    if (code !== 0) return null;
    return probeDuration(outPath);
  }

  // Multi-page: concat via the concat filter so heterogeneous inputs are safe.
  const inputs = [];
  for (const webm of webms) {
    inputs.push("-i", webm);
  }
  const labels = webms.map((_, i) => `[${i}:v:0]`).join("");
  const filter = `${labels}concat=n=${webms.length}:v=1:a=0[outv]`;
  const code = await runFfmpeg([
    "-y",
    ...inputs,
    "-filter_complex",
    filter,
    "-map",
    "[outv]",
    "-c:v",
    "libx264",
    "-pix_fmt",
    "yuv420p",
    "-movflags",
    "+faststart",
    outPath,
  ]);
  if (code !== 0) return null;
  return probeDuration(outPath);
}

function runFfmpeg(ffArgs) {
  return new Promise((resolve) => {
    const ff = spawn(ffmpegBin(), ffArgs, { stdio: ["ignore", "ignore", "pipe"] });
    let stderr = "";
    ff.stderr?.on("data", (c) => {
      stderr += c.toString();
    });
    ff.on("error", () => resolve(1));
    ff.on("close", (code) => {
      if (code !== 0) log(`ffmpeg exit ${code}: ${stderr.trim().split("\n").slice(-1)[0] ?? ""}`);
      resolve(code ?? 1);
    });
  });
}

function probeDuration(file) {
  return new Promise((resolve) => {
    const ff = spawn(
      ffprobeBin(),
      [
        "-v",
        "error",
        "-show_entries",
        "format=duration",
        "-of",
        "default=noprint_wrappers=1:nokey=1",
        file,
      ],
      { stdio: ["ignore", "pipe", "ignore"] },
    );
    let stdout = "";
    ff.stdout?.on("data", (c) => {
      stdout += c.toString();
    });
    ff.on("error", () => resolve(null));
    ff.on("close", () => {
      const seconds = Number.parseFloat(stdout.trim());
      resolve(Number.isFinite(seconds) && seconds > 0 ? seconds : null);
    });
  });
}

function ffmpegBin() {
  return process.env.OMA_FFMPEG?.trim() || "ffmpeg";
}
function ffprobeBin() {
  return process.env.OMA_FFPROBE?.trim() || "ffprobe";
}

/** Inject a small visible-cursor overlay that follows the mouse, for clarity. */
async function injectCursor(page) {
  await page.addInitScript(() => {
    const dot = document.createElement("div");
    dot.style.cssText =
      "position:fixed;z-index:2147483647;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:rgba(255,80,80,.65);box-shadow:0 0 0 2px rgba(255,255,255,.9);pointer-events:none;transition:transform .03s linear;";
    const mount = () => {
      if (document.body) document.body.appendChild(dot);
    };
    if (document.body) mount();
    else document.addEventListener("DOMContentLoaded", mount);
    document.addEventListener("mousemove", (e) => {
      dot.style.left = `${e.clientX}px`;
      dot.style.top = `${e.clientY}px`;
    });
  });
}

// ---------------------------------------------------------------------------
// Arg parsing + masking + result emission
// ---------------------------------------------------------------------------

/**
 * Resolve `chromium` from a Playwright install. `dir` is the directory whose
 * `node_modules` holds `playwright` (or `@playwright/test`); when omitted we try
 * a bare resolution from the current working directory. Imports the package's
 * absolute entry by file URL because ESM does not honor NODE_PATH. Emits a
 * masked `playwright-unresolved` result and exits 1 on failure.
 */
async function resolveChromium(dir) {
  const anchor = dir
    ? path.join(path.resolve(dir), "node_modules", "__anchor__.js")
    : path.join(process.cwd(), "__anchor__.js");
  const require = createRequire(anchor);
  for (const pkg of ["playwright", "@playwright/test"]) {
    // Playwright is CommonJS; `require` yields the real module.exports whose
    // named `chromium` is the launcher. (An ESM `import` of the CJS entry only
    // interops `default`, dropping the named exports — so we require here.)
    try {
      const mod = require(pkg);
      if (mod?.chromium) return mod.chromium;
    } catch {
      // try the next package specifier
    }
    // Fallback: resolve the absolute entry and import by file URL (covers
    // installs whose package "exports" map only exposes an ESM entry).
    try {
      const entry = require.resolve(pkg);
      const mod = await import(pathToFileURL(entry).href);
      const chromium = mod?.chromium ?? mod?.default?.chromium;
      if (chromium) return chromium;
    } catch {
      // try the next package specifier
    }
  }
  emit({
    ok: false,
    code: "playwright-unresolved",
    error: `could not load Playwright from ${mask(dir ?? process.cwd())}`,
  });
  cleanup();
  process.exit(1);
  return undefined; // unreachable; keeps the type obvious
}

function parseArgs(argv) {
  const out = {};
  for (let i = 0; i < argv.length; i++) {
    const token = argv[i];
    if (!token.startsWith("--")) continue;
    const key = token.slice(2);
    const next = argv[i + 1];
    if (next === undefined || next.startsWith("--")) {
      out[key] = true; // boolean flag
    } else {
      out[key] = next;
      i++;
    }
  }
  return out;
}

function parseSize(value) {
  if (!value || typeof value !== "string") return null;
  const m = /^(\d+)x(\d+)$/.exec(value.trim());
  if (!m) return null;
  const width = Number.parseInt(m[1], 10);
  const height = Number.parseInt(m[2], 10);
  if (!(width > 0 && height > 0)) return null;
  return { width, height };
}

function parseStop(value) {
  if (!value || typeof value !== "string") return null;
  const [kind, ...rest] = value.split(":");
  const arg = rest.join(":");
  if (kind === "duration") {
    const seconds = Number.parseFloat(arg);
    if (Number.isFinite(seconds) && seconds > 0) return { kind: "duration", seconds };
    return null;
  }
  if (kind === "selector" && arg.length > 0) {
    return { kind: "selector", selector: arg };
  }
  return null;
}

/**
 * Mask a URL for logging: keep scheme + host + path shape, strip the query/hash
 * entirely (it may carry tokens), and redact userinfo. Non-URL strings get a
 * coarse redaction of anything that looks like a token/query.
 */
function mask(value) {
  if (typeof value !== "string") return String(value);
  try {
    const u = new URL(value);
    const auth = u.username ? "***@" : "";
    const query = u.search ? "?<redacted>" : "";
    const hash = u.hash ? "#<redacted>" : "";
    return `${u.protocol}//${auth}${u.host}${u.pathname}${query}${hash}`;
  } catch {
    // Not a URL — redact any "?...="/"&...=" token-ish tails and long hex/jwt.
    return value
      .replace(/([?&][^=\s]+=)[^&\s]+/g, "$1<redacted>")
      .replace(/\b[A-Za-z0-9_-]{24,}\b/g, "<redacted>");
  }
}

function log(message) {
  process.stderr.write(`[oma-video] ${mask(message)}\n`);
}

function stringifyError(err) {
  const msg = err instanceof Error ? err.message : String(err);
  return mask(msg);
}

function emit(result) {
  process.stdout.write(`${JSON.stringify(result)}\n`);
}

function fail(message, code) {
  cleanup();
  emit({ ok: false, code: code ?? "error", error: mask(message) });
  process.exit(1);
}

function cleanup() {
  if (hardTimer) clearTimeout(hardTimer);
  if (!scratch) return;
  try {
    rmSync(scratch, { recursive: true, force: true });
  } catch {
    // best-effort scratch cleanup
  }
}

node_modules/
out/
.remotion/
# Fonts are provisioned by `oma video doctor`, not committed (see public/fonts/README.md).
public/fonts/*.woff2
public/fonts/*.ttf
public/fonts/*.otf

{
  "name": "oma-video-remotion",
  "version": "1.0.0",
  "private": true,
  "description": "Vendored Remotion compositor for oma-video. Registers Shorts/Explainer/Demo compositions that consume render-spec.json as input props. Lockfile-pinned; install once via `oma video doctor`, never during a run.",
  "license": "UNLICENSED",
  "type": "module",
  "scripts": {
    "studio": "remotion studio src/index.ts",
    "render": "remotion render src/index.ts",
    "typecheck": "tsc --noEmit"
  },
  "dependencies": {
    "@remotion/captions": "4.0.380",
    "@remotion/cli": "4.0.380",
    "@remotion/fonts": "4.0.380",
    "react": "19.2.0",
    "react-dom": "19.2.0",
    "remotion": "4.0.380",
    "zod": "3.23.8"
  },
  "devDependencies": {
    "@types/react": "19.2.0",
    "typescript": "5.6.3"
  }
}

// Remotion CLI config for the vendored oma-video compositor.
// Kept minimal + deterministic: H.264 mp4, overwrite output, color-managed.
// The CLI adapter passes --props=render-spec.json; this file only fixes the
// encoder/output defaults so renders are reproducible across machines.
import { Config } from "@remotion/cli/config";

Config.setVideoImageFormat("jpeg");
Config.setCodec("h264");
Config.setOverwriteOutput(true);
Config.setChromiumOpenGlRenderer("angle");

// Captions.tsx — render captions.srt over the video using @remotion/captions.
//
// The CLI's oma-captions provider writes captions.srt (+ .vtt) into the run
// dir; render-spec.captions.file points at it. Here we fetch + parseSrt() the
// .srt, then createTikTokStyleCaptions() to page it, and display the active
// page at the current frame. Two styles map from render-spec.captions.style:
//   - "tiktok"      : centered, large, animated pop, sits in the lower-third
//                     above the safe-area bottom margin.
//   - "lower-third" : smaller, left-aligned band near the bottom.
//   - "none"        : nothing rendered (handled by the caller).
import { useCallback, useEffect, useMemo, useState } from "react";
import {
  createTikTokStyleCaptions,
  parseSrt,
  type Caption,
  type TikTokPage,
} from "@remotion/captions";
import {
  AbsoluteFill,
  staticFile,
  useCurrentFrame,
  useVideoConfig,
  delayRender,
  continueRender,
  cancelRender,
} from "remotion";
import { FONT_STACK } from "../load-fonts";
import type { CaptionStyleSchema, SafeArea } from "../render-spec";
import type { z } from "zod";

type CaptionStyle = z.infer<typeof CaptionStyleSchema>;

// How often TikTok-style caption pages switch (ms). Higher = more words/page.
const SWITCH_CAPTIONS_EVERY_MS = 1200;

export const Captions: React.FC<{
  file?: string;
  style: CaptionStyle;
  maxWidthPct: number;
  safeArea: SafeArea;
}> = ({ file, style, maxWidthPct, safeArea }) => {
  const frame = useCurrentFrame();
  const { fps } = useVideoConfig();
  const [pages, setPages] = useState<TikTokPage[] | null>(null);
  const [handle] = useState(() => delayRender("Loading captions"));

  const fetchCaptions = useCallback(async () => {
    if (!file) {
      setPages([]);
      continueRender(handle);
      return;
    }
    try {
      const res = await fetch(staticFile(file));
      const text = await res.text();
      const { captions } = parseSrt({ input: text }) as { captions: Caption[] };
      const { pages: built } = createTikTokStyleCaptions({
        captions,
        combineTokensWithinMilliseconds: SWITCH_CAPTIONS_EVERY_MS,
      });
      setPages(built);
      continueRender(handle);
    } catch (err) {
      cancelRender(err);
    }
  }, [file, handle]);

  useEffect(() => {
    fetchCaptions();
  }, [fetchCaptions]);

  const activePage = useMemo<TikTokPage | null>(() => {
    if (!pages) return null;
    const nowMs = (frame / fps) * 1000;
    return (
      pages.find(
        (page) => nowMs >= page.startMs && nowMs < page.startMs + page.durationMs,
      ) ?? null
    );
  }, [pages, frame, fps]);

  if (style === "none" || !activePage) return null;

  const isTikTok = style === "tiktok";
  return (
    <AbsoluteFill
      style={{
        justifyContent: "flex-end",
        alignItems: isTikTok ? "center" : "flex-start",
        paddingBottom: `${safeArea.bottomPct}%`,
        paddingLeft: `${safeArea.leftPct}%`,
        paddingRight: `${safeArea.rightPct}%`,
        pointerEvents: "none",
      }}
    >
      <div
        style={{
          maxWidth: `${maxWidthPct}%`,
          fontFamily: FONT_STACK,
          fontWeight: 800,
          textAlign: isTikTok ? "center" : "left",
          color: "#ffffff",
          textShadow: "0 2px 8px rgba(0,0,0,0.85)",
          fontSize: isTikTok ? 64 : 40,
          lineHeight: 1.15,
          letterSpacing: -0.5,
          background: isTikTok ? "transparent" : "rgba(0,0,0,0.55)",
          padding: isTikTok ? 0 : "12px 20px",
          borderRadius: isTikTok ? 0 : 12,
        }}
      >
        {activePage.text}
      </div>
    </AbsoluteFill>
  );
};

// Scene.tsx — render one render-spec scene: a visual (image / video / slide /
// capture / placeholder) plus its on-screen text, with optional Ken Burns.
//
// Each scene is placed on the timeline by the composition using <Sequence>; this
// component only draws the visual for the duration it is mounted. Ken Burns is a
// deterministic slow zoom driven purely by the frame (no randomness), so the
// output is reproducible from the render-spec + seed.
import {
  AbsoluteFill,
  Img,
  OffthreadVideo,
  staticFile,
  interpolate,
  useCurrentFrame,
} from "remotion";
import { FONT_STACK } from "../load-fonts";
import type { RenderSpecScene } from "../render-spec";

const isColor = (src: string): boolean => src.startsWith("#");

export const Scene: React.FC<{ scene: RenderSpecScene }> = ({ scene }) => {
  const frame = useCurrentFrame();
  const { type, src, kenBurns } = scene.visual;

  // Deterministic slow zoom over the scene's local frame range.
  const scale = kenBurns
    ? interpolate(frame, [0, scene.durationInFrames], [1, 1.08], {
        extrapolateRight: "clamp",
      })
    : 1;

  return (
    <AbsoluteFill>
      <AbsoluteFill style={{ transform: `scale(${scale})` }}>
        {renderVisual(type, src)}
      </AbsoluteFill>
      {scene.onScreenText.length > 0 ? (
        <AbsoluteFill
          style={{
            justifyContent: "flex-start",
            alignItems: "center",
            paddingTop: "10%",
          }}
        >
          <div
            style={{
              fontFamily: FONT_STACK,
              fontWeight: 800,
              fontSize: 56,
              color: "#ffffff",
              textShadow: "0 2px 10px rgba(0,0,0,0.8)",
              textAlign: "center",
              maxWidth: "86%",
            }}
          >
            {scene.onScreenText.join("\n")}
          </div>
        </AbsoluteFill>
      ) : null}
    </AbsoluteFill>
  );
};

function renderVisual(
  type: RenderSpecScene["visual"]["type"],
  src: string,
): React.ReactNode {
  if (type === "placeholder" || (type === "image" && isColor(src))) {
    const color = isColor(src) ? src : "#0f1117";
    return <AbsoluteFill style={{ backgroundColor: color }} />;
  }
  if (type === "video" || type === "capture") {
    return (
      <OffthreadVideo
        src={staticFile(src)}
        style={{ width: "100%", height: "100%", objectFit: "cover" }}
      />
    );
  }
  // image | slide -> still frame
  return (
    <Img
      src={staticFile(src)}
      style={{ width: "100%", height: "100%", objectFit: "cover" }}
    />
  );
}

// VideoBase.tsx — the shared timeline used by all three modes. It lays out the
// render-spec scenes with <Sequence>, draws the background, mounts narration +
// optional music <Audio>, and overlays captions. Shorts/Explainer/Demo are thin
// wrappers that only differ in default framing; the timeline logic is one place.
import {
  AbsoluteFill,
  Audio,
  Sequence,
  staticFile,
} from "remotion";
import { Scene } from "./Scene";
import { Captions } from "./Captions";
import { ensurePretendard } from "../load-fonts";
import type { RenderSpec } from "../render-spec";

// Block the render until Pretendard is ready (deterministic glyphs).
void ensurePretendard();

export const VideoBase: React.FC<RenderSpec> = (spec) => {
  const bgColor =
    spec.background.type === "color" ? spec.background.src ?? "#0f1117" : "#000";

  return (
    <AbsoluteFill style={{ backgroundColor: bgColor }}>
      {spec.background.type !== "color" && spec.background.src ? (
        <AbsoluteFill>
          <Scene
            scene={{
              id: "bg",
              fromFrame: 0,
              durationInFrames: spec.durationInFrames,
              visual: {
                type: spec.background.type === "video" ? "video" : "image",
                src: spec.background.src,
                kenBurns: false,
              },
              onScreenText: [],
            }}
          />
        </AbsoluteFill>
      ) : null}

      {spec.scenes.map((scene) => (
        <Sequence
          key={scene.id}
          from={scene.fromFrame}
          durationInFrames={scene.durationInFrames}
          name={scene.id}
        >
          <Scene scene={scene} />
        </Sequence>
      ))}

      {spec.audio.narration ? (
        <Audio src={staticFile(spec.audio.narration)} />
      ) : null}
      {spec.audio.music ? (
        <Audio
          src={staticFile(spec.audio.music)}
          volume={dbToGain(spec.audio.musicGainDb ?? -18)}
        />
      ) : null}

      <Captions
        file={spec.captions.file}
        style={spec.captions.style}
        maxWidthPct={spec.captions.maxWidthPct}
        safeArea={spec.captions.safeArea}
      />
    </AbsoluteFill>
  );
};

function dbToGain(db: number): number {
  return Math.min(1, Math.max(0, 10 ** (db / 20)));
}

// Demo — 16:9 demo/walkthrough composition over a human-recorded capture.
// The capture arrives as a render-spec scene/background (visual.type "capture");
// intro card + callout scenes are additional render-spec scenes. Zoom/callout
// motion is expressed as Ken Burns + on-screen text on those scenes, so the
// timeline stays a pure function of the render-spec.
import { VideoBase } from "../components/VideoBase";
import type { RenderSpec } from "../render-spec";

export const Demo: React.FC<RenderSpec> = (props) => {
  return <VideoBase {...props} />;
};

// Explainer — 16:9 (or 9:16) explainer composition built from README/code/data.
// Slide + diagram + code frames arrive as render-spec scenes (visual.type
// "slide" | "image"); VideoBase renders them on the timeline.
import { VideoBase } from "../components/VideoBase";
import type { RenderSpec } from "../render-spec";

export const Explainer: React.FC<RenderSpec> = (props) => {
  return <VideoBase {...props} />;
};

// Shorts — 9:16 short-form composition. Thin wrapper over VideoBase; all
// timeline/visual/caption logic lives there. The render-spec drives dimensions,
// fps, and duration via the <Composition> calculateMetadata in Root.tsx.
import { VideoBase } from "../components/VideoBase";
import type { RenderSpec } from "../render-spec";

export const Shorts: React.FC<RenderSpec> = (props) => {
  return <VideoBase {...props} />;
};

// index.ts — Remotion entry point. registerRoot() is what `npx remotion render
// src/index.ts <CompId> ...` and `remotion studio src/index.ts` look for.
import { registerRoot } from "remotion";
import { RemotionRoot } from "./Root";

registerRoot(RemotionRoot);

// load-fonts.ts — embed Pretendard for cross-machine identical renders.
//
// Pretendard is a CJK-ready variable font (design rule 2: CJK services
// prioritize Pretendard Variable). Embedding it locally — rather than relying
// on a system font or a network fetch — is what makes a render byte-stable
// across machines (design 013 §5). The .woff2 is NOT committed to git here to
// keep the skill tree light; `oma video doctor` fetches it once into
// `public/fonts/` (see public/fonts/README.md), then this loader picks it up.
//
// loadFont() blocks the render until the font is ready, so captions/on-screen
// text never flash a fallback face mid-render.
import { loadFont } from "@remotion/fonts";
import { staticFile } from "remotion";

export const PRETENDARD_FAMILY = "Pretendard";

// staticFile() resolves against public/. doctor writes the woff2 here.
const PRETENDARD_URL = staticFile("fonts/PretendardVariable.woff2");

let fontPromise: Promise<void> | null = null;

/**
 * Idempotently load Pretendard. Compositions call this at module scope so the
 * render is delayed until the font is ready. If the embedded woff2 is missing
 * (doctor not run), the browser falls back to the system stack — the render
 * still succeeds, but is not guaranteed byte-identical across machines.
 *
 * `@remotion/fonts` `loadFont()` calls Remotion's `cancelRender()` internally
 * when the font URL fails to load (e.g. a 404 because `oma video doctor` has not
 * fetched the woff2 yet). `cancelRender()` aborts the WHOLE render, so a plain
 * `.catch()` on the returned promise is not enough — the render is already
 * cancelled. We therefore probe the URL with `fetch` first and only call
 * `loadFont()` when the asset is actually present. A missing font then degrades
 * gracefully to the system `FONT_STACK` instead of hard-failing the render.
 */
export function ensurePretendard(): Promise<void> {
  if (!fontPromise) {
    fontPromise = (async () => {
      try {
        const probe = await fetch(PRETENDARD_URL, { method: "HEAD" });
        if (!probe.ok) return;
      } catch {
        // Network/probe error -> system fallback.
        return;
      }
      await loadFont({
        family: PRETENDARD_FAMILY,
        url: PRETENDARD_URL,
        format: "woff2",
        weight: "100 900",
        display: "block",
      }).catch(() => undefined);
    })();
  }
  return fontPromise;
}

// System fallback stack (design rule 1 + 2): CJK-ready first, then system-ui.
export const FONT_STACK =
  `"${PRETENDARD_FAMILY}", "Noto Sans CJK KR", system-ui, ` +
  `-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`;

// render-spec.ts — the Remotion-side mirror of the CLI's RenderSpec schema
// (cli/commands/video/types.ts, schemaVersion "1.0"). render-spec.json is the
// deterministic compute boundary: the CLI writes it, `npx remotion render`
// reads it as `--props`. Keep this in sync with the CLI schema; the CLI remains
// the source of truth.
import { z } from "zod";

export const VIDEO_SCHEMA_VERSION = "1.0" as const;

export const CaptionStyleSchema = z.enum(["tiktok", "lower-third", "none"]);

export const SafeAreaSchema = z.object({
  topPct: z.number().nonnegative(),
  bottomPct: z.number().nonnegative(),
  leftPct: z.number().nonnegative(),
  rightPct: z.number().nonnegative(),
});

export const RenderSpecSceneSchema = z.object({
  id: z.string().min(1),
  fromFrame: z.number().int().nonnegative(),
  durationInFrames: z.number().int().positive(),
  visual: z.object({
    type: z.enum(["image", "video", "slide", "capture", "placeholder"]),
    src: z.string().min(1),
    kenBurns: z.boolean().default(false),
  }),
  onScreenText: z.array(z.string()).default([]),
  transitionOut: z.string().optional(),
});

export const RenderSpecSchema = z.object({
  schemaVersion: z.literal(VIDEO_SCHEMA_VERSION),
  compositor: z.enum(["remotion", "mpt"]),
  composition: z.string().min(1),
  fps: z.number().int().positive(),
  dimensions: z.object({
    width: z.number().int().positive(),
    height: z.number().int().positive(),
  }),
  durationInFrames: z.number().int().nonnegative(),
  audio: z.object({
    narration: z.string().optional(),
    music: z.string().optional(),
    musicGainDb: z.number().optional(),
  }),
  scenes: z.array(RenderSpecSceneSchema),
  captions: z.object({
    file: z.string().optional(),
    style: CaptionStyleSchema,
    fontFamily: z.string(),
    maxWidthPct: z.number().positive().max(100),
    safeArea: SafeAreaSchema,
  }),
  background: z.object({
    type: z.enum(["color", "image", "video"]),
    src: z.string().optional(),
  }),
  seed: z.number().int(),
});

export type RenderSpec = z.infer<typeof RenderSpecSchema>;
export type RenderSpecScene = z.infer<typeof RenderSpecSceneSchema>;
export type SafeArea = z.infer<typeof SafeAreaSchema>;

// Default props used by the Remotion Studio preview + as the schema fallback.
// A real render overrides every field via --props=render-spec.json.
export const PLACEHOLDER_RENDER_SPEC: RenderSpec = {
  schemaVersion: VIDEO_SCHEMA_VERSION,
  compositor: "remotion",
  composition: "Shorts",
  fps: 30,
  dimensions: { width: 1080, height: 1920 },
  durationInFrames: 90,
  audio: {},
  scenes: [
    {
      id: "scene-01",
      fromFrame: 0,
      durationInFrames: 90,
      visual: { type: "placeholder", src: "#0f1117", kenBurns: false },
      onScreenText: ["oma-video"],
    },
  ],
  captions: {
    style: "tiktok",
    fontFamily: "Pretendard",
    maxWidthPct: 86,
    safeArea: { topPct: 8, bottomPct: 18, leftPct: 7, rightPct: 7 },
  },
  background: { type: "color", src: "#0f1117" },
  seed: 1,
};

// Root.tsx — registers the Shorts / Explainer / Demo compositions.
//
// Each <Composition> reads render-spec.json (passed via `--props`) as input
// props. dimensions/fps/durationInFrames come FROM the render-spec, so we use
// calculateMetadata to override the static defaults at render time. The Zod
// `schema` validates the props, giving the CLI adapter a typed contract: an
// invalid render-spec fails fast (maps to the CLI's SchemaValidationError / exit
// 4) instead of rendering garbage.
import { Composition, type CalculateMetadataFunction } from "remotion";
import { Shorts } from "./compositions/Shorts";
import { Explainer } from "./compositions/Explainer";
import { Demo } from "./compositions/Demo";
import {
  RenderSpecSchema,
  PLACEHOLDER_RENDER_SPEC,
  type RenderSpec,
} from "./render-spec";

// Derive real dimensions/fps/duration from the render-spec props.
const calculateMetadata: CalculateMetadataFunction<RenderSpec> = ({ props }) => {
  return {
    width: props.dimensions.width,
    height: props.dimensions.height,
    fps: props.fps,
    durationInFrames: Math.max(1, props.durationInFrames),
  };
};

export const RemotionRoot: React.FC = () => {
  return (
    <>
      <Composition
        id="Shorts"
        component={Shorts}
        schema={RenderSpecSchema}
        defaultProps={{ ...PLACEHOLDER_RENDER_SPEC, composition: "Shorts" }}
        calculateMetadata={calculateMetadata}
        // Static fallbacks (9:16); overridden by calculateMetadata at render.
        width={1080}
        height={1920}
        fps={30}
        durationInFrames={90}
      />
      <Composition
        id="Explainer"
        component={Explainer}
        schema={RenderSpecSchema}
        defaultProps={{
          ...PLACEHOLDER_RENDER_SPEC,
          composition: "Explainer",
          dimensions: { width: 1920, height: 1080 },
        }}
        calculateMetadata={calculateMetadata}
        width={1920}
        height={1080}
        fps={30}
        durationInFrames={90}
      />
      <Composition
        id="Demo"
        component={Demo}
        schema={RenderSpecSchema}
        defaultProps={{
          ...PLACEHOLDER_RENDER_SPEC,
          composition: "Demo",
          dimensions: { width: 1920, height: 1080 },
        }}
        calculateMetadata={calculateMetadata}
        width={1920}
        height={1080}
        fps={30}
        durationInFrames={90}
      />
    </>
  );
};

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "lib": ["ES2022", "DOM", "DOM.Iterable"],
    "jsx": "react-jsx",
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "noEmit": true
  },
  "include": ["src"]
}