@pixerate/editor 0.123.0 → 0.124.0

package/dist/{chunk-SMJGE7HM.cjs → chunk-IWSMDQE5.cjs}

@@ -1,13 +1,24 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class;// src/video-editor/types.ts
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2;
+
+
+
+
+
+var _chunkIOXKXQNWcjs = require('./chunk-IOXKXQNW.cjs');
+
+
+var _chunkRIWPYSKUcjs = require('./chunk-RIWPYSKU.cjs');
+
+// src/video-editor/types.ts
 var VIDEO_FITS = ["contain", "cover", "fill", "none"];
-var VIDEO_TRANSITION_TYPES = ["crossfade", "dip", "wipe", "push", "slide", "iris"];
+var VIDEO_TRANSITION_TYPES = ["crossfade", "dip", "wipe", "push", "slide", "iris", "effect"];
 var VIDEO_WIPE_DIRECTIONS = ["left", "right", "up", "down"];
 var videoTransitionAudioCurve = (t) => _nullishCoalesce(t.audioCurve, () => ( (t.type === "dip" ? "linear" : "equal-power")));
 var VIDEO_BLEND_MODES = ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "add"];
 var VIDEO_CLIP_ANIMATION_EFFECTS = ["fade", "rise", "drop", "slide-left", "slide-right", "zoom", "pop"];
 var VIDEO_FADE_CURVES = ["linear", "equal-power", "s-curve", "exponential", "logarithmic"];
 var VIDEO_PLACEMENT_MODES = ["refuse", "overwrite", "insert"];
-var VIDEO_CLIP_TYPES = ["media", "text", "color", "sequence"];
+var VIDEO_CLIP_TYPES = ["media", "text", "color", "sequence", "effect"];
 
 // src/video-editor/keyframes.ts
 var VIDEO_EASE_NAMES = ["linear", "hold", "ease-in", "ease-out", "ease-in-out"];
@@ -953,6 +964,11 @@ function videoClipAnimated(clip, project) {
 }
 
 // src/video-editor/evaluate.ts
+function videoEffectValuesAt(values, clipTime) {
+  const out = {};
+  for (const [k, v] of Object.entries(_nullishCoalesce(values, () => ( {})))) out[k] = isVideoKeyframes(v) ? videoValueAt(v, clipTime, 0) : v;
+  return out;
+}
 function videoTransformAt(transform, clipTime = 0) {
   return { x: videoValueAt(_optionalChain([transform, 'optionalAccess', _14 => _14.x]), clipTime, 0), y: videoValueAt(_optionalChain([transform, 'optionalAccess', _15 => _15.y]), clipTime, 0), scale: videoValueAt(_optionalChain([transform, 'optionalAccess', _16 => _16.scale]), clipTime, 1), rotation: videoValueAt(_optionalChain([transform, 'optionalAccess', _17 => _17.rotation]), clipTime, 0) };
 }
