LeClap

Deterministic, on-device, agent-callable video — composed by prompt or by hand.

Describe a video in one JSON template — sections, filters, music, overlays — then render the same template identically on a phone (React Native, on-device) or in the browser (WebAssembly). No upload, no server, no generative model: the output is deterministic and reproducible.

Quick start · Templates · Library API · Architecture · Docs

---

✨ What is LeClap?

LeClap renders video from a single JSON template: the same spec — sections, filters, music, text overlays — runs in the browser via WebAssembly and fully on-device on React Native, with no upload and no server required. Its uncontested corner is deterministic + on-device + agent-callable video, where generative tools (Sora/Runway) and backend-bound renderers (Remotion/Shotstack) can't reach: the full loop — record a clip from the camera, apply effects, mix music, add transitions, render — runs on the phone (or a browser tab), and an AI agent can author and render a template with no LLM in the output path.

Highlight	What it means
🧩 Template-driven	One JSON descriptor → a complete video. No imperative FFmpeg wrangling.
🌍 Runs everywhere	Node.js, browser (WASM), and React Native — one shared core, deterministic output.
📹 Capture → compose → render	Record from the camera, trim/crop, mix music, add transitions, and render — captured, edited, and composed on-device.
🤖 Agent-callable	An MCP server lets an AI agent author & render a template — no LLM in the loop, just deterministic output.
🎨 Premium out of the box	A bundled creative kit of polished, on-device-safe templates — by prompt or in the visual builder.
🧱 Typed & validated	Zod-validated templates, strict TypeScript, dependency-injected architecture.

🎥 Demo

Two looks at LeClap — a finished clip rendered from a single JSON template, and the mobile app composing one fully on-device.

🎬 Template-driven render one JSON template → a finished clip · unmute for sound drink-and-coffee.mp4

📱 On-device on Android the app: capture → compose → render, on the phone leclap-android-demo.mp4

🚀 Quick start

💡 Recommended: mise. mise install provisions the exact pinned toolchain — Node 24, pnpm 11, FFmpeg 8.1.1, and Rust — so every contributor and CI run identical versions. Managing versions yourself? Bring Node ≥ 24 and pnpm 11.

git clone https://github.com/heristop/leclap.git
cd leclap
mise install     # Node 24, pnpm 11, FFmpeg 8.1.1 + Rust
pnpm install

Then pick an app:

pnpm app:web      # web app — compiles videos in-browser (no server)
pnpm app:expo     # Expo mobile app — compiles fully on-device (no server)

Or use the CLI — @leclap/cli is the leclap dev tool:

npx @leclap/cli init my-video         # scaffold a starter project
npx @leclap/cli render template.json  # render it (`leclap diagnose` checks your FFmpeg)

Or drive it from an AI agent: the @leclap/mcp server exposes the engine as MCP tools — discover → validate → render — with no LLM in the output path.

📦 Monorepo

pnpm workspaces (apps/*, packages/*) — no turbo/nx. The root is a private orchestrator (leclap); ffmpeg-video-composer, @leclap/cli, and @leclap/mcp are published to npm. The web and mobile apps both run the same core — the mobile app drives it fully on-device via the embedded native engine (no server), the web app in-browser via WASM.

Package	Description
ffmpeg-video-composer	The library — cross-platform composition engine (Node, browser, WASM).
@leclap/cli	The CLI — the leclap dev tool: scaffold (init), render, diagnose.
@leclap/creative-kit	Shared creative catalog — templates, partials, fonts, media, bundled assets.
@leclap/mcp	MCP server — the engine as agent-callable tools (compose/list/probe).
@leclap/web	React 19 + Vite + Tailwind — in-browser FFmpeg via WASM (reference).
@leclap/expo	Expo / React Native — on-device compiles via the native engine (reference).
ffmpeg-engine	Rust engine embedding FFmpeg fftools for on-device compiles.

🧩 Templates & library

A template is a Zod-validated JSON descriptor — a global block plus an ordered list of sections, each a clip with its own inputs → maps → filters pipeline and {{ variable }} placeholders. Start from a creative-kit template and tweak text, colors, and media — by prompt (MCP) or in the visual builder.

• 📖 Template configuration reference — global config, sections, the FFmpeg pipeline, placeholders.
• 📥 Use it as a library — install, the compile() API, entry points (Node / browser / RN), and automatic FFmpeg detection.

📚 Documentation

• 🌐 Descriptor reference (web) — the full, schema-driven descriptor reference, one page per topic (sections, transitions, looks, grade, motion, audio, captions, filters, examples, JSON Schema).
• 🧩 Template Configuration — the template JSON reference.
• 🏗 Architecture — system architecture and design patterns.
• 🔧 FFmpeg Fallback Strategy — how automatic FFmpeg detection works.
• 📱 On-Device Compilation — the serverless Expo compile pipeline.
• 🤖 AGENTS.md — repo layout, commands, and conventions for contributors and AI agents.

🤝 Contributing & License

Issues and PRs welcome. Keep changes formatted (pnpm fmt) and lint-clean (pnpm lint) before committing. Licensed under the MIT License.