@@ -1068,12 +1084,14 @@ function tracksAt(project, tracks, time, scope) {
       let wipe;
       let dip = null;
       let iris;
+      let effectIn;
       let shift = 0;
       let shiftDirection = "right";
       if (incoming) {
         if (incoming.type === "crossfade") opacity *= incoming.progress;
         else if (incoming.type === "wipe") wipe = { direction: _nullishCoalesce(incoming.transition.direction, () => ( "right")), progress: incoming.progress };
         else if (incoming.type === "iris") iris = { progress: incoming.progress };
+        else if (incoming.type === "effect") effectIn = incoming;
         else if (incoming.type === "push" || incoming.type === "slide") {
           shiftDirection = _nullishCoalesce(incoming.transition.direction, () => ( "right"));
           shift = videoTransitionEase(incoming.progress) - 1;
@@ -1100,14 +1118,291 @@ function tracksAt(project, tracks, time, scope) {
       if (clip.type === "sequence") Object.assign(layer, { sequence: clip.sequence, sourceTime, layers: nested.layers });
       if (clip.type === "text") layer.text = videoTextStyle(clip);
       if (clip.type === "color") layer.color = clip.color;
+      if (clip.type === "effect") layer.generator = { effect: clip.effect, ...clip.name ? { name: clip.name } : {}, values: videoEffectValuesAt(clip.values, clipTime), time: Math.max(0, clipTime) };
+      const effects = (_nullishCoalesce(clip.effects, () => ( []))).filter((e) => e.enabled !== false).map((e) => ({ id: e.id, effect: e.effect, ...e.name ? { name: e.name } : {}, opacity: clamp012(videoValueAt(e.opacity, clipTime, 1)), values: videoEffectValuesAt(e.values, clipTime), time: clipTime })).filter((e) => e.opacity > 0);
+      if (effects.length) layer.effects = effects;
+      if (effectIn) {
+        const before = videoClipBefore(track, clip);
+        const i = before ? layers.findIndex((l) => l.clip === prefix + before.id && l.track === track.id) : -1;
+        const from = i >= 0 ? layers.splice(i, 1)[0] : null;
+        const t = effectIn.transition;
+        layer.transitionEffect = { effect: t.effect.effect, ...t.effect.name ? { name: t.effect.name } : {}, values: videoEffectValuesAt(t.effect.values, 0), progress: effectIn.progress, time: effectIn.progress * t.duration, from };
+      }
       if (layer.opacity > 0) layers.push(layer);
       if (dip && dip.opacity > 0) layers.push({ clip: `transition:${prefix}${incoming ? clip.id : outgoing.next.id}`, track: track.id, type: "color", color: dip.color, opacity: clamp012(dip.opacity), rect: { x: 0, y: 0, width: project.width, height: project.height }, rotation: 0 });
     }
   }
   return { layers, audio };
 }
+function videoLayersWithoutTransitionEffects(layers) {
+  return layers.flatMap((l) => {
+    const t = l.transitionEffect;
+    if (!t) return [l];
+    const { transitionEffect: _t, ...rest } = l;
+    const self = { ...rest, opacity: rest.opacity * t.progress };
+    return t.from ? [t.from, self] : [self];
+  });
+}
 function videoFrameLeafLayers(layers) {
-  return layers.flatMap((l) => l.layers ? videoFrameLeafLayers(l.layers) : [l]);
+  return layers.flatMap((l) => [..._optionalChain([l, 'access', _27 => _27.transitionEffect, 'optionalAccess', _28 => _28.from]) ? videoFrameLeafLayers([l.transitionEffect.from]) : [], ...l.layers ? videoFrameLeafLayers(l.layers) : [l]]);
+}
+
+// src/video-editor/effects.ts
+function videoProjectEffects(project) {
+  const out = [];
+  for (const { track } of allVideoTracks(project)) for (const clip of track.clips) out.push(...videoClipEffectUses(clip));
+  return out;
+}
+var refFields = (r) => ({ effect: r.effect, ...r.name ? { name: r.name } : {}, ...r.provider ? { provider: r.provider } : {} });
+function videoClipEffectUses(clip) {
+  const out = [];
+  if (clip.type === "effect") out.push({ clip: clip.id, kind: "generator", ...refFields(clip), enabled: true });
+  if (_optionalChain([clip, 'access', _29 => _29.transition, 'optionalAccess', _30 => _30.type]) === "effect" && clip.transition.effect) out.push({ clip: clip.id, kind: "transition", ...refFields(clip.transition.effect), enabled: true });
+  for (const e of _nullishCoalesce(clip.effects, () => ( []))) out.push({ clip: clip.id, kind: "clip", instance: e.id, ...refFields(e), enabled: e.enabled !== false });
+  return out;
+}
+var videoLayersUseEffects = (layers) => layers.some((l) => !!(_optionalChain([l, 'access', _31 => _31.effects, 'optionalAccess', _32 => _32.length]) || l.generator || l.transitionEffect || l.layers && videoLayersUseEffects(l.layers)));
+var videoEffectFrameTime = (time, fps) => Math.floor(time * fps / 1e3 + 1e-6) * 1e3 / fps;
+var PLACEMENT = /* @__PURE__ */ new Set(["opacity", "rect", "rotation", "blend", "wipe", "iris", "grade", "track"]);
+var round = (_k, v) => typeof v === "number" ? Math.round(v * 100) / 100 : v;
+function videoEffectLayerKey(layer, width, height) {
+  const content = layer.transitionEffect ? layer : Object.fromEntries(Object.entries(layer).filter(([k]) => !PLACEMENT.has(k)));
+  return `${width}x${height}:${JSON.stringify(content, round)}`;
+}
+function mixEffectPixels(a, b, k) {
+  if (k >= 1) return b;
+  const out = _chunkIOXKXQNWcjs.createEffectPixels.call(void 0, a.width, a.height);
+  for (let i = 0; i < out.data.length; i++) out.data[i] = a.data[i] + (b.data[i] - a.data[i]) * k;
+  return out;
+}
+function overEffectPixels(base, top, opacity = 1) {
+  const out = _chunkIOXKXQNWcjs.createEffectPixels.call(void 0, base.width, base.height);
+  const o = out.data;
+  const b = base.data;
+  const t = top.data;
+  for (let i = 0; i < o.length; i += 4) {
+    const ta = t[i + 3] / 255 * opacity;
+    const ba = b[i + 3] / 255;
+    const a = ta + ba * (1 - ta);
+    o[i + 3] = Math.round(a * 255);
+    if (a <= 0) continue;
+    for (let c = 0; c < 3; c++) o[i + c] = (t[i + c] * ta + b[i + c] * ba * (1 - ta)) / a;
+  }
+  return out;
+}
+function defaultToImage(p) {
+  const data = new Uint8ClampedArray(p.data);
+  if (typeof ImageData === "undefined") return null;
+  const image = new ImageData(data, p.width, p.height);
+  if (typeof OffscreenCanvas !== "undefined") {
+    const c = new OffscreenCanvas(p.width, p.height);
+    _optionalChain([c, 'access', _33 => _33.getContext, 'call', _34 => _34("2d"), 'optionalAccess', _35 => _35.putImageData, 'call', _36 => _36(image, 0, 0)]);
+    return c;
+  }
+  if (typeof document !== "undefined") {
+    const c = document.createElement("canvas");
+    c.width = p.width;
+    c.height = p.height;
+    _optionalChain([c, 'access', _37 => _37.getContext, 'call', _38 => _38("2d"), 'optionalAccess', _39 => _39.putImageData, 'call', _40 => _40(image, 0, 0)]);
+    return c;
+  }
+  return null;
+}
+var VideoEffectsEngine = (_class2 = class {
+  
+  __init5() {this.cache = /* @__PURE__ */ new Map()}
+  __init6() {this.pending = /* @__PURE__ */ new Map()}
+  __init7() {this.failures = /* @__PURE__ */ new Map()}
+  __init8() {this.renderers = /* @__PURE__ */ new Map()}
+  __init9() {this.descriptions = /* @__PURE__ */ new Map()}
+  __init10() {this.listeners = /* @__PURE__ */ new Set()}
+  
+  
+  __init11() {this.generation = 0}
+  
+  constructor(options = {}) {;_class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);
+    this.slot = _nullishCoalesce(options.slot, () => ( new (0, _chunkIOXKXQNWcjs.EffectsSlot)()));
+    this.maxEntries = _nullishCoalesce(options.maxEntries, () => ( 120));
+    this.toImage = _nullishCoalesce(options.toImage, () => ( defaultToImage));
+    this.detach = this.slot.subscribe(() => {
+      this.reset();
+      this.notify();
+    });
+  }
+  get provider() {
+    return this.slot.provider;
+  }
+  /** True when a provider is registered, so effects can be drawn. */
+  get available() {
+    return !!this.slot.provider;
+  }
+  /** The drawable picture for `key`, or `undefined` when it is not rendered (yet). */
+  get(key) {
+    const e = this.cache.get(key);
+    if (!e) return void 0;
+    this.cache.delete(key);
+    this.cache.set(key, e);
+    if (e.image === void 0) e.image = this.toImage(e.pixels);
+    return e.image;
+  }
+  /** The rendered pixels for `key`. */
+  pixels(key) {
+    return _optionalChain([this, 'access', _41 => _41.cache, 'access', _42 => _42.get, 'call', _43 => _43(key), 'optionalAccess', _44 => _44.pixels]);
+  }
+  /** Why the render for `key` failed, if it did (it is not retried until the cache is cleared). */
+  failure(key) {
+    return this.failures.get(key);
+  }
+  /** Every failure so far, newest last. */
+  failuresList() {
+    return [...this.failures].map(([key, error]) => ({ key, error }));
+  }
+  /** Whether `key` is being rendered. */
+  isPending(key) {
+    return this.pending.has(key);
+  }
+  /**
+   * Starts rendering `job` into `key` unless it is cached, pending or failed. Returns true while
+   * the picture is on its way (so the frame is waiting for it).
+   */
+  request(key, job) {
+    if (this.cache.has(key)) return false;
+    if (this.pending.has(key)) return true;
+    if (this.failures.has(key) || !this.slot.provider) return false;
+    const generation = this.generation;
+    const run = this.run(job).then((pixels) => {
+      if (generation !== this.generation) return;
+      this.cache.set(key, { pixels });
+      while (this.cache.size > this.maxEntries) this.cache.delete(this.cache.keys().next().value);
+    }).catch((error) => {
+      if (generation !== this.generation) return;
+      this.failures.set(key, error instanceof Error ? error : new Error(String(error)));
+    }).finally(() => {
+      if (this.pending.get(key) === run) this.pending.delete(key);
+      if (generation === this.generation) this.notify();
+    });
+    this.pending.set(key, run);
+    return true;
+  }
+  /** Resolves when nothing is being rendered. */
+  async idle() {
+    while (this.pending.size) await Promise.all([...this.pending.values()]);
+  }
+  /** Renders a job now, without the cache. Rejects with the provider's error. */
+  async run(job) {
+    const provider = this.slot.require();
+    if (job.kind === "transition") {
+      const out = await this.render(provider, job.effect, job.from.width, job.from.height, { time: job.time, progress: job.progress, values: job.values, inputs: { from: job.from, to: job.to } });
+      return out;
+    }
+    let cur;
+    if (job.kind === "generator") cur = await this.render(provider, job.effect, job.width, job.height, { time: job.time, values: job.values });
+    else cur = job.input;
+    return this.stack(provider, cur, job.effects);
+  }
+  async stack(provider, input, effects) {
+    let cur = input;
+    for (const e of effects) {
+      const d = await this.describe(provider, e.effect);
+      if (d.inputs.some((i) => i.name === "source")) {
+        const out = await this.render(provider, e.effect, cur.width, cur.height, { time: e.time, values: e.values, inputs: { source: cur } });
+        cur = mixEffectPixels(cur, out, e.opacity);
+      } else {
+        const out = await this.render(provider, e.effect, cur.width, cur.height, { time: e.time, values: e.values });
+        cur = overEffectPixels(cur, out, e.opacity);
+      }
+    }
+    return cur;
+  }
+  /** The provider's description of an effect, fetched once. */
+  describe(provider, id) {
+    let d = this.descriptions.get(id);
+    if (!d) {
+      d = Promise.resolve().then(() => provider.describe(id));
+      d.catch(() => this.descriptions.delete(id));
+      this.descriptions.set(id, d);
+    }
+    return d;
+  }
+  /** Renders on a renderer kept per effect and size, one render at a time per renderer. */
+  render(provider, id, width, height, request) {
+    const k = `${id}@${width}x${height}`;
+    let r = this.renderers.get(k);
+    if (!r) {
+      const renderer = Promise.resolve().then(() => provider.createRenderer(id, { width, height }));
+      renderer.catch(() => this.renderers.delete(k));
+      r = { renderer, queue: Promise.resolve() };
+      this.renderers.set(k, r);
+    }
+    const entry = r;
+    const next = entry.queue.then(() => entry.renderer).then((renderer) => renderer.render(request));
+    entry.queue = next.catch(() => void 0);
+    return next;
+  }
+  /** Forgets every picture and failure and disposes the renderers (e.g. after the provider changes). */
+  reset() {
+    this.generation++;
+    this.cache.clear();
+    this.pending.clear();
+    this.failures.clear();
+    this.descriptions.clear();
+    for (const r of this.renderers.values()) r.renderer.then((x) => x.dispose(), () => {
+    });
+    this.renderers.clear();
+  }
+  subscribe(listener) {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+  notify() {
+    for (const l of [...this.listeners]) l();
+  }
+  destroy() {
+    this.reset();
+    this.detach();
+    this.listeners.clear();
+  }
+}, _class2);
+var VIDEO_EFFECT_PLACES = {
+  /** A clip's effect stack: filters change the picture, overlays draw over it. */
+  clip: ["filter", "overlay"],
+  transition: ["transition"],
+  /** An effect clip's picture. */
+  generator: ["generator", "title", "overlay"]
+};
+function checkVideoEffectPlace(d, place) {
+  const allowed = VIDEO_EFFECT_PLACES[place];
+  if (d.kind === "motion" || !d.uses.some((u) => allowed.includes(u))) {
+    const where = place === "clip" ? "on a clip" : place === "transition" ? "as a transition" : "as an effect clip";
+    const instead = d.uses.includes("transition") ? "set_video_effect_transition" : d.uses.some((u) => VIDEO_EFFECT_PLACES.generator.includes(u)) ? "add_video_effect_clip" : d.uses.some((u) => u === "filter") ? "apply_effect" : null;
+    throw new (0, _chunkIOXKXQNWcjs.EffectUnsupportedError)(
+      `"${d.id}" (${d.name}) is a ${d.uses.join(" / ")} effect and cannot be used ${where}, which takes ${allowed.join(" or ")} effects${instead ? `; use ${instead} instead` : ""}. search_effects with use "${allowed[0]}" lists ones that fit.`,
+      d.id
+    );
+  }
+}
+function checkVideoEffectValues(d, values, options = {}) {
+  const plain = {};
+  const errors = [];
+  for (const [k, v] of Object.entries(_nullishCoalesce(values, () => ( {})))) {
+    if (!isVideoKeyframes(v)) {
+      plain[k] = v;
+      continue;
+    }
+    const schema = d.controls.properties[k];
+    const type = _optionalChain([schema, 'optionalAccess', _45 => _45.type]);
+    if (!options.keyframes) errors.push({ path: `/${k}`, message: "cannot be keyframed here; give a plain value." });
+    else if (!schema) errors.push({ path: `/${k}`, message: `is not a control of "${d.id}"; its controls are ${Object.keys(d.controls.properties).join(", ") || "none"}.` });
+    else if (type !== "number" && type !== "integer") errors.push({ path: `/${k}`, message: "only number controls can be keyframed." });
+    else for (const [i, key] of v.keys.entries()) for (const e of _chunkRIWPYSKUcjs.validateJsonSchema.call(void 0, key.v, schema)) errors.push({ path: `/${k}/keys/${i}/v`, message: e.message });
+  }
+  for (const e of _chunkIOXKXQNWcjs.effectValueErrors.call(void 0, d, plain)) {
+    const name = e.path.split("/")[1];
+    const about = name && _optionalChain([d, 'access', _46 => _46.controls, 'access', _47 => _47.properties, 'access', _48 => _48[name], 'optionalAccess', _49 => _49.description]);
+    errors.push(about ? { path: e.path, message: `${e.message} (${about})` } : e);
+  }
+  if (errors.length) throw new (0, _chunkIOXKXQNWcjs.EffectControlError)(d.id, errors);
+  return { ..._nullishCoalesce(options.base, () => ( d.defaults)), ..._nullishCoalesce(values, () => ( {})) };
 }
 
 // src/video-editor/render.ts
@@ -1127,7 +1422,7 @@ function videoWipeRect(rect, wipe) {
 function videoFrameToSvg(frame, options = {}, assets = []) {
   const defs = [];
   const posters = new Map(assets.map((a) => [a.id, a.poster]));
-  const draw = (layers, prefix) => layers.map((layer, index) => {
+  const draw = (layers, prefix) => videoLayersWithoutTransitionEffects(layers).map((layer, index) => {
     const i = `${prefix}${index}`;
     const { rect } = layer;
     const attrs = [];
@@ -1137,7 +1432,7 @@ function videoFrameToSvg(frame, options = {}, assets = []) {
     if (layer.layers) style.push("isolation:isolate");
     if (style.length) attrs.push(`style="${style.join(";")}"`);
     if (layer.grade) {
-      defs.push(videoGradeSvgFilter(`g${i}`, layer.grade, layer.grade.lut ? _optionalChain([options, 'access', _27 => _27.lutFor, 'optionalCall', _28 => _28(layer.grade.lut.src)]) : null));
+      defs.push(videoGradeSvgFilter(`g${i}`, layer.grade, layer.grade.lut ? _optionalChain([options, 'access', _50 => _50.lutFor, 'optionalCall', _51 => _51(layer.grade.lut.src)]) : null));
       attrs.push(`filter="url(#g${i})"`);
     }
     if (layer.rotation) attrs.push(`transform="rotate(${n(layer.rotation)} ${n(rect.x + rect.width / 2)} ${n(rect.y + rect.height / 2)})"`);
@@ -1168,7 +1463,7 @@ function videoFrameToSvg(frame, options = {}, assets = []) {
       const href = options.imageFor ? options.imageFor(layer, frame) : layer.assetKind === "image" ? _nullishCoalesce(layer.src, () => ( null)) : _nullishCoalesce(posters.get(_nullishCoalesce(layer.asset, () => ( ""))), () => ( null));
       if (href) inner = `<image href="${esc(href)}" ${box} preserveAspectRatio="none"/>`;
       else {
-        const label = `${_nullishCoalesce(layer.asset, () => ( layer.clip))} \xB7 ${formatVideoTimecode(_nullishCoalesce(layer.sourceTime, () => ( 0)), _nullishCoalesce(options.fps, () => ( 30)))}`;
+        const label = layer.generator ? `Effect: ${_nullishCoalesce(layer.generator.name, () => ( layer.generator.effect))}` : `${_nullishCoalesce(layer.asset, () => ( layer.clip))} \xB7 ${formatVideoTimecode(_nullishCoalesce(layer.sourceTime, () => ( 0)), _nullishCoalesce(options.fps, () => ( 30)))}`;
         const size = Math.max(10, Math.min(rect.height / 8, rect.width / Math.max(8, label.length * 0.6)));
         inner = `<rect ${box} fill="#334155" stroke="#94a3b8" stroke-width="2"/><text x="${n(rect.x + rect.width / 2)}" y="${n(rect.y + rect.height / 2)}" text-anchor="middle" dominant-baseline="central" font-family="sans-serif" font-size="${n(size)}" fill="#e2e8f0">${esc(label)}</text>`;
       }
@@ -1256,6 +1551,14 @@ function paintVideoLayer(ctx, frame, layer, sourceFor, options) {
       ctx.strokeStyle = "#94a3b8";
       ctx.lineWidth = 2;
       ctx.strokeRect(rect.x, rect.y, rect.width, rect.height);
+      if (layer.generator) {
+        const label = `Effect: ${_nullishCoalesce(layer.generator.name, () => ( layer.generator.effect))}`;
+        ctx.font = `600 ${Math.max(12, Math.min(rect.height / 10, rect.width / Math.max(8, label.length * 0.6)))}px sans-serif`;
+        ctx.textAlign = "center";
+        ctx.textBaseline = "middle";
+        ctx.fillStyle = "#e2e8f0";
+        ctx.fillText(label, rect.x + rect.width / 2, rect.y + rect.height / 2);
+      }
     }
   }
 }
@@ -1265,18 +1568,118 @@ function drawVideoFrame(ctx, frame, sourceFor, scale = 1, options = {}) {
   ctx.globalAlpha = 1;
   ctx.fillStyle = frame.background;
   ctx.fillRect(0, 0, frame.width, frame.height);
-  drawVideoLayers(ctx, frame, frame.layers, sourceFor, scale, options, 0);
+  const state = { missing: 0, waiting: 0 };
+  const counted = (layer) => {
+    const source = sourceFor(layer);
+    if (!source && layer.type === "media") state.missing++;
+    return source;
+  };
+  drawVideoLayers(ctx, frame, frame.layers, counted, scale, options, 0, state);
   ctx.restore();
 }
-function drawVideoLayers(ctx, frame, layers, sourceFor, scale, options, depth) {
+var unplaced = (layer) => {
+  const { rotation: _r, wipe: _w, iris: _i, grade: _g, blend: _b, effects: _e, transitionEffect: _t, ...rest } = layer;
+  return { ...rest, opacity: 1, rotation: 0 };
+};
+var readPixels = (s, width, height) => {
+  const img = s.ctx.getImageData(0, 0, width, height);
+  return { width, height, data: img.data };
+};
+function begin(s, width, height, scale, dx = 0, dy = 0) {
+  const g = s.ctx;
+  g.save();
+  g.setTransform(1, 0, 0, 1, 0, 0);
+  g.clearRect(0, 0, width, height);
+  g.setTransform(scale, 0, 0, scale, dx, dy);
+  g.globalAlpha = 1;
+  g.globalCompositeOperation = "source-over";
+  return g;
+}
+function effectPicture(frame, layer, source, scale, options, depth, state) {
+  const engine = options.effects;
+  if (!_optionalChain([engine, 'optionalAccess', _52 => _52.available])) return null;
+  const { rect } = layer;
+  const w = Math.max(1, Math.round(rect.width * scale));
+  const h = Math.max(1, Math.round(rect.height * scale));
+  const key = videoEffectLayerKey(layer, w, h);
+  const hit = engine.get(key);
+  if (hit !== void 0 || engine.failure(key)) return _nullishCoalesce(hit, () => ( null));
+  let job;
+  if (layer.generator) job = { kind: "generator", width: w, height: h, ...layer.generator, effects: _nullishCoalesce(layer.effects, () => ( [])) };
+  else {
+    const s = _optionalChain([options, 'access', _53 => _53.scratch, 'optionalCall', _54 => _54(w, h, 1e3 + 4 * depth)]);
+    if (!s) return null;
+    const missing = state.missing;
+    const g = begin(s, w, h, scale, -rect.x * scale, -rect.y * scale);
+    const bare = unplaced(layer);
+    paintVideoLayer(g, frame, bare, (l) => source(l === bare ? layer : l), options);
+    g.restore();
+    if (state.missing !== missing) return null;
+    job = { kind: "stack", input: readPixels(s, w, h), effects: _nullishCoalesce(layer.effects, () => ( [])) };
+  }
+  if (engine.request(key, job)) {
+    state.waiting++;
+    _optionalChain([options, 'access', _55 => _55.onEffectWaiting, 'optionalCall', _56 => _56()]);
+  }
+  return null;
+}
+function drawEffectTransition(ctx, frame, layer, sourceFor, scale, options, depth, state) {
+  const engine = options.effects;
+  const t = layer.transitionEffect;
+  if (!_optionalChain([engine, 'optionalAccess', _57 => _57.available])) return false;
+  const cw = Math.max(1, Math.round(frame.width * scale));
+  const ch = Math.max(1, Math.round(frame.height * scale));
+  const key = videoEffectLayerKey(layer, cw, ch);
+  const hit = engine.get(key);
+  if (hit) {
+    ctx.save();
+    ctx.setTransform(1, 0, 0, 1, 0, 0);
+    ctx.globalAlpha = 1;
+    ctx.globalCompositeOperation = "source-over";
+    ctx.drawImage(hit, 0, 0, cw, ch);
+    ctx.restore();
+    return true;
+  }
+  if (hit === null || engine.failure(key) || engine.isPending(key)) {
+    if (engine.isPending(key)) {
+      state.waiting++;
+      _optionalChain([options, 'access', _58 => _58.onEffectWaiting, 'optionalCall', _59 => _59()]);
+    }
+    return false;
+  }
+  const a = _optionalChain([options, 'access', _60 => _60.scratch, 'optionalCall', _61 => _61(cw, ch, 1e3 + 4 * depth + 1)]);
+  const b = _optionalChain([options, 'access', _62 => _62.scratch, 'optionalCall', _63 => _63(cw, ch, 1e3 + 4 * depth + 2)]);
+  if (!a || !b) return false;
+  const before = { ...state };
+  const ga = begin(a, cw, ch, scale);
+  drawVideoLayers(ga, frame, t.from ? [t.from] : [], sourceFor, scale, options, depth + 1, state);
+  ga.restore();
+  const { transitionEffect: _t, ...incoming } = layer;
+  const gb = begin(b, cw, ch, scale);
+  drawVideoLayers(gb, frame, [incoming], sourceFor, scale, options, depth + 1, state);
+  gb.restore();
+  if (state.missing !== before.missing || state.waiting !== before.waiting) return false;
+  const job = { kind: "transition", effect: t.effect, values: t.values, progress: t.progress, time: t.time, from: readPixels(a, cw, ch), to: readPixels(b, cw, ch) };
+  if (engine.request(key, job)) {
+    state.waiting++;
+    _optionalChain([options, 'access', _64 => _64.onEffectWaiting, 'optionalCall', _65 => _65()]);
+  }
+  return false;
+}
+function drawVideoLayers(ctx, frame, layers, sourceFor, scale, options, depth, state) {
   const cw = Math.max(1, Math.round(frame.width * scale));
   const ch = Math.max(1, Math.round(frame.height * scale));
-  for (const layer of layers) {
+  for (const original of layers) {
+    let layer = original;
+    if (layer.transitionEffect) {
+      if (!drawEffectTransition(ctx, frame, layer, sourceFor, scale, options, depth, state)) drawVideoLayers(ctx, frame, videoLayersWithoutTransitionEffects([layer]), sourceFor, scale, options, depth, state);
+      continue;
+    }
     let source = sourceFor;
     if (layer.layers) {
-      const group = _optionalChain([options, 'access', _29 => _29.scratch, 'optionalCall', _30 => _30(cw, ch, 2 * depth)]);
+      const group = _optionalChain([options, 'access', _66 => _66.scratch, 'optionalCall', _67 => _67(cw, ch, 2 * depth)]);
       if (!group) {
-        drawVideoLayers(ctx, frame, layer.layers, sourceFor, scale, options, depth + 1);
+        drawVideoLayers(ctx, frame, layer.layers, sourceFor, scale, options, depth + 1, state);
         continue;
       }
       const g = group.ctx;
@@ -1286,13 +1689,23 @@ function drawVideoLayers(ctx, frame, layers, sourceFor, scale, options, depth) {
       g.setTransform(scale, 0, 0, scale, 0, 0);
       g.globalAlpha = 1;
       g.globalCompositeOperation = "source-over";
-      drawVideoLayers(g, frame, layer.layers, sourceFor, scale, options, depth + 1);
+      drawVideoLayers(g, frame, layer.layers, sourceFor, scale, options, depth + 1, state);
       g.restore();
-      source = (l) => l === layer ? group.canvas : sourceFor(l);
+      const self = layer;
+      source = (l) => l === self ? group.canvas : sourceFor(l);
+    }
+    if (_optionalChain([layer, 'access', _68 => _68.effects, 'optionalAccess', _69 => _69.length]) || layer.generator) {
+      const picture = effectPicture(frame, layer, source, scale, options, depth, state);
+      if (picture) {
+        const { layers: _l, text: _t, color: _c, generator: _g, effects: _e, ...rest } = layer;
+        const drawn = { ...rest, type: "media" };
+        layer = drawn;
+        source = (l) => l === drawn ? picture : sourceFor(l);
+      }
     }
-    const setting = _optionalChain([layer, 'access', _31 => _31.grade, 'optionalAccess', _32 => _32.lut]);
-    const lut = setting ? _optionalChain([options, 'access', _33 => _33.lutFor, 'optionalCall', _34 => _34(setting.src)]) : null;
-    const scratch = lut ? _optionalChain([options, 'access', _35 => _35.scratch, 'optionalCall', _36 => _36(cw, ch, 2 * depth + 1)]) : null;
+    const setting = _optionalChain([layer, 'access', _70 => _70.grade, 'optionalAccess', _71 => _71.lut]);
+    const lut = setting ? _optionalChain([options, 'access', _72 => _72.lutFor, 'optionalCall', _73 => _73(setting.src)]) : null;
+    const scratch = lut ? _optionalChain([options, 'access', _74 => _74.scratch, 'optionalCall', _75 => _75(cw, ch, 2 * depth + 1)]) : null;
     ctx.save();
     ctx.setTransform(scale, 0, 0, scale, 0, 0);
     if (lut && scratch) {
@@ -1320,9 +1733,44 @@ function drawVideoLayers(ctx, frame, layers, sourceFor, scale, options, depth) {
     ctx.restore();
   }
 }
+async function renderVideoFrameExact(ctx, project, time, sourceFor, options = {}) {
+  const frame = videoFrameAt(project, videoEffectFrameTime(time, project.fps));
+  const engine = options.effects;
+  const before = new Set(_nullishCoalesce(_optionalChain([engine, 'optionalAccess', _76 => _76.failuresList, 'call', _77 => _77(), 'access', _78 => _78.map, 'call', _79 => _79((f) => f.error)]), () => ( [])));
+  let complete = false;
+  for (let pass = 0; pass < (_nullishCoalesce(options.maxPasses, () => ( 8))); pass++) {
+    let waiting = 0;
+    let missing = 0;
+    drawVideoFrame(
+      ctx,
+      frame,
+      (layer) => {
+        if (layer.type === "effect") return null;
+        const s = sourceFor(layer);
+        if (!s) missing++;
+        return s;
+      },
+      _nullishCoalesce(options.scale, () => ( 1)),
+      {
+        ...options,
+        onEffectWaiting: () => {
+          waiting++;
+          _optionalChain([options, 'access', _80 => _80.onEffectWaiting, 'optionalCall', _81 => _81()]);
+        }
+      }
+    );
+    if (!waiting) {
+      complete = missing === 0;
+      break;
+    }
+    await engine.idle();
+  }
+  const failures = (_nullishCoalesce(_optionalChain([engine, 'optionalAccess', _82 => _82.failuresList, 'call', _83 => _83()]), () => ( []))).map((f) => f.error).filter((e) => !before.has(e));
+  return { frame, complete: complete && !failures.length, failures };
+}
 
 // src/video-editor/export.ts
-var reelName = (asset) => (_nullishCoalesce(_nullishCoalesce(_optionalChain([asset, 'optionalAccess', _37 => _37.name]), () => ( _optionalChain([asset, 'optionalAccess', _38 => _38.id]))), () => ( "AX"))).replace(/\.[a-z0-9]+$/i, "").replace(/[^A-Za-z0-9]/g, "").toUpperCase().slice(0, 8) || "AX";
+var reelName = (asset) => (_nullishCoalesce(_nullishCoalesce(_optionalChain([asset, 'optionalAccess', _84 => _84.name]), () => ( _optionalChain([asset, 'optionalAccess', _85 => _85.id]))), () => ( "AX"))).replace(/\.[a-z0-9]+$/i, "").replace(/[^A-Za-z0-9]/g, "").toUpperCase().slice(0, 8) || "AX";
 function toVideoEdl(project, options = {}) {
   const track = options.track !== void 0 ? project.tracks.find((t) => t.id === options.track) : [...project.tracks].reverse().find((t) => t.kind === "video");
   if (!track) throw new Error(options.track !== void 0 ? `There is no track "${options.track}".` : "The project has no video track.");
@@ -1357,14 +1805,20 @@ function toVideoEdl(project, options = {}) {
       lines.push(row(n2, reel, `${t.type === "crossfade" || t.type === "dip" ? "D" : "W001"}    ${frames}`, sourceAt(clip, recIn), sourceAt(clip, recOut), recIn, recOut));
     } else lines.push(row(n2, reel, "C", sourceAt(clip, recIn), sourceAt(clip, recOut), recIn, recOut));
     if (clip.type === "media" && videoClipSpeed(clip) !== 1) lines.push(`M2   ${reel.padEnd(8)} ${(videoClipSpeed(clip) * fps).toFixed(1).padStart(6)}      ${tc(sourceAt(clip, recIn))}`);
-    if (clip.type === "media") lines.push(`* FROM CLIP NAME: ${_nullishCoalesce(_nullishCoalesce(_optionalChain([asset, 'optionalAccess', _39 => _39.name]), () => ( _optionalChain([asset, 'optionalAccess', _40 => _40.src]))), () => ( clip.asset))}`);
+    if (clip.type === "media") lines.push(`* FROM CLIP NAME: ${_nullishCoalesce(_nullishCoalesce(_optionalChain([asset, 'optionalAccess', _86 => _86.name]), () => ( _optionalChain([asset, 'optionalAccess', _87 => _87.src]))), () => ( clip.asset))}`);
     if (clip.type === "text") lines.push(`* TITLE: ${clip.text.replace(/\n/g, " ")}`);
     if (clip.type === "color") lines.push(`* COLOR: ${clip.color}`);
+    if (clip.type === "effect") lines.push(`* EFFECT CLIP: ${_nullishCoalesce(clip.name, () => ( clip.effect))} (${clip.effect})`);
+    if (_optionalChain([clip, 'access', _88 => _88.transition, 'optionalAccess', _89 => _89.type]) === "effect") lines.push(`* EFFECT TRANSITION: ${_nullishCoalesce(_optionalChain([clip, 'access', _90 => _90.transition, 'access', _91 => _91.effect, 'optionalAccess', _92 => _92.name]), () => ( _optionalChain([clip, 'access', _93 => _93.transition, 'access', _94 => _94.effect, 'optionalAccess', _95 => _95.effect])))}`);
+    for (const e of _nullishCoalesce(clip.effects, () => ( []))) if (e.enabled !== false) lines.push(`* EFFECT: ${_nullishCoalesce(e.name, () => ( e.effect))} (${e.effect})`);
     if (clip.type === "sequence") lines.push(`* COMPOUND CLIP: ${_nullishCoalesce(clip.name, () => ( clip.sequence))} (sequence ${clip.sequence} from ${tc(_nullishCoalesce(clip.in, () => ( 0)))}, not flattened)`);
     lines.push("");
   }
   return lines.join("\n");
 }
+function videoFfmpegUnsupportedEffects(project) {
+  return allVideoTracks(project).filter(({ track }) => track.kind === "video" && !track.hidden).flatMap(({ track }) => track.clips.flatMap(videoClipEffectUses)).filter((u) => u.enabled);
+}
 function loudnormFilter(target = {}, measure = false) {
   const I = _nullishCoalesce(target.integrated, () => ( -14));
   const TP = _nullishCoalesce(target.truePeak, () => ( -1));
@@ -1447,7 +1901,21 @@ function buildFfmpeg(project, options, measure) {
   const H = even(project.height);
   const fps = project.fps;
   const inputs = [];
-  const graph = measure ? [] : [`color=c=${color(_nullishCoalesce(project.background, () => ( "#000000")))}:s=${W}x${H}:r=${fps}:d=${sec(D)},format=yuva420p[base]`];
+  const frames = measure ? void 0 : options.frames;
+  if (!measure && !frames) {
+    const effects = videoFfmpegUnsupportedEffects(project);
+    if (effects.length) {
+      const list = effects.slice(0, 5).map((u) => `${u.kind === "generator" ? "effect clip" : u.kind === "transition" ? "the transition into" : "an effect on"} "${u.clip}" (${_nullishCoalesce(u.name, () => ( u.effect))})`).join(", ");
+      throw new Error(
+        `ffmpeg cannot draw provider effects, and this project uses ${effects.length}: ${list}${effects.length > 5 ? ", ..." : ""}. Render the picture frame by frame with renderVideoFrameExact (the preview's drawing, with the effects provider) to PNGs or raw RGBA and pass them as frames: { input: "frames/%06d.png" } (or { input: "pipe:0", format: "rawvideo" }); ffmpeg still mixes the sound. Or turn the effects off.`
+      );
+    }
+  }
+  if (frames) {
+    if (frames.format === "rawvideo") inputs.push(["-f", "rawvideo", "-pix_fmt", "rgba", "-s", `${W}x${H}`, "-framerate", String(fps), "-i", frames.input]);
+    else inputs.push(["-framerate", String(fps), "-i", frames.input]);
+  }
+  const graph = measure || frames ? [] : [`color=c=${color(_nullishCoalesce(project.background, () => ( "#000000")))}:s=${W}x${H}:r=${fps}:d=${sec(D)},format=yuva420p[base]`];
   let usesDrawtext = false;
   const animated = /* @__PURE__ */ new Set();
   const ramped = /* @__PURE__ */ new Set();
@@ -1565,13 +2033,13 @@ function buildFfmpeg(project, options, measure) {
         }
         let index;
         if (shows && asset && asset.kind !== "audio") index = input(clip, asset, lead, tail);
-        const audible = clip.type === "sequence" ? !!_optionalChain([compound, 'optionalAccess', _41 => _41.sound]) : videoAssetHasSound(asset);
+        const audible = clip.type === "sequence" ? !!_optionalChain([compound, 'optionalAccess', _96 => _96.sound]) : videoAssetHasSound(asset);
         if (scope.sound && audible && (clip.type === "media" || clip.type === "sequence") && !clip.muted && !track.muted) {
           const trackGain = _nullishCoalesce(track.volume, () => ( 1));
           const volume = isVideoKeyframes(clip.volume) ? `volume='${trackGain}*(${expr(clip.volume, `(t*1000${lead ? `-${Math.round(lead)}` : ""})`, 1, "volume")})':eval=frame` : `volume=${(_nullishCoalesce(clip.volume, () => ( 1))) * trackGain}`;
           const ramp = clip.type === "media" ? clip.timeRemap : void 0;
           const ai = compound ? -1 : _nullishCoalesce(index, () => ( input(clip, asset, lead, tail)));
-          let source2 = _nullishCoalesce(_optionalChain([compound, 'optionalAccess', _42 => _42.sound]), () => ( `[${ai}:a]`));
+          let source2 = _nullishCoalesce(_optionalChain([compound, 'optionalAccess', _97 => _97.sound]), () => ( `[${ai}:a]`));
           if (ramp) {
             source2 = `[r${ak}]`;
             graph.push(...rampedSound(ramp, `${ai}:a`, source2, lead, clip.duration + tail));
@@ -1585,7 +2053,7 @@ function buildFfmpeg(project, options, measure) {
           if (lead) chain2.push(`afade=t=in:st=0:d=${sec(2 * lead)}${inCurve}`);
           if (tail) chain2.push(`afade=t=out:st=${sec(span - 2 * tail)}:d=${sec(2 * tail)}${outCurve}`);
           if (before2 && clip.transition.type === "dip") chain2.push(`afade=t=in:st=0:d=${sec(clip.transition.duration / 2)}${inCurve}`);
-          if (_optionalChain([next2, 'optionalAccess', _43 => _43.transition, 'access', _44 => _44.type]) === "dip") chain2.push(`afade=t=out:st=${sec(span - next2.transition.duration / 2)}:d=${sec(next2.transition.duration / 2)}${outCurve}`);
+          if (_optionalChain([next2, 'optionalAccess', _98 => _98.transition, 'access', _99 => _99.type]) === "dip") chain2.push(`afade=t=out:st=${sec(span - next2.transition.duration / 2)}:d=${sec(next2.transition.duration / 2)}${outCurve}`);
           if (clip.fadeIn) chain2.push(`afade=t=in:st=${sec(lead)}:d=${sec(clip.fadeIn)}${afadeCurve(clip.fadeInCurve)}`);
           if (clip.fadeOut) chain2.push(`afade=t=out:st=${sec(lead + clip.duration - clip.fadeOut)}:d=${sec(clip.fadeOut)}${afadeCurve(clip.fadeOutCurve)}`);
           chain2.push(`adelay=${Math.round(t0)}:all=1`);
@@ -1598,7 +2066,7 @@ function buildFfmpeg(project, options, measure) {
         const onTimeline = `(t*1000-${Math.round(clip.start)})`;
         const onChain = (v) => `(${v}*1000${lead ? `-${Math.round(lead)}` : ""})`;
         const tf = clip.transform;
-        const moving = VIDEO_TRANSFORM_PROPERTIES.some((p) => isVideoKeyframes(_optionalChain([tf, 'optionalAccess', _45 => _45[p]])));
+        const moving = VIDEO_TRANSFORM_PROPERTIES.some((p) => isVideoKeyframes(_optionalChain([tf, 'optionalAccess', _100 => _100[p]])));
         if (clip.type === "text" && options.titleImage) {
           inputs.push(["-loop", "1", "-framerate", String(fps), "-t", sec(span), "-i", options.titleImage(moving ? { ...clip, transform: void 0 } : clip, { width: project.width, height: project.height })]);
           index = inputs.length - 1;
@@ -1608,7 +2076,7 @@ function buildFfmpeg(project, options, measure) {
           const op = isVideoKeyframes(clip.opacity) ? `clip(${expr(clip.opacity, onTimeline, 1, "opacity")},0,1)` : String(_nullishCoalesce(clip.opacity, () => ( 1)));
           const alpha = [op, clip.fadeIn ? `min(1,(t-${sec(clip.start)})/${sec(clip.fadeIn)})` : "", clip.fadeOut ? `min(1,(${sec(end)}-t)/${sec(clip.fadeOut)})` : ""].filter(Boolean).join("*");
           const coord = (axis) => {
-            const v = _optionalChain([tf, 'optionalAccess', _46 => _46[axis]]);
+            const v = _optionalChain([tf, 'optionalAccess', _101 => _101[axis]]);
             const base2 = `(${axis === "x" ? "w-text_w" : "h-text_h"})/2`;
             return isVideoKeyframes(v) ? `${axis}='${base2}+(${expr(v, onTimeline, 0, "position")})'` : `${axis}=${base2}+${_nullishCoalesce(v, () => ( 0))}`;
           };
@@ -1616,7 +2084,7 @@ function buildFfmpeg(project, options, measure) {
           const opts = [
             `text=${ffmpegFilterValue(clip.text)}`,
             options.fontFile ? `fontfile=${ffmpegFilterValue(options.fontFile)}` : `font=${ffmpegFilterValue(_nullishCoalesce(clip.fontFamily, () => ( "sans-serif")))}`,
-            isVideoKeyframes(_optionalChain([tf, 'optionalAccess', _47 => _47.scale])) ? `fontsize='${fontSize}*(${expr(tf.scale, onTimeline, 1, "scale")})'` : `fontsize=${Math.round(fontSize * (_nullishCoalesce(_optionalChain([tf, 'optionalAccess', _48 => _48.scale]), () => ( 1))))}`,
+            isVideoKeyframes(_optionalChain([tf, 'optionalAccess', _102 => _102.scale])) ? `fontsize='${fontSize}*(${expr(tf.scale, onTimeline, 1, "scale")})'` : `fontsize=${Math.round(fontSize * (_nullishCoalesce(_optionalChain([tf, 'optionalAccess', _103 => _103.scale]), () => ( 1))))}`,
             `fontcolor=${color(_nullishCoalesce(clip.color, () => ( "#ffffff")))}`,
             coord("x"),
             coord("y"),
@@ -1624,8 +2092,8 @@ function buildFfmpeg(project, options, measure) {
             ...clip.background ? ["box=1", `boxcolor=${color(clip.background)}`, `boxborderw=${Math.round((_nullishCoalesce(clip.fontSize, () => ( 64))) / 2)}`] : [],
             `enable='between(t,${sec(clip.start)},${sec(end)})'`
           ];
-          if (_optionalChain([tf, 'optionalAccess', _49 => _49.rotation])) notes.push(`Title "${clip.id}" is drawn without its rotation (drawtext cannot rotate).`);
-          if (videoGradeFfmpegFilters(clip.grade).length || normalizeVideoGradeLut(_optionalChain([clip, 'access', _50 => _50.grade, 'optionalAccess', _51 => _51.lut]))) notes.push(`Title "${clip.id}" is drawn without its grade (drawtext draws straight onto the picture); pass titleImage to grade titles.`);
+          if (_optionalChain([tf, 'optionalAccess', _104 => _104.rotation])) notes.push(`Title "${clip.id}" is drawn without its rotation (drawtext cannot rotate).`);
+          if (videoGradeFfmpegFilters(clip.grade).length || normalizeVideoGradeLut(_optionalChain([clip, 'access', _105 => _105.grade, 'optionalAccess', _106 => _106.lut]))) notes.push(`Title "${clip.id}" is drawn without its grade (drawtext draws straight onto the picture); pass titleImage to grade titles.`);
           if (clip.blend && clip.blend !== "normal") notes.push(`Title "${clip.id}" is drawn without its blend mode (drawtext draws straight onto the picture); pass titleImage to blend titles.`);
           graph.push(`[${cur2}]drawtext=${opts.join(":")}[${next}]`);
           cur2 = next;
@@ -1638,7 +2106,7 @@ function buildFfmpeg(project, options, measure) {
         const chain = [];
         let source;
         if (clip.type === "color") source = `color=c=${color(clip.color)}:s=${even(rect.width)}x${even(rect.height)}:r=${fps}:d=${sec(span)}`;
-        else if (_optionalChain([compound, 'optionalAccess', _52 => _52.picture])) {
+        else if (_optionalChain([compound, 'optionalAccess', _107 => _107.picture])) {
           source = compound.picture;
           chain.push(`scale=${even(rect.width)}:${even(rect.height)}`);
         } else {
@@ -1648,7 +2116,7 @@ function buildFfmpeg(project, options, measure) {
         }
         const grade = videoGradeFfmpegFilters(clip.grade);
         if (grade.length) chain.push("format=rgba", ...grade);
-        const lut = normalizeVideoGradeLut(_optionalChain([clip, 'access', _53 => _53.grade, 'optionalAccess', _54 => _54.lut]));
+        const lut = normalizeVideoGradeLut(_optionalChain([clip, 'access', _108 => _108.grade, 'optionalAccess', _109 => _109.lut]));
         if (lut) {
           chain.push("format=gbrap");
           const path = options.resolveLut ? options.resolveLut(lut.src) : lut.src;
@@ -1679,10 +2147,10 @@ function buildFfmpeg(project, options, measure) {
           const r = videoIrisRadius({ width: W, height: H }, 1);
           chain.push(`geq=lum='lum(X,Y)':cb='cb(X,Y)':cr='cr(X,Y)':a='if(lte(hypot(X+${Math.round(rect.x)}-${W / 2},Y+${Math.round(rect.y)}-${H / 2}),${Math.round(r)}*min(1,T/${sec(2 * lead)})),alpha(X,Y),0)'`);
         }
-        const rotation = _optionalChain([placed, 'optionalAccess', _55 => _55.rotation]);
+        const rotation = _optionalChain([placed, 'optionalAccess', _110 => _110.rotation]);
         if (isVideoKeyframes(rotation)) chain.push(`rotate=a='(${expr(rotation, onChain("t"), 0, "rotation")})*PI/180':c=black@0:ow='hypot(iw,ih)':oh=ow`);
         else if (rotation) chain.push(`rotate=${rotation}*PI/180:c=black@0:ow=rotw(${rotation}*PI/180):oh=roth(${rotation}*PI/180)`);
-        if (isVideoKeyframes(_optionalChain([placed, 'optionalAccess', _56 => _56.scale]))) {
+        if (isVideoKeyframes(_optionalChain([placed, 'optionalAccess', _111 => _111.scale]))) {
           const s = expr(placed.scale, onChain("t"), 1, "scale");
           chain.push(`scale=w='max(2,trunc(iw*(${s})/2)*2)':h='max(2,trunc(ih*(${s})/2)*2)':eval=frame`);
         }
@@ -1701,9 +2169,9 @@ function buildFfmpeg(project, options, measure) {
         const into = lead ? clip.transition.type : void 0;
         if (into === "push" || into === "slide") shiftBy(clip.transition.direction, clip.start - lead, 2 * lead, true);
         const after = tail ? sortedVideoClips(track).find((c) => c !== clip && Math.abs(c.start - end) < 0.5 && c.transition) : void 0;
-        if (_optionalChain([after, 'optionalAccess', _57 => _57.transition, 'access', _58 => _58.type]) === "push") shiftBy(after.transition.direction, end - tail, 2 * tail, false);
+        if (_optionalChain([after, 'optionalAccess', _112 => _112.transition, 'access', _113 => _113.type]) === "push") shiftBy(after.transition.direction, end - tail, 2 * tail, false);
         const at = (axis, c) => {
-          const v = _optionalChain([placed, 'optionalAccess', _59 => _59[axis]]);
+          const v = _optionalChain([placed, 'optionalAccess', _114 => _114[axis]]);
           const extra = shifts[axis].map((s) => `+${s}`).join("");
           return isVideoKeyframes(v) ? `${axis}='${Math.round(axis === "x" ? project.width / 2 : project.height / 2)}+(${expr(v, onTimeline, 0, "position")})-${axis === "x" ? "w" : "h"}/2${extra}'` : `${axis}='${Math.round(c)}-${axis === "x" ? "w" : "h"}/2${extra}'`;
         };
@@ -1739,17 +2207,18 @@ function buildFfmpeg(project, options, measure) {
     }
     return { video: cur2, audio: sounds };
   };
-  const top = compose(project.tracks, measure ? null : "base", D, { within: [], picture: !measure, sound: true });
+  const top = compose(project.tracks, measure || frames ? null : "base", D, { within: [], picture: !measure && !frames, sound: true });
   const audio = top.audio;
   const cur = top.video;
-  if (!measure) graph.push(`[${cur}]format=yuv420p[vout]`);
+  if (frames) graph.push(`[0:v]scale=${W}:${H},format=yuv420p,trim=duration=${sec(D)}[vout]`);
+  else if (!measure) graph.push(`[${cur}]format=yuv420p[vout]`);
   if (measure && !audio.length) throw new Error("Nothing on the timeline makes a sound, so there is no loudness to measure.");
   const loudness = options.loudness || measure ? `,${loudnormFilter(options.loudness, measure)}` : "";
   if (audio.length) graph.push(`${audio.join("")}amix=inputs=${audio.length}:normalize=0:duration=longest,apad,atrim=0:${sec(D)}${loudness}[aout]`);
   if (options.loudness && !audio.length) notes.push("Nothing makes a sound, so there was no loudness to normalise.");
   else if (options.loudness && !options.loudness.measured)
     notes.push("Loudness is normalised in one pass, which adjusts the level as it goes; for a fixed gain that keeps the dynamics, run toVideoLoudnessMeasure first and pass its result as loudness.measured.");
-  if (allVideoTracks(project).some(({ track: t }) => t.clips.some((c) => c.type === "media" && _optionalChain([assets, 'access', _60 => _60.get, 'call', _61 => _61(c.asset), 'optionalAccess', _62 => _62.kind]) === "video" && _optionalChain([assets, 'access', _63 => _63.get, 'call', _64 => _64(c.asset), 'optionalAccess', _65 => _65.hasAudio]) === void 0)))
+  if (allVideoTracks(project).some(({ track: t }) => t.clips.some((c) => c.type === "media" && _optionalChain([assets, 'access', _115 => _115.get, 'call', _116 => _116(c.asset), 'optionalAccess', _117 => _117.kind]) === "video" && _optionalChain([assets, 'access', _118 => _118.get, 'call', _119 => _119(c.asset), 'optionalAccess', _120 => _120.hasAudio]) === void 0)))
     notes.push('Video assets are assumed to have sound; set "hasAudio": false on any that do not, or ffmpeg will stop at a missing audio stream.');
   if (animated.size)
     notes.push(`Keyframed ${[...animated].sort().join(", ")} ${animated.size > 1 ? "are" : "is"} rendered as straight lines between keys, with eased segments sampled every two frames${animated.has("scale") ? "; animated scale needs ffmpeg 5 or later (scale with eval=frame)" : ""}.`);
@@ -1904,5 +2373,20 @@ function buildFfmpeg(project, options, measure) {
 
 
 
-exports.VIDEO_FITS = VIDEO_FITS; exports.VIDEO_TRANSITION_TYPES = VIDEO_TRANSITION_TYPES; exports.VIDEO_WIPE_DIRECTIONS = VIDEO_WIPE_DIRECTIONS; exports.videoTransitionAudioCurve = videoTransitionAudioCurve; exports.VIDEO_BLEND_MODES = VIDEO_BLEND_MODES; exports.VIDEO_CLIP_ANIMATION_EFFECTS = VIDEO_CLIP_ANIMATION_EFFECTS; exports.VIDEO_FADE_CURVES = VIDEO_FADE_CURVES; exports.VIDEO_PLACEMENT_MODES = VIDEO_PLACEMENT_MODES; exports.VIDEO_CLIP_TYPES = VIDEO_CLIP_TYPES; exports.VIDEO_EASE_NAMES = VIDEO_EASE_NAMES; exports.VIDEO_KEYFRAME_PROPERTIES = VIDEO_KEYFRAME_PROPERTIES; exports.VIDEO_TRANSFORM_PROPERTIES = VIDEO_TRANSFORM_PROPERTIES; exports.VIDEO_KEYFRAME_LIMITS = VIDEO_KEYFRAME_LIMITS; exports.isVideoKeyframes = isVideoKeyframes; exports.videoEaseBezier = videoEaseBezier; exports.videoEaseProgress = videoEaseProgress; exports.videoValueAt = videoValueAt; exports.videoKeysOf = videoKeysOf; exports.retimeVideoAnimatable = retimeVideoAnimatable; exports.splitVideoAnimatable = splitVideoAnimatable; exports.sortVideoKeys = sortVideoKeys; exports.setVideoKey = setVideoKey; exports.removeVideoKey = removeVideoKey; exports.videoKeyframeBreakpoints = videoKeyframeBreakpoints; exports.videoKeyframeFfmpegExpr = videoKeyframeFfmpegExpr; exports.VIDEO_LUT_MAX_SIZE = VIDEO_LUT_MAX_SIZE; exports.parseVideoCubeLut = parseVideoCubeLut; exports.videoLutFromFunction = videoLutFromFunction; exports.videoLutToCube = videoLutToCube; exports.applyVideoLut = applyVideoLut; exports.applyVideoLutToPixels = applyVideoLutToPixels; exports.videoLutSvgApproximation = videoLutSvgApproximation; exports.VideoLutCache = VideoLutCache; exports.VIDEO_GRADE_CONTROLS = VIDEO_GRADE_CONTROLS; exports.VIDEO_GRADE_PRESETS = VIDEO_GRADE_PRESETS; exports.VIDEO_GRADE_PRESET_NAMES = VIDEO_GRADE_PRESET_NAMES; exports.normalizeVideoGradeLut = normalizeVideoGradeLut; exports.normalizeVideoGrade = normalizeVideoGrade; exports.videoGradePreset = videoGradePreset; exports.videoGradeLook = videoGradeLook; exports.videoGradeSteps = videoGradeSteps; exports.videoGradeStepMatrix = videoGradeStepMatrix; exports.applyVideoGrade = applyVideoGrade; exports.videoGradeStepSvgValues = videoGradeStepSvgValues; exports.videoLutSvgPrimitives = videoLutSvgPrimitives; exports.videoGradeSvgFilter = videoGradeSvgFilter; exports.videoGradeGainsFilterId = videoGradeGainsFilterId; exports.videoGradeCssFilter = videoGradeCssFilter; exports.videoGradeSvgDefs = videoGradeSvgDefs; exports.videoGradeFfmpegFilters = videoGradeFfmpegFilters; exports.videoClipSourceTime = videoClipSourceTime; exports.videoClipSpeedAt = videoClipSpeedAt; exports.videoSpeedRampKeys = videoSpeedRampKeys; exports.checkVideoTimeRemap = checkVideoTimeRemap; exports.videoTimeRemapSpan = videoTimeRemapSpan; exports.videoTimeRemapBreakpoints = videoTimeRemapBreakpoints; exports.videoSpeedRampEdit = videoSpeedRampEdit; exports.videoFreezeFrameEdit = videoFreezeFrameEdit; exports.videoSlowMotionRamp = videoSlowMotionRamp; exports.VIDEO_TIME_EPSILON = VIDEO_TIME_EPSILON; exports.videoClipEnd = videoClipEnd; exports.videoTrackSyncLocked = videoTrackSyncLocked; exports.videoClipSpeed = videoClipSpeed; exports.videoClipSourceRange = videoClipSourceRange; exports.videoFrameDuration = videoFrameDuration; exports.snapToVideoFrame = snapToVideoFrame; exports.videoFrames = videoFrames; exports.isVideoDropFrameRate = isVideoDropFrameRate; exports.videoTimecodeFrames = videoTimecodeFrames; exports.formatVideoTimecode = formatVideoTimecode; exports.formatVideoTimecodeFrames = formatVideoTimecodeFrames; exports.videoHourFrames = videoHourFrames; exports.formatVideoSeconds = formatVideoSeconds; exports.videoAssetHasSound = videoAssetHasSound; exports.videoAssetMap = videoAssetMap; exports.videoSequenceMap = videoSequenceMap; exports.videoSequenceDuration = videoSequenceDuration; exports.videoSequenceChildren = videoSequenceChildren; exports.findVideoSequenceCycle = findVideoSequenceCycle; exports.allVideoTracks = allVideoTracks; exports.sortedVideoClips = sortedVideoClips; exports.findVideoClip = findVideoClip; exports.allVideoClipIds = allVideoClipIds; exports.findVideoSequenceClip = findVideoSequenceClip; exports.videoProjectDuration = videoProjectDuration; exports.videoClipBefore = videoClipBefore; exports.videoClipAfter = videoClipAfter; exports.videoClipHandles = videoClipHandles; exports.videoClipOverhang = videoClipOverhang; exports.videoSnapPoints = videoSnapPoints; exports.snapVideoTime = snapVideoTime; exports.findVideoGaps = findVideoGaps; exports.videoOverlap = videoOverlap; exports.nextFreeVideoSlot = nextFreeVideoSlot; exports.videoClipsAt = videoClipsAt; exports.VIDEO_CLIP_ANIMATION_DURATION = VIDEO_CLIP_ANIMATION_DURATION; exports.videoClipAnimationProperties = videoClipAnimationProperties; exports.videoClipAnimationSpans = videoClipAnimationSpans; exports.videoClipAnimated = videoClipAnimated; exports.videoTransformAt = videoTransformAt; exports.placeVideoRect = placeVideoRect; exports.videoTextStyle = videoTextStyle; exports.videoTitleFrame = videoTitleFrame; exports.videoTransitionEase = videoTransitionEase; exports.videoFadeCurveGain = videoFadeCurveGain; exports.videoClipSoundGain = videoClipSoundGain; exports.videoFrameAt = videoFrameAt; exports.videoFrameLeafLayers = videoFrameLeafLayers; exports.videoIrisRadius = videoIrisRadius; exports.videoWipeRect = videoWipeRect; exports.videoFrameToSvg = videoFrameToSvg; exports.videoProjectSvg = videoProjectSvg; exports.videoContactSheetSvg = videoContactSheetSvg; exports.drawVideoFrame = drawVideoFrame; exports.toVideoEdl = toVideoEdl; exports.parseVideoLoudnessMeasurement = parseVideoLoudnessMeasurement; exports.ffmpegFilterValue = ffmpegFilterValue; exports.videoShellQuote = videoShellQuote; exports.toVideoFfmpeg = toVideoFfmpeg; exports.toVideoLoudnessMeasure = toVideoLoudnessMeasure;
-//# sourceMappingURL=chunk-SMJGE7HM.cjs.map
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.VIDEO_FITS = VIDEO_FITS; exports.VIDEO_TRANSITION_TYPES = VIDEO_TRANSITION_TYPES; exports.VIDEO_WIPE_DIRECTIONS = VIDEO_WIPE_DIRECTIONS; exports.videoTransitionAudioCurve = videoTransitionAudioCurve; exports.VIDEO_BLEND_MODES = VIDEO_BLEND_MODES; exports.VIDEO_CLIP_ANIMATION_EFFECTS = VIDEO_CLIP_ANIMATION_EFFECTS; exports.VIDEO_FADE_CURVES = VIDEO_FADE_CURVES; exports.VIDEO_PLACEMENT_MODES = VIDEO_PLACEMENT_MODES; exports.VIDEO_CLIP_TYPES = VIDEO_CLIP_TYPES; exports.VIDEO_EASE_NAMES = VIDEO_EASE_NAMES; exports.VIDEO_KEYFRAME_PROPERTIES = VIDEO_KEYFRAME_PROPERTIES; exports.VIDEO_TRANSFORM_PROPERTIES = VIDEO_TRANSFORM_PROPERTIES; exports.VIDEO_KEYFRAME_LIMITS = VIDEO_KEYFRAME_LIMITS; exports.isVideoKeyframes = isVideoKeyframes; exports.videoEaseBezier = videoEaseBezier; exports.videoEaseProgress = videoEaseProgress; exports.videoValueAt = videoValueAt; exports.videoKeysOf = videoKeysOf; exports.retimeVideoAnimatable = retimeVideoAnimatable; exports.splitVideoAnimatable = splitVideoAnimatable; exports.sortVideoKeys = sortVideoKeys; exports.setVideoKey = setVideoKey; exports.removeVideoKey = removeVideoKey; exports.videoKeyframeBreakpoints = videoKeyframeBreakpoints; exports.videoKeyframeFfmpegExpr = videoKeyframeFfmpegExpr; exports.VIDEO_LUT_MAX_SIZE = VIDEO_LUT_MAX_SIZE; exports.parseVideoCubeLut = parseVideoCubeLut; exports.videoLutFromFunction = videoLutFromFunction; exports.videoLutToCube = videoLutToCube; exports.applyVideoLut = applyVideoLut; exports.applyVideoLutToPixels = applyVideoLutToPixels; exports.videoLutSvgApproximation = videoLutSvgApproximation; exports.VideoLutCache = VideoLutCache; exports.VIDEO_GRADE_CONTROLS = VIDEO_GRADE_CONTROLS; exports.VIDEO_GRADE_PRESETS = VIDEO_GRADE_PRESETS; exports.VIDEO_GRADE_PRESET_NAMES = VIDEO_GRADE_PRESET_NAMES; exports.normalizeVideoGradeLut = normalizeVideoGradeLut; exports.normalizeVideoGrade = normalizeVideoGrade; exports.videoGradePreset = videoGradePreset; exports.videoGradeLook = videoGradeLook; exports.videoGradeSteps = videoGradeSteps; exports.videoGradeStepMatrix = videoGradeStepMatrix; exports.applyVideoGrade = applyVideoGrade; exports.videoGradeStepSvgValues = videoGradeStepSvgValues; exports.videoLutSvgPrimitives = videoLutSvgPrimitives; exports.videoGradeSvgFilter = videoGradeSvgFilter; exports.videoGradeGainsFilterId = videoGradeGainsFilterId; exports.videoGradeCssFilter = videoGradeCssFilter; exports.videoGradeSvgDefs = videoGradeSvgDefs; exports.videoGradeFfmpegFilters = videoGradeFfmpegFilters; exports.videoClipSourceTime = videoClipSourceTime; exports.videoClipSpeedAt = videoClipSpeedAt; exports.videoSpeedRampKeys = videoSpeedRampKeys; exports.checkVideoTimeRemap = checkVideoTimeRemap; exports.videoTimeRemapSpan = videoTimeRemapSpan; exports.videoTimeRemapBreakpoints = videoTimeRemapBreakpoints; exports.videoSpeedRampEdit = videoSpeedRampEdit; exports.videoFreezeFrameEdit = videoFreezeFrameEdit; exports.videoSlowMotionRamp = videoSlowMotionRamp; exports.VIDEO_TIME_EPSILON = VIDEO_TIME_EPSILON; exports.videoClipEnd = videoClipEnd; exports.videoTrackSyncLocked = videoTrackSyncLocked; exports.videoClipSpeed = videoClipSpeed; exports.videoClipSourceRange = videoClipSourceRange; exports.videoFrameDuration = videoFrameDuration; exports.snapToVideoFrame = snapToVideoFrame; exports.videoFrames = videoFrames; exports.isVideoDropFrameRate = isVideoDropFrameRate; exports.videoTimecodeFrames = videoTimecodeFrames; exports.formatVideoTimecode = formatVideoTimecode; exports.formatVideoTimecodeFrames = formatVideoTimecodeFrames; exports.videoHourFrames = videoHourFrames; exports.formatVideoSeconds = formatVideoSeconds; exports.videoAssetHasSound = videoAssetHasSound; exports.videoAssetMap = videoAssetMap; exports.videoSequenceMap = videoSequenceMap; exports.videoSequenceDuration = videoSequenceDuration; exports.videoSequenceChildren = videoSequenceChildren; exports.findVideoSequenceCycle = findVideoSequenceCycle; exports.allVideoTracks = allVideoTracks; exports.sortedVideoClips = sortedVideoClips; exports.findVideoClip = findVideoClip; exports.allVideoClipIds = allVideoClipIds; exports.findVideoSequenceClip = findVideoSequenceClip; exports.videoProjectDuration = videoProjectDuration; exports.videoClipBefore = videoClipBefore; exports.videoClipAfter = videoClipAfter; exports.videoClipHandles = videoClipHandles; exports.videoClipOverhang = videoClipOverhang; exports.videoSnapPoints = videoSnapPoints; exports.snapVideoTime = snapVideoTime; exports.findVideoGaps = findVideoGaps; exports.videoOverlap = videoOverlap; exports.nextFreeVideoSlot = nextFreeVideoSlot; exports.videoClipsAt = videoClipsAt; exports.VIDEO_CLIP_ANIMATION_DURATION = VIDEO_CLIP_ANIMATION_DURATION; exports.videoClipAnimationProperties = videoClipAnimationProperties; exports.videoClipAnimationSpans = videoClipAnimationSpans; exports.videoClipAnimated = videoClipAnimated; exports.videoEffectValuesAt = videoEffectValuesAt; exports.videoTransformAt = videoTransformAt; exports.placeVideoRect = placeVideoRect; exports.videoTextStyle = videoTextStyle; exports.videoTitleFrame = videoTitleFrame; exports.videoTransitionEase = videoTransitionEase; exports.videoFadeCurveGain = videoFadeCurveGain; exports.videoClipSoundGain = videoClipSoundGain; exports.videoFrameAt = videoFrameAt; exports.videoLayersWithoutTransitionEffects = videoLayersWithoutTransitionEffects; exports.videoFrameLeafLayers = videoFrameLeafLayers; exports.videoProjectEffects = videoProjectEffects; exports.videoClipEffectUses = videoClipEffectUses; exports.videoLayersUseEffects = videoLayersUseEffects; exports.videoEffectFrameTime = videoEffectFrameTime; exports.videoEffectLayerKey = videoEffectLayerKey; exports.mixEffectPixels = mixEffectPixels; exports.overEffectPixels = overEffectPixels; exports.VideoEffectsEngine = VideoEffectsEngine; exports.VIDEO_EFFECT_PLACES = VIDEO_EFFECT_PLACES; exports.checkVideoEffectPlace = checkVideoEffectPlace; exports.checkVideoEffectValues = checkVideoEffectValues; exports.videoIrisRadius = videoIrisRadius; exports.videoWipeRect = videoWipeRect; exports.videoFrameToSvg = videoFrameToSvg; exports.videoProjectSvg = videoProjectSvg; exports.videoContactSheetSvg = videoContactSheetSvg; exports.drawVideoFrame = drawVideoFrame; exports.renderVideoFrameExact = renderVideoFrameExact; exports.toVideoEdl = toVideoEdl; exports.videoFfmpegUnsupportedEffects = videoFfmpegUnsupportedEffects; exports.parseVideoLoudnessMeasurement = parseVideoLoudnessMeasurement; exports.ffmpegFilterValue = ffmpegFilterValue; exports.videoShellQuote = videoShellQuote; exports.toVideoFfmpeg = toVideoFfmpeg; exports.toVideoLoudnessMeasure = toVideoLoudnessMeasure;
+//# sourceMappingURL=chunk-IWSMDQE5.cjs.map