npm - @video-editor/renderer - Versions diffs - 0.0.1-beta.33 → 0.0.1-beta.34 - Mend

@video-editor/renderer 0.0.1-beta.33 → 0.0.1-beta.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/index.js CHANGED Viewed

@@ -1,434 +1,278 @@
-import { createValidator as Wt, createResourceManager as Yt, getResourceKey as W } from "@video-editor/protocol";
-import { toRaw as Xt, isRef as Jt, shallowRef as vt, unref as Mt, ref as gt, computed as Ht, effectScope as Qt, watch as Z } from "@vue/reactivity";
-import { AudioClip as Tt, renderTxt2ImgBitmap as Zt, MP4Clip as K, Combinator as bt, OffscreenSprite as nt } from "@webav/av-cliper";
-import { file as te } from "opfs-tools";
-import { Application as kt, Sprite as V, Texture as G, Graphics as Ct, Container as ee } from "pixi.js";
-async function oe(e) {
-  const t = new kt();
+import { createValidator as Ut, createResourceManager as Nt, getResourceKey as z } from "@video-editor/protocol";
+import { toRaw as Dt, isRef as $t, shallowRef as Ge, unref as Le, ref as Be, computed as Kt, effectScope as Gt, watch as fe } from "@vue/reactivity";
+import { renderTxt2ImgBitmap as Lt, MP4Clip as K, Combinator as Je, OffscreenSprite as be, AudioClip as Bt } from "@webav/av-cliper";
+import { file as jt } from "opfs-tools";
+import { Application as Qe, Sprite as U, Texture as $, Graphics as Ze, BlurFilter as et, ColorMatrixFilter as ge, Container as qt } from "pixi.js";
+import { isAudioSegment as tt, isVideoFramesSegment as Ie } from "@video-editor/shared";
+async function _t(e) {
+  const t = new Qe();
   return await t.init({ resizeTo: window, backgroundAlpha: 0, ...e }), t;
 }
-function ie(e, t, o, i, n) {
-  const a = t || i, c = o || n;
-  if (!a || !c)
-    return { width: i, height: n };
-  const u = a / c, d = i / n;
-  switch (e) {
-    case "none":
-      return { width: a, height: c };
-    case "cover":
-      return u > d ? { width: n * u, height: n } : { width: i, height: i / u };
-    case "stretch":
-      return { width: i, height: n };
-    default:
-      return u > d ? { width: i, height: i / u } : { width: n * u, height: n };
-  }
-}
-function re(e, t, o, i, n) {
-  const a = "fillMode" in e ? e.fillMode : void 0, { width: c, height: u } = ie(
-    a,
-    i,
-    n,
-    t,
-    o
-  ), d = "transform" in e ? e.transform : void 0, [y, h] = d?.position ?? [0, 0], [w, M] = d?.scale ?? [1, 1], p = d?.rotation?.[2] ?? 0, v = c * w, m = u * M, g = t / 2 + y * t / 2, R = o / 2 - h * o / 2;
-  return {
-    width: v,
-    height: m,
-    centerX: g,
-    centerY: R,
-    rotationRad: p / 180 * Math.PI
-  };
-}
-function ne(e) {
-  const t = /* @__PURE__ */ new Set();
-  for (const o of e.tracks)
-    for (const i of o.children)
-      i.url && t.add(i.url);
-  return t;
-}
-function Rt(e, t) {
-  const o = [];
-  return e.tracks.forEach((i, n) => {
-    i.children.forEach((a, c) => {
-      a.startTime <= t && t < a.endTime && o.push({ segment: a, trackIndex: n, childIndex: c });
-    });
-  }), o.sort((i, n) => {
-    const a = e.tracks[i.trackIndex], c = e.tracks[n.trackIndex], u = a?.trackType === "frames" && a.isMain, d = c?.trackType === "frames" && c.isMain, y = e.tracks.length, h = u ? 0 : y - i.trackIndex, w = d ? 0 : y - n.trackIndex;
-    return h !== w ? h - w : i.trackIndex === n.trackIndex ? i.childIndex - n.childIndex : i.trackIndex - n.trackIndex;
-  });
-}
-function ae(e, t, o, i) {
-  const n = ce(t), a = e instanceof V && e.texture.width || o, c = e instanceof V && e.texture.height || i, u = re(t, o, i, a, c);
-  e instanceof V ? (e.anchor.set(0.5), e.width = u.width, e.height = u.height, e.position.set(u.centerX, u.centerY), e.rotation = u.rotationRad, e.texture.source?.addEventListener?.("error", () => {
-    e.texture = G.from(se(o, i));
-  }, { once: !0 })) : e instanceof Ct && (e.clear(), e.rect(0, 0, u.width, u.height).fill({ color: At("url" in t && typeof t.url == "string" ? t.url : t.segmentType), alpha: Et(t) ? n : 0.35 }), e.pivot.set(u.width / 2, u.height / 2), e.position.set(u.centerX, u.centerY), e.rotation = u.rotationRad), e.alpha = n;
-}
-function tt(e, t) {
-  const o = new Ct();
-  return o.rect(0, 0, 10, 10).fill({ color: At(t ?? e), alpha: 1 }), o;
-}
-function se(e, t, o) {
-  const i = `<svg xmlns="http://www.w3.org/2000/svg" width="${e}" height="${t}"><rect width="100%" height="100%" fill="#0f172a" fill-opacity="0.8"/></svg>`;
-  return `data:image/svg+xml;base64,${btoa(i)}`;
-}
-function At(e) {
-  let t = 0;
-  for (let o = 0; o < e.length; o++)
-    t = e.charCodeAt(o) + ((t << 5) - t);
-  return t & 16777215;
-}
-function it(e) {
-  const t = e.tracks.flatMap((o) => o.children.map((i) => i.endTime));
-  return t.length ? Math.max(...t) : 0;
-}
-function et(e, t, o) {
-  return Math.min(Math.max(e, t), o);
-}
-function St(e) {
-  const t = Xt(e);
-  return JSON.parse(JSON.stringify(t));
-}
-function Et(e) {
-  return "opacity" in e;
-}
-function ce(e) {
-  return Et(e) && typeof e.opacity == "number" ? e.opacity : 1;
-}
-class ue {
+class Wt {
   protocol;
-  clips = /* @__PURE__ */ new Map();
-  loadingClips = /* @__PURE__ */ new Map();
-  audioLoops = /* @__PURE__ */ new Map();
-  audioLoopContexts = /* @__PURE__ */ new Map();
-  mp4Loops = /* @__PURE__ */ new Map();
+  options;
   mp4States = /* @__PURE__ */ new Map();
-  audioGains = /* @__PURE__ */ new Map();
   mp4Gains = /* @__PURE__ */ new Map();
+  plannedVideoAudioGains = /* @__PURE__ */ new Map();
+  plannedVideoAudioRates = /* @__PURE__ */ new Map();
+  plannedVoices = /* @__PURE__ */ new Map();
   audioElements = /* @__PURE__ */ new Map();
-  useMediaElementForAudio = !0;
   ctx;
-  lastTime = 0;
-  constructor(t) {
-    this.protocol = t, this.ctx = new (window.AudioContext || window.webkitAudioContext)();
+  constructor(t, i = {}) {
+    this.protocol = t, this.options = i, this.ctx = new (window.AudioContext || window.webkitAudioContext)();
   }
   setProtocol(t) {
     this.protocol = t;
   }
-  async sync(t, o) {
-    if (!o) {
-      this.stopAll(), this.lastTime = t;
+  applyTimelinePlan(t, i) {
+    if (!i) {
+      this.stopAll();
       return;
     }
-    this.ctx.state === "suspended" && await this.ctx.resume().catch(() => {
-    }), Math.abs(t - this.lastTime) > 1e3 && this.stopAll(), this.lastTime = t;
-    const i = Rt(this.protocol, t), n = /* @__PURE__ */ new Set(), a = /* @__PURE__ */ new Set();
-    for (const { segment: c } of i)
-      if (c.segmentType === "audio") {
-        const u = this.audioKey(c.id);
-        n.add(u), this.useMediaElementForAudio ? this.syncAudioElement(c, t) : this.ensureAudioLoop(c, t);
-      } else if (c.segmentType === "frames" && "type" in c && c.type === "video") {
-        const u = this.videoKey(c.id);
-        a.add(u);
-      }
-    for (const [c, u] of this.audioLoops)
-      if (!n.has(c)) {
-        u.stop();
-        for (const d of u.sources)
-          try {
-            d.stop(), d.disconnect();
-          } catch {
-          }
-        this.audioLoops.delete(c), this.audioLoopContexts.delete(c), this.audioGains.delete(c);
-      }
-    for (const [c, u] of this.audioElements)
-      if (!n.has(c)) {
-        try {
-          u.el.pause(), u.pendingPlay = void 0, u.lastTimelineMs = void 0, u.lastSourceSec = void 0, u.lastSeekTimelineMs = void 0;
-        } catch {
-        }
-        this.findSegmentInProtocol(u.segmentId) || (this.destroyAudioElement(u.el), this.audioElements.delete(c));
-      }
-    for (const [c, u] of this.mp4Loops)
-      if (!a.has(c)) {
-        u.stop();
-        for (const d of u.sources)
-          try {
-            d.stop(), d.disconnect();
-          } catch {
-          }
-        this.mp4Loops.delete(c), this.mp4States.delete(c), this.mp4Gains.delete(c);
-      }
-    for (const c of this.mp4States.keys())
-      !a.has(c) && !this.mp4Loops.has(c) && (this.mp4States.delete(c), this.mp4Gains.delete(c));
+    this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
+    });
+    for (const n of t.audioEvents)
+      this.applyAudioPlanEvent(n);
+  }
+  resetTimelineState(t = {}) {
+    this.plannedVoices.clear(), this.plannedVideoAudioGains.clear(), this.plannedVideoAudioRates.clear(), t.stop && this.stopAll();
   }
   /**
    * Play audio frames from MP4 video directly.
    * Called by renderer after it gets audio data from clip.tick()
    */
-  playMp4AudioFrames(t, o, i) {
-    if (!o || o.length === 0 || !o[0]?.length)
+  playMp4AudioFrames(t, i, n) {
+    const o = this.normalizePcmChannels(i);
+    if (!o)
       return;
-    const n = this.videoKey(t), a = this.getSegmentVolume(t), c = this.getOrCreateGain(this.mp4Gains, n, a);
+    const a = this.videoKey(t), u = this.plannedVideoAudioGains.get(a), d = typeof u == "number" ? this.normalizeVolume(u) : this.getSegmentVolume(t), f = this.plannedVideoAudioRates.get(a), g = typeof f == "number" ? this.normalizePlayRate(f) : 1, m = this.getOrCreateGain(this.mp4Gains, a, d);
     this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
     });
-    let u = this.mp4States.get(n);
-    u || (u = {
-      loop: { stop: () => {
-      }, sources: [], isStopped: () => !1 },
-      startUs: 0,
-      startCtxTime: this.ctx.currentTime,
-      fps: 30,
+    let S = this.mp4States.get(a);
+    S || (S = {
+      sources: [],
       nextStartAt: 0
-    }, this.mp4States.set(n, u)), u.nextStartAt = this.playFrames(o, i, u.nextStartAt ?? 0, c, u.loop.sources);
+    }, this.mp4States.set(a, S)), S.nextStartAt = this.playFrames(
+      o,
+      this.normalizeSampleRate(n),
+      S.nextStartAt ?? 0,
+      m,
+      S.sources,
+      g
+    );
   }
   /**
    * Reset MP4 audio playback state (call when seeking or pausing)
    */
   resetMp4Audio(t) {
-    const o = this.videoKey(t), i = this.mp4States.get(o);
-    i && (i.nextStartAt = 0);
+    const i = this.videoKey(t), n = this.mp4States.get(i);
+    n && (n.nextStartAt = 0);
   }
   /**
    * Stop and clean up MP4 audio for a video segment
    */
   stopMp4Audio(t) {
-    const o = this.videoKey(t), i = this.mp4States.get(o);
-    if (i) {
-      i.loop.stop();
-      for (const n of i.loop.sources)
+    const i = this.videoKey(t), n = this.mp4States.get(i);
+    if (n) {
+      for (const o of n.sources)
         try {
-          n.stop(), n.disconnect();
+          o.stop(), o.disconnect();
         } catch {
         }
-      this.mp4Loops.delete(o), this.mp4States.delete(o), this.mp4Gains.delete(o);
+      n.sources.length = 0, this.mp4States.delete(i), this.mp4Gains.delete(i);
     }
   }
-  /**
-   * @deprecated Use playMp4AudioFrames instead
-   */
-  ensureMp4Audio(t, o, i, n) {
-    const a = this.videoKey(t), c = this.getSegmentVolume(t), u = this.getOrCreateGain(this.mp4Gains, a, c), d = this.mp4States.get(a);
-    if (d) {
-      u.gain.value = Math.max(0, c);
-      const h = (this.ctx.currentTime - d.startCtxTime) * 1e6, w = d.startUs + h;
-      if (Math.abs(w - i) < 15e4 && d.fps === n)
-        return;
-      d.loop.stop();
-      for (const M of d.loop.sources)
-        try {
-          M.stop(), M.disconnect();
-        } catch {
-        }
-      this.mp4Loops.delete(a), this.mp4States.delete(a);
-    }
-    this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
-    });
-    const y = this.startMp4Loop(o, i, n, u);
-    this.mp4Loops.set(a, y), this.mp4States.set(a, {
-      loop: y,
-      startUs: i,
-      startCtxTime: this.ctx.currentTime,
-      fps: n
-    });
-  }
   destroy() {
     this.stopAll();
-    for (const t of this.clips.values())
-      t.clip.destroy();
-    this.clips.clear();
     for (const t of this.audioElements.values())
       this.destroyAudioElement(t.el);
     this.audioElements.clear();
   }
   stopAll() {
     for (const t of this.audioElements.values())
-      try {
-        t.el.pause(), t.pendingPlay = void 0, t.lastTimelineMs = void 0, t.lastSourceSec = void 0, t.lastSeekTimelineMs = void 0;
-      } catch {
-      }
-    for (const t of this.audioLoops.values()) {
-      t.stop();
-      for (const o of t.sources)
+      this.pauseAudioElementState(t);
+    for (const t of this.mp4States.values()) {
+      for (const i of t.sources)
         try {
-          o.stop(0), o.disconnect();
+          i.stop(0), i.disconnect();
         } catch {
         }
       t.sources.length = 0;
     }
-    for (const t of this.mp4Loops.values()) {
-      t.stop();
-      for (const o of t.sources)
-        try {
-          o.stop(0), o.disconnect();
-        } catch {
-        }
-      t.sources.length = 0;
-    }
-    for (const t of this.audioGains.values())
-      try {
-        t.disconnect();
-      } catch {
-      }
     for (const t of this.mp4Gains.values())
       try {
         t.disconnect();
       } catch {
       }
-    this.audioLoops.clear(), this.audioLoopContexts.clear(), this.audioGains.clear(), this.mp4Loops.clear(), this.mp4States.clear(), this.mp4Gains.clear();
+    this.mp4States.clear(), this.mp4Gains.clear(), this.plannedVoices.clear(), this.plannedVideoAudioGains.clear(), this.plannedVideoAudioRates.clear();
   }
-  async ensureAudioLoop(t, o) {
-    const i = this.audioKey(t.id), n = await this.loadClip(t);
-    if (!n)
+  applyAudioPlanEvent(t) {
+    if (t.segmentKind === "audio") {
+      this.applySegmentAudioEvent(t);
       return;
-    const a = t.fromTime ?? 0, c = this.normalizePlayRate(t.playRate), u = o - t.startTime, d = a + u * c, y = this.getOrCreateGain(this.audioGains, i, t.volume);
-    this.applyFadeToGain(t, u, y);
-    const h = this.audioLoops.get(i);
-    if (h && !h.isStopped())
-      return;
-    h && (this.audioLoops.delete(i), this.audioLoopContexts.delete(i));
-    const M = (t.endTime - t.startTime) * c, p = a + M, v = this.startAudioLoop(n.clip, Math.max(0, d) * 1e3, y, c, p * 1e3);
-    this.audioLoops.set(i, v), this.audioLoopContexts.set(i, {
-      segment: t,
-      startedAt: this.ctx.currentTime,
-      segmentRelativeMs: u
-    });
-  }
-  syncAudioElement(t, o) {
-    const i = this.audioKey(t.id), n = this.getOrCreateAudioElementState(i, t), a = o - t.startTime, c = this.normalizePlayRate(t.playRate), u = t.fromTime ?? 0, d = u + a * c, h = Math.max(0, t.endTime - t.startTime) * c, w = u + h, M = Math.max(0, w) / 1e3, p = Number.isFinite(n.el.duration) ? Math.max(0, n.el.duration) : void 0, v = p === void 0 ? M : Math.min(M, p), m = Math.max(0, Math.min(d / 1e3, v)), g = d / 1e3 >= v - 0.01;
-    Math.abs(n.el.playbackRate - c) > 1e-3 && (n.el.playbackRate = c);
-    const R = this.computeSegmentVolume(t, a);
-    Math.abs(n.el.volume - R) > 1e-3 && (n.el.volume = R);
-    const P = 0.24, A = 500, E = 300, b = -40, q = n.lastTimelineMs, D = n.lastSourceSec, z = q === void 0 ? 0 : o - q;
-    let O = !1;
-    if (q === void 0)
-      O = !0;
-    else if (z < b || z > E)
-      O = !0;
-    else if (D !== void 0) {
-      const F = D + z * c / 1e3, Y = Math.abs(F - m), _ = n.lastSeekTimelineMs === void 0 || o - n.lastSeekTimelineMs >= A;
-      Y > P && _ && (O = !0);
     }
-    if (O && Math.abs(n.el.currentTime - m) > 0.06)
-      try {
-        n.el.currentTime = m, n.lastSeekTimelineMs = o;
-      } catch {
+    this.applyVideoAudioEvent(t);
+  }
+  applySegmentAudioEvent(t) {
+    const i = this.audioKey(t.segmentId), n = this.getOrCreatePlannedVoice(t);
+    if (t.action === "stop") {
+      const u = this.audioElements.get(i);
+      if (!u) {
+        this.plannedVoices.delete(t.voiceId);
+        return;
       }
-    if (n.lastTimelineMs = o, n.lastSourceSec = m, g) {
-      if (!n.el.paused)
-        try {
-          n.el.pause();
-        } catch {
-        }
-      n.pendingPlay = void 0;
+      this.pauseAudioElementState(u), n.phase = "ended", this.plannedVoices.delete(t.voiceId);
       return;
     }
-    if (n.el.paused && !n.pendingPlay) {
-      const F = n.el.play();
-      F && typeof F.then == "function" && (n.pendingPlay = F.catch(() => {
-      }).finally(() => {
-        n.pendingPlay = void 0;
-      }));
-    }
-  }
-  applyFadeToGain(t, o, i) {
-    i.gain.value = this.computeSegmentVolume(t, o);
-  }
-  startMp4Loop(t, o, i, n) {
-    let a = !1, c = o, u = 0, d = !0;
-    const y = Math.round(1e3 / Math.max(i || 30, 1) * 1e3), h = this.getClipSampleRate(t), w = [], M = window.setInterval(async () => {
-      if (a)
-        return;
-      const { audio: p, state: v } = await t.tick(Math.round(c));
-      if (c += y, v === "done")
+    const o = this.findAudioSegment(t.segmentId);
+    if (!o)
+      return;
+    const a = this.getOrCreateAudioElementState(i, o);
+    if (t.action === "start" || t.action === "seek") {
+      const u = this.computeSegmentSourceOffsetMs(
+        o,
+        t.atTimelineMs,
+        t.sourceTimeMs
+      ), { targetSourceSec: d, isSourceExhausted: f } = this.resolveAudioElementSourceWindow(
+        a,
+        o,
+        u
+      );
+      if (f) {
+        this.pauseAudioElementState(a), n.lastSourceSec = d, n.phase = "ended";
         return;
-      if (d) {
-        d = !1;
+      }
+      if (d !== void 0 && (n.phase !== "playing" || n.lastSourceSec === void 0 || Math.abs((n.lastSourceSec ?? 0) - d) > 0.02) && !this.seekAudioElement(a, d, t.atTimelineMs) && d > 0.05) {
+        this.pauseAudioElementState(a), n.phase = "idle";
         return;
       }
-      (p?.[0]?.length ?? 0) !== 0 && (u = this.playFrames(p, h, u, n, w));
-    }, Math.round(1e3 / Math.max(i || 30, 1)));
-    return {
-      sources: w,
-      stop: () => {
-        a = !0, window.clearInterval(M);
-      },
-      isStopped: () => a
-    };
+      if (typeof t.gain == "number") {
+        const m = this.normalizeVolume(t.gain);
+        (n.lastGain === void 0 || Math.abs((n.lastGain ?? 0) - m) > 1e-3) && (a.el.volume = m), n.lastGain = m;
+      }
+      if (typeof t.rate == "number") {
+        const m = this.normalizePlayRate(t.rate);
+        (n.lastRate === void 0 || Math.abs((n.lastRate ?? 0) - m) > 1e-3) && (a.el.playbackRate = m), n.lastRate = m;
+      }
+      d !== void 0 && (n.lastSourceSec = d), this.playAudioElementState(a), n.phase = "playing";
+      return;
+    }
+    if (t.action === "gain") {
+      if (typeof t.gain == "number") {
+        const u = this.normalizeVolume(t.gain);
+        (n.lastGain === void 0 || Math.abs((n.lastGain ?? 0) - u) > 1e-3) && (a.el.volume = u), n.lastGain = u;
+      }
+      return;
+    }
+    if (t.action === "rate" && typeof t.rate == "number") {
+      const u = this.normalizePlayRate(t.rate);
+      (n.lastRate === void 0 || Math.abs((n.lastRate ?? 0) - u) > 1e-3) && (a.el.playbackRate = u), n.lastRate = u;
+    }
   }
-  startAudioLoop(t, o, i, n = 1, a) {
-    let c = !1, u = o, d = 0, y = !1;
-    const h = this.getClipSampleRate(t), w = [], p = Math.round(1e5 * n), v = async () => {
-      if (c)
-        return;
-      if (y || (o > 0 && await t.tick(o), y = !0), u += p, a !== void 0 && u > a) {
-        c = !0;
+  applyVideoAudioEvent(t) {
+    const i = this.videoKey(t.segmentId), n = this.getOrCreatePlannedVoice(t);
+    if (t.action === "stop") {
+      const u = this.audioElements.get(i);
+      u && this.pauseAudioElementState(u), this.stopMp4Audio(t.segmentId), this.plannedVideoAudioGains.delete(i), this.plannedVideoAudioRates.delete(i), n.phase = "ended", this.plannedVoices.delete(t.voiceId);
+      return;
+    }
+    const o = this.findVideoSegment(t.segmentId);
+    if (!o)
+      return;
+    const a = this.getOrCreateAudioElementState(i, o);
+    if (t.action === "start" || t.action === "seek") {
+      this.stopMp4Audio(t.segmentId);
+      const u = this.computeSegmentSourceOffsetMs(
+        o,
+        t.atTimelineMs,
+        t.sourceTimeMs
+      ), { targetSourceSec: d, isSourceExhausted: f } = this.resolveAudioElementSourceWindow(
+        a,
+        o,
+        u
+      );
+      if (f) {
+        this.pauseAudioElementState(a), n.lastSourceSec = d, n.phase = "ended";
         return;
       }
-      const { audio: m, state: g } = await t.tick(u);
-      if (c)
-        return;
-      if (g === "done") {
-        c = !0;
+      if (d !== void 0 && (n.phase !== "playing" || t.action === "seek" || n.lastSourceSec === void 0 || Math.abs((n.lastSourceSec ?? 0) - d) > 0.02) && !this.seekAudioElement(a, d, t.atTimelineMs) && d > 0.05) {
+        this.pauseAudioElementState(a), n.phase = "idle";
         return;
       }
-      if ((m?.[0]?.length ?? 0) === 0) {
-        c = !0;
-        return;
+      if (typeof t.gain == "number") {
+        const m = this.normalizeVolume(t.gain);
+        (n.lastGain === void 0 || Math.abs((n.lastGain ?? 0) - m) > 1e-3) && (a.el.volume = m), this.plannedVideoAudioGains.set(i, m), n.lastGain = m;
       }
-      d = this.playFrames(m, h, d, i, w, n), c || setTimeout(() => v(), 0);
-    };
-    return v(), {
-      sources: w,
-      stop: () => {
-        c = !0;
-      },
-      // Treat loop as active while there are still scheduled sources playing.
-      isStopped: () => c && w.length === 0
-    };
+      if (typeof t.rate == "number") {
+        const m = this.normalizePlayRate(t.rate);
+        (n.lastRate === void 0 || Math.abs((n.lastRate ?? 0) - m) > 1e-3) && (a.el.playbackRate = m), this.plannedVideoAudioRates.set(i, m), n.lastRate = m;
+      }
+      d !== void 0 && (n.lastSourceSec = d), this.playAudioElementState(a), n.phase = "playing";
+    }
+    if (typeof t.gain == "number") {
+      const u = this.normalizeVolume(t.gain);
+      (n.lastGain === void 0 || Math.abs((n.lastGain ?? 0) - u) > 1e-3) && this.plannedVideoAudioGains.set(i, u), (n.lastGain === void 0 || Math.abs((n.lastGain ?? 0) - u) > 1e-3) && (a.el.volume = u);
+      const d = this.mp4Gains.get(i);
+      d && (d.gain.value = u), n.lastGain = u;
+    }
+    if (typeof t.rate == "number") {
+      const u = this.normalizePlayRate(t.rate);
+      (n.lastRate === void 0 || Math.abs((n.lastRate ?? 0) - u) > 1e-3) && this.plannedVideoAudioRates.set(i, u), (n.lastRate === void 0 || Math.abs((n.lastRate ?? 0) - u) > 1e-3) && (a.el.playbackRate = u), n.lastRate = u;
+    }
   }
-  playFrames(t, o, i, n, a, c = 1) {
-    const u = Math.max(t.length, 1), d = t[0]?.length ?? 0;
-    if (d === 0)
+  getOrCreatePlannedVoice(t) {
+    const i = this.plannedVoices.get(t.voiceId);
+    if (i)
       return i;
-    const y = this.ctx.createBuffer(u, d, o);
-    for (let p = 0; p < u; p++) {
-      const v = t[p] ?? new Float32Array(d);
-      y.copyToChannel(new Float32Array(v), p);
+    const n = {
+      phase: "idle",
+      segmentKind: t.segmentKind
+    };
+    return this.plannedVoices.set(t.voiceId, n), n;
+  }
+  playFrames(t, i, n, o, a, u = 1) {
+    const d = Math.max(t.length, 1), f = t[0]?.length ?? 0;
+    if (f === 0)
+      return n;
+    const g = this.ctx.createBuffer(d, f, i);
+    for (let l = 0; l < d; l++) {
+      const h = t[l] ?? new Float32Array(f);
+      g.copyToChannel(new Float32Array(h), l);
     }
-    const h = this.ctx.createBufferSource();
-    h.buffer = y;
-    const w = Math.max(0.1, c);
-    h.playbackRate.value = w, h.connect(n);
-    const M = Math.max(this.ctx.currentTime, i);
-    if (h.start(M), a) {
-      a.push(h);
-      const p = y.duration / w * 1e3;
+    const m = this.ctx.createBufferSource();
+    m.buffer = g;
+    const S = Math.max(0.1, u);
+    m.playbackRate.value = S, m.connect(o);
+    const w = Math.max(this.ctx.currentTime, n);
+    if (m.start(w), a) {
+      a.push(m);
+      const l = g.duration / S * 1e3;
       setTimeout(() => {
-        const v = a.indexOf(h);
-        v > -1 && a.splice(v, 1);
-      }, p + 100);
+        const h = a.indexOf(m);
+        h > -1 && a.splice(h, 1);
+      }, l + 100);
     }
-    return M + y.duration / w;
+    return w + g.duration / S;
   }
-  getOrCreateGain(t, o, i) {
-    const n = t.get(o);
-    if (n)
-      return typeof i == "number" && (n.gain.value = this.normalizeVolume(i)), n;
+  getOrCreateGain(t, i, n) {
+    const o = t.get(i);
+    if (o)
+      return typeof n == "number" && (o.gain.value = this.normalizeVolume(n)), o;
     const a = this.ctx.createGain();
-    return a.gain.value = this.normalizeVolume(i), a.connect(this.ctx.destination), t.set(o, a), a;
+    return a.gain.value = this.normalizeVolume(n), a.connect(this.ctx.destination), t.set(i, a), a;
   }
-  getOrCreateAudioElementState(t, o) {
-    const i = this.audioElements.get(t);
-    if (i)
-      return i.url !== o.url && (i.el.pause(), i.el.src = o.url, i.el.currentTime = 0, i.url = o.url, i.pendingPlay = void 0, i.lastTimelineMs = void 0, i.lastSourceSec = void 0, i.lastSeekTimelineMs = void 0), i;
-    const n = new Audio(o.url);
-    n.preload = "auto", n.loop = !1, n.volume = this.normalizeVolume(o.volume), n.playbackRate = this.normalizePlayRate(o.playRate);
-    const a = {
-      segmentId: o.id,
-      url: o.url,
-      el: n
+  getOrCreateAudioElementState(t, i) {
+    const n = this.options.resolveMediaElementUrl?.(i) ?? i.url, o = this.audioElements.get(t);
+    if (o)
+      return o.url !== n && (o.el.pause(), o.el.src = n, o.el.currentTime = 0, o.url = n, o.pendingPlay = void 0, o.lastTimelineMs = void 0, o.lastSourceSec = void 0, o.lastSeekTimelineMs = void 0), o;
+    const a = new Audio(n);
+    a.preload = "auto", a.loop = !1, a.volume = this.normalizeVolume(i.volume), a.playbackRate = this.normalizePlayRate(i.playRate);
+    const u = {
+      segmentId: i.id,
+      url: n,
+      el: a
     };
-    return this.audioElements.set(t, a), a;
+    return this.audioElements.set(t, u), u;
   }
   destroyAudioElement(t) {
     try {
@@ -441,18 +285,63 @@ class ue {
     } catch {
     }
   }
+  playAudioElementState(t) {
+    if (!t.el.paused || t.pendingPlay)
+      return;
+    const i = t.el.play();
+    i && typeof i.then == "function" && (t.pendingPlay = i.catch(() => {
+    }).finally(() => {
+      t.pendingPlay = void 0;
+    }));
+  }
+  pauseAudioElementState(t) {
+    try {
+      t.el.pause();
+    } catch {
+    }
+    t.pendingPlay = void 0, t.lastTimelineMs = void 0, t.lastSourceSec = void 0, t.lastSeekTimelineMs = void 0;
+  }
+  seekAudioElement(t, i, n) {
+    const o = Math.max(0, i);
+    if (Math.abs(t.el.currentTime - o) <= 0.02)
+      return t.lastTimelineMs = n, t.lastSourceSec = o, !0;
+    try {
+      return t.el.currentTime = o, t.lastSeekTimelineMs = n, t.lastTimelineMs = n, t.lastSourceSec = o, !0;
+    } catch {
+      return !1;
+    }
+  }
   normalizePlayRate(t) {
     return typeof t != "number" || !Number.isFinite(t) ? 1 : Math.max(0.1, Math.min(100, t));
   }
   normalizeVolume(t) {
     return typeof t != "number" || !Number.isFinite(t) ? 1 : Math.max(0, Math.min(1, t));
   }
-  computeSegmentVolume(t, o) {
-    const i = this.normalizeVolume(t.volume), n = Math.max(0, t.endTime - t.startTime), a = Math.max(0, t.fadeInDuration ?? 0), c = Math.max(0, t.fadeOutDuration ?? 0);
-    let u = 1;
-    a > 0 && o < a && (u = Math.max(0, o / a));
-    const d = n - o;
-    return c > 0 && d < c && (u = Math.min(u, Math.max(0, d / c))), i * u;
+  computeSegmentSourceOffsetMs(t, i, n) {
+    if (typeof n == "number" && Number.isFinite(n))
+      return Math.max(0, n);
+    const o = Math.max(0, i - t.startTime), a = Math.max(0, t.fromTime ?? 0), u = this.normalizePlayRate(t.playRate);
+    return Math.max(0, a + o * u);
+  }
+  resolveAudioElementSourceWindow(t, i, n) {
+    const o = this.normalizePlayRate(i.playRate), a = Math.max(0, i.fromTime ?? 0), d = Math.max(0, i.endTime - i.startTime) * o, f = Math.max(0, a + d) / 1e3, g = Number.isFinite(t.el.duration) ? Math.max(0, t.el.duration) : void 0, m = g === void 0 ? f : Math.min(f, g), S = Math.max(0, n / 1e3), w = Math.max(0, Math.min(S, m)), l = S >= m - 0.01;
+    return { targetSourceSec: w, isSourceExhausted: l };
+  }
+  normalizeSampleRate(t) {
+    return !Number.isFinite(t) || t <= 0 ? 48e3 : Math.round(t);
+  }
+  normalizePcmChannels(t) {
+    if (!t)
+      return;
+    if (t instanceof Float32Array)
+      return t.length > 0 ? [t] : void 0;
+    if (!Array.isArray(t) || t.length === 0)
+      return;
+    const i = [];
+    for (const n of t)
+      !(n instanceof Float32Array) || n.length === 0 || i.push(n);
+    if (i.length !== 0)
+      return i;
   }
   audioKey(t) {
     return `audio:${t}`;
@@ -460,400 +349,1203 @@ class ue {
   videoKey(t) {
     return `video:${t}`;
   }
-  async loadClip(t) {
-    const o = this.clips.get(t.id);
-    if (o)
-      return o;
-    const i = this.loadingClips.get(t.id);
-    if (i)
-      return i;
-    const n = (async () => {
-      try {
-        const a = await fetch(t.url);
-        if (!a.body) {
-          this.loadingClips.delete(t.id);
-          return;
-        }
-        const c = new Tt(a.body), u = { clip: c, ready: c.ready };
-        if (await c.ready, !this.findSegmentInProtocol(t.id)) {
-          c.destroy(), this.loadingClips.delete(t.id);
-          return;
-        }
-        return this.clips.set(t.id, u), this.loadingClips.delete(t.id), u;
-      } catch (a) {
-        console.error(`[AudioManager] Failed to load audio ${t.url}`, a), this.loadingClips.delete(t.id);
-        return;
-      }
-    })();
-    return this.loadingClips.set(t.id, n), n;
+  findAudioSegment(t) {
+    for (const i of this.protocol.tracks)
+      for (const n of i.children)
+        if (n.id === t && n.segmentType === "audio")
+          return n;
   }
-  findSegmentInProtocol(t) {
-    for (const o of this.protocol.tracks)
-      for (const i of o.children)
-        if (i.id === t) return !0;
-    return !1;
+  findVideoSegment(t) {
+    for (const i of this.protocol.tracks)
+      for (const n of i.children)
+        if (n.id === t && n.segmentType === "frames" && n.type === "video")
+          return n;
   }
   getSegmentVolume(t) {
-    for (const o of this.protocol.tracks)
-      for (const i of o.children) {
-        if (i.id !== t)
+    for (const i of this.protocol.tracks)
+      for (const n of i.children) {
+        if (n.id !== t)
           continue;
-        const n = i.volume;
-        return this.normalizeVolume(n);
+        const o = n.volume;
+        return this.normalizeVolume(o);
       }
     return 1;
   }
-  getClipSampleRate(t) {
-    const o = t.meta;
-    if (!o)
-      return 48e3;
-    const i = o.audioSampleRate;
-    if (typeof i == "number" && i > 0)
-      return i;
-    const n = o.sampleRate;
-    return typeof n == "number" && n > 0 ? n : 48e3;
+}
+function Yt(e, t, i, n, o) {
+  const a = t || n, u = i || o;
+  if (!a || !u)
+    return { width: n, height: o };
+  const d = a / u, f = n / o;
+  switch (e) {
+    case "none":
+      return { width: a, height: u };
+    case "cover":
+      return d > f ? { width: o * d, height: o } : { width: n, height: n / d };
+    case "stretch":
+      return { width: n, height: o };
+    default:
+      return d > f ? { width: n, height: n / d } : { width: o * d, height: o };
   }
 }
-const le = 100, $ = /* @__PURE__ */ new Map();
-let de = le;
-function fe(e, t) {
-  $.delete(e), $.set(e, t);
+function Xt(e, t, i, n, o) {
+  const a = "fillMode" in e ? e.fillMode : void 0, { width: u, height: d } = Yt(
+    a,
+    n,
+    o,
+    t,
+    i
+  ), f = "transform" in e ? e.transform : void 0, [g, m] = f?.position ?? [0, 0], [S, w] = f?.scale ?? [1, 1], l = f?.rotation?.[2] ?? 0, h = u * S, b = d * w, T = t / 2 + g * t / 2, I = i / 2 - m * i / 2;
+  return {
+    width: h,
+    height: b,
+    centerX: T,
+    centerY: I,
+    rotationRad: l / 180 * Math.PI
+  };
+}
+function Ht(e) {
+  const t = /* @__PURE__ */ new Set();
+  for (const i of e.tracks)
+    for (const n of i.children)
+      n.url && t.add(n.url);
+  return t;
+}
+function Jt(e, t, i, n, o = {}) {
+  const a = en(o.opacity ?? Zt(t)), u = e instanceof U && e.texture.width || i, d = e instanceof U && e.texture.height || n, f = Xt(t, i, n, u, d);
+  e instanceof U ? (e.anchor.set(0.5), e.width = f.width, e.height = f.height, e.position.set(f.centerX, f.centerY), e.rotation = f.rotationRad, e.texture.source?.addEventListener?.("error", () => {
+    e.texture = $.from(Qt(i, n));
+  }, { once: !0 })) : e instanceof Ze && (e.clear(), e.rect(0, 0, f.width, f.height).fill({ color: nt("url" in t && typeof t.url == "string" ? t.url : t.segmentType), alpha: it(t) ? a : 0.35 }), e.pivot.set(f.width / 2, f.height / 2), e.position.set(f.centerX, f.centerY), e.rotation = f.rotationRad), e.alpha = a;
+}
+function me(e, t) {
+  const i = new Ze();
+  return i.rect(0, 0, 10, 10).fill({ color: nt(t ?? e), alpha: 1 }), i;
+}
+function Qt(e, t, i) {
+  const n = `<svg xmlns="http://www.w3.org/2000/svg" width="${e}" height="${t}"><rect width="100%" height="100%" fill="#0f172a" fill-opacity="0.8"/></svg>`;
+  return `data:image/svg+xml;base64,${btoa(n)}`;
+}
+function nt(e) {
+  let t = 0;
+  for (let i = 0; i < e.length; i++)
+    t = e.charCodeAt(i) + ((t << 5) - t);
+  return t & 16777215;
+}
+function ve(e) {
+  const t = e.tracks.flatMap((i) => i.children.map((n) => n.endTime));
+  return t.length ? Math.max(...t) : 0;
+}
+function pe(e, t, i) {
+  return Math.min(Math.max(e, t), i);
+}
+function je(e) {
+  const t = Dt(e);
+  return JSON.parse(JSON.stringify(t));
+}
+function it(e) {
+  return "opacity" in e;
+}
+function Zt(e) {
+  return it(e) && typeof e.opacity == "number" ? e.opacity : 1;
+}
+function en(e) {
+  return Number.isFinite(e) ? Math.min(Math.max(e, 0), 1) : 1;
+}
+const tn = 0.1, nn = 100;
+function rn(e = {}) {
+  const t = e.now ?? on;
+  let i = !!e.playing, n = qe(e.initialRate), o = 0, a = C(void 0, t), u = he(e.initialTimelineMs);
+  const d = /* @__PURE__ */ new Set();
+  i && (a = C(void 0, t));
+  const f = (w) => i ? u + (w - a) * n : u, g = (w) => ({
+    playing: i,
+    timelineMs: he(f(w)),
+    rate: n,
+    epochWallMs: a,
+    epochTimelineMs: u,
+    discontinuitySeq: o
+  }), m = (w) => {
+    for (const l of d)
+      l(w);
+  }, S = (w, l) => {
+    u = he(w), a = l;
+  };
+  return {
+    getSnapshot(w) {
+      return g(C(w, t));
+    },
+    play(w) {
+      const l = C(w, t);
+      if (!i) {
+        const b = f(l);
+        i = !0, S(b, l);
+      }
+      const h = g(l);
+      return m(h), h;
+    },
+    pause(w) {
+      const l = C(w, t);
+      if (i) {
+        const b = f(l);
+        i = !1, S(b, l);
+      }
+      const h = g(l);
+      return m(h), h;
+    },
+    seek(w, l) {
+      const h = C(l, t);
+      S(w, h), o += 1;
+      const b = g(h);
+      return m(b), b;
+    },
+    setRate(w, l) {
+      const h = C(l, t), b = qe(w), T = f(h);
+      S(T, h), Math.abs(n - b) > 1e-4 && (n = b, o += 1);
+      const I = g(h);
+      return m(I), I;
+    },
+    subscribe(w) {
+      return d.add(w), () => {
+        d.delete(w);
+      };
+    }
+  };
+}
+function C(e, t) {
+  return typeof e == "number" && Number.isFinite(e) ? e : t();
+}
+function he(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 0 : Math.max(0, e);
+}
+function qe(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.min(nn, Math.max(tn, e));
+}
+function on() {
+  return typeof globalThis.performance < "u" && typeof globalThis.performance.now == "function" ? globalThis.performance.now() : Date.now();
+}
+function an(e) {
+  const t = /* @__PURE__ */ new Map(), i = un(e);
+  for (const n of e.transitions ?? [])
+    !cn(n) || i.get(n.fromSegmentId) !== n.toSegmentId || t.set(n.fromSegmentId, {
+      id: n.id,
+      name: n.name,
+      duration: n.duration,
+      fromSegmentId: n.fromSegmentId,
+      toSegmentId: n.toSegmentId
+    });
+  return t;
+}
+function sn(e) {
+  return !e || typeof e != "object" || typeof e.id != "string" || typeof e.name != "string" ? !1 : Number.isFinite(e.duration) && e.duration > 0;
+}
+function cn(e) {
+  return !e || typeof e != "object" || typeof e.fromSegmentId != "string" || typeof e.toSegmentId != "string" ? !1 : sn(e);
 }
-function he() {
-  for (; $.size > de; ) {
-    const [e, t] = $.entries().next().value;
-    $.delete(e), t.close?.();
+function un(e) {
+  const t = /* @__PURE__ */ new Map();
+  for (const i of e.tracks) {
+    if (i.trackType !== "frames")
+      continue;
+    const n = i.children;
+    for (let o = 0; o < n.length - 1; o++) {
+      const a = n[o], u = n[o + 1];
+      !a || !u || t.set(a.id, u.id);
+    }
+  }
+  return t;
+}
+function ne() {
+  return {
+    activeVoices: []
+  };
+}
+function rt(e, t, i = ne()) {
+  const n = te(t.atMs), o = te(t.windowStartMs), a = Math.max(o, te(t.windowEndMs)), u = [], d = /* @__PURE__ */ new Map(), f = wn(e, n), g = an(e);
+  for (let l = 0; l < e.tracks.length; l++) {
+    const h = e.tracks[l], b = yn(e.tracks.length, l, h);
+    for (let T = 0; T < h.children.length; T++) {
+      const I = h.children[T];
+      if (!ot(I, n) || I.segmentType === "effect" || I.segmentType === "filter")
+        continue;
+      I.segmentType !== "audio" && u.push(dn({
+        segment: I,
+        track: h,
+        trackOrder: b,
+        childIndex: T,
+        atMs: n,
+        transition: g.get(I.id),
+        effects: f
+      }));
+      const E = ln(I, h, n);
+      E && d.set(E.voiceId, E);
+    }
+  }
+  u.sort((l, h) => l.zOrder !== h.zOrder ? l.zOrder - h.zOrder : l.segmentId.localeCompare(h.segmentId));
+  const m = /* @__PURE__ */ new Map();
+  for (const l of i.activeVoices)
+    m.set(l.voiceId, l);
+  const S = [];
+  for (const [l, h] of m)
+    d.has(l) || S.push({
+      voiceId: l,
+      segmentId: h.segmentId,
+      trackId: h.trackId,
+      segmentKind: h.segmentKind,
+      action: "stop",
+      atTimelineMs: n
+    });
+  const w = [];
+  for (const l of d.values())
+    w.push({
+      voiceId: l.voiceId,
+      segmentId: l.segmentId,
+      trackId: l.trackId,
+      segmentKind: l.segmentKind
+    }), m.has(l.voiceId) ? t.discontinuity && S.push({
+      voiceId: l.voiceId,
+      segmentId: l.segmentId,
+      trackId: l.trackId,
+      segmentKind: l.segmentKind,
+      action: "seek",
+      atTimelineMs: n,
+      sourceTimeMs: l.sourceTimeMs
+    }) : S.push({
+      voiceId: l.voiceId,
+      segmentId: l.segmentId,
+      trackId: l.trackId,
+      segmentKind: l.segmentKind,
+      action: "start",
+      atTimelineMs: n,
+      sourceTimeMs: l.sourceTimeMs,
+      gain: l.gain,
+      rate: l.rate
+    }), S.push({
+      voiceId: l.voiceId,
+      segmentId: l.segmentId,
+      trackId: l.trackId,
+      segmentKind: l.segmentKind,
+      action: "gain",
+      atTimelineMs: n,
+      gain: l.gain
+    }), S.push({
+      voiceId: l.voiceId,
+      segmentId: l.segmentId,
+      trackId: l.trackId,
+      segmentKind: l.segmentKind,
+      action: "rate",
+      atTimelineMs: n,
+      rate: l.rate
+    });
+  return {
+    plan: {
+      atMs: n,
+      windowStartMs: o,
+      windowEndMs: a,
+      visuals: u,
+      audioEvents: S
+    },
+    state: {
+      activeVoices: w
+    }
+  };
+}
+function dn(e) {
+  const {
+    segment: t,
+    track: i,
+    trackOrder: n,
+    childIndex: o,
+    atMs: a,
+    transition: u,
+    effects: d
+  } = e;
+  return {
+    segmentId: t.id,
+    trackId: i.trackId,
+    trackType: i.trackType,
+    segmentType: t.segmentType,
+    zOrder: n * 1e4 + o,
+    sourceTimeMs: fn(t, a),
+    opacity: pn(t),
+    transition: mn(t, u, a),
+    effects: d.length ? d : void 0
+  };
+}
+function ln(e, t, i) {
+  if (tt(e)) {
+    const n = Math.max(0, i - e.startTime);
+    return {
+      voiceId: `audio:${e.id}`,
+      segmentId: e.id,
+      trackId: t.trackId,
+      segmentKind: "audio",
+      sourceTimeMs: Me(e, i),
+      gain: hn(e, n),
+      rate: Se(e.playRate)
+    };
+  }
+  if (Ie(e)) {
+    const n = ke(e.volume);
+    return n <= 0 ? void 0 : {
+      voiceId: `video:${e.id}`,
+      segmentId: e.id,
+      trackId: t.trackId,
+      segmentKind: "video",
+      sourceTimeMs: Me(e, i),
+      gain: n,
+      rate: Se(e.playRate)
+    };
   }
 }
-function pe(e) {
+function fn(e, t) {
+  return tt(e) || Ie(e) ? Me(e, t) : Math.max(0, t - e.startTime);
+}
+function Me(e, t) {
+  const i = Math.max(0, t - e.startTime), n = te(e.fromTime ?? 0), o = Se(e.playRate);
+  return Math.max(0, n + i * o);
+}
+function mn(e, t, i) {
+  if (e.segmentType !== "frames" || !t || t.fromSegmentId !== e.id)
+    return;
+  const n = e.endTime - t.duration;
+  if (i < n || i >= e.endTime)
+    return;
+  const o = (i - n) / t.duration;
+  return {
+    fromSegmentId: e.id,
+    toSegmentId: t.toSegmentId,
+    progress: ie(o, 0, 1),
+    transitionId: t.id,
+    transitionName: t.name,
+    durationMs: t.duration
+  };
+}
+function ot(e, t) {
+  return e.startTime <= t && t < e.endTime;
+}
+function pn(e) {
+  return "opacity" in e && typeof e.opacity == "number" && Number.isFinite(e.opacity) ? ie(e.opacity, 0, 1) : 1;
+}
+function hn(e, t) {
+  const i = ke(e.volume), n = Math.max(0, e.endTime - e.startTime), o = Math.max(0, e.fadeInDuration ?? 0), a = Math.max(0, e.fadeOutDuration ?? 0);
+  let u = 1;
+  o > 0 && t < o && (u = Math.max(0, t / o));
+  const d = n - t;
+  return a > 0 && d < a && (u = Math.min(u, Math.max(0, d / a))), i * u;
+}
+function yn(e, t, i) {
+  return i.trackType === "frames" && "isMain" in i && i.isMain ? 0 : e - t;
+}
+function wn(e, t) {
+  const i = [];
+  for (const n of e.tracks)
+    for (const o of n.children)
+      ot(o, t) && (o.segmentType === "effect" ? i.push({
+        segmentType: "effect",
+        segmentId: o.id,
+        effectId: o.effectId,
+        name: o.name
+      }) : o.segmentType === "filter" && i.push({
+        segmentType: "filter",
+        segmentId: o.id,
+        filterId: o.filterId,
+        name: o.name,
+        intensity: ke(o.intensity)
+      }));
+  return i;
+}
+function te(e) {
+  return Number.isFinite(e) ? Math.max(0, e) : 0;
+}
+function ke(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 1 : ie(e, 0, 1);
+}
+function Se(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 1 : ie(e, 0.1, 100);
+}
+function ie(e, t, i) {
+  return Math.min(Math.max(e, t), i);
+}
+function at() {
+  let e = ne();
+  return {
+    evaluate(t, i) {
+      const n = rt(t, i, e);
+      return e = n.state, n.plan;
+    },
+    reset() {
+      e = ne();
+    },
+    getState() {
+      return e;
+    }
+  };
+}
+const gn = 20, vn = 100;
+function Mn(e) {
+  const t = _e(e.lookbackMs, gn), i = _e(e.lookaheadMs, vn), n = at();
+  let o = e.transport.getSnapshot().discontinuitySeq;
+  return {
+    evaluate(a, u) {
+      const d = e.transport.getSnapshot(), f = Sn(typeof u == "number" ? u : d.timelineMs), g = d.discontinuitySeq !== o;
+      return g && (o = d.discontinuitySeq), n.evaluate(a, {
+        atMs: f,
+        windowStartMs: Math.max(0, f - t),
+        windowEndMs: f + i,
+        fps: Math.max(a.fps || 30, 1),
+        discontinuity: g
+      });
+    },
+    reset() {
+      n.reset(), o = e.transport.getSnapshot().discontinuitySeq;
+    },
+    getState() {
+      return n.getState();
+    }
+  };
+}
+function _e(e, t) {
+  return typeof e != "number" || !Number.isFinite(e) ? t : Math.max(0, e);
+}
+function Sn(e) {
+  return Number.isFinite(e) ? Math.max(0, e) : 0;
+}
+function Tn() {
+  const e = at();
+  let t;
+  return {
+    evaluateAt(i, n, o = {}) {
+      const a = ye(n), u = ye(o.windowStartMs ?? a), d = Math.max(
+        u,
+        ye(o.windowEndMs ?? a)
+      ), f = {
+        atMs: a,
+        windowStartMs: u,
+        windowEndMs: d,
+        fps: Math.max(i.fps || 30, 1),
+        discontinuity: typeof o.discontinuity == "boolean" ? o.discontinuity : t !== void 0 && a < t
+      };
+      return t = a, e.evaluate(i, f);
+    },
+    evaluateSequence(i, n) {
+      const o = [];
+      for (const a of n)
+        o.push(this.evaluateAt(i, a));
+      return o;
+    },
+    reset() {
+      e.reset(), t = void 0;
+    },
+    getState() {
+      return e.getState();
+    }
+  };
+}
+function ye(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 0 : Math.max(0, e);
+}
+const bn = 20;
+function In(e) {
+  const t = kn(e.intervalMs, bn), i = e.setInterval ?? ((u, d) => globalThis.setInterval(u, d)), n = e.clearInterval ?? ((u) => {
+    globalThis.clearInterval(u);
+  });
+  let o;
+  const a = () => {
+    const u = e.transport.getSnapshot(), d = e.runner.evaluate(e.getProtocol(), u.timelineMs);
+    return e.onPlan(d, u), d;
+  };
+  return {
+    start() {
+      o === void 0 && (a(), o = i(() => {
+        a();
+      }, t));
+    },
+    stop() {
+      o !== void 0 && (n(o), o = void 0);
+    },
+    tick: a,
+    isRunning() {
+      return o !== void 0;
+    }
+  };
+}
+function kn(e, t) {
+  return typeof e != "number" || !Number.isFinite(e) ? t : Math.max(1, e);
+}
+function xn(e, t) {
+  const i = An(e), n = /* @__PURE__ */ new Set();
+  for (const a of t)
+    n.add(a.segmentId);
+  const o = [];
+  for (const a of t) {
+    const u = i.get(a.segmentId);
+    if (!u)
+      continue;
+    const d = Te(a.transition?.progress ?? 0), f = Te(a.opacity) * (a.transition ? 1 - d : 1);
+    if (o.push({
+      segment: u,
+      sourceTimeMs: Math.max(0, a.sourceTimeMs),
+      opacity: f,
+      includeAudio: !0,
+      effects: a.effects
+    }), !a.transition || d <= 0 || n.has(a.transition.toSegmentId))
+      continue;
+    const g = i.get(a.transition.toSegmentId);
+    if (!g)
+      continue;
+    const m = st(a.transition.durationMs);
+    if (m <= 0)
+      continue;
+    const S = m * d, w = En(g, S), l = Rn(g) * d;
+    o.push({
+      segment: g,
+      sourceTimeMs: w,
+      opacity: l,
+      includeAudio: !1,
+      effects: a.effects
+    });
+  }
+  return o;
+}
+function An(e) {
+  const t = /* @__PURE__ */ new Map();
+  for (const i of e.tracks)
+    for (const n of i.children)
+      t.set(n.id, n);
+  return t;
+}
+function En(e, t) {
+  if (Ie(e)) {
+    const i = st(e.fromTime), n = Vn(e.playRate);
+    return Math.max(0, i + t * n);
+  }
+  return Math.max(0, t);
+}
+function Rn(e) {
+  return "opacity" in e && typeof e.opacity == "number" && Number.isFinite(e.opacity) ? Te(e.opacity) : 1;
+}
+function st(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 0 : Math.max(0, e);
+}
+function Vn(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.min(Math.max(e, 0.1), 100);
+}
+function Te(e) {
+  return Number.isFinite(e) ? Math.min(Math.max(e, 0), 1) : 0;
+}
+function Fn(e) {
+  if (!e?.length)
+    return [];
+  const t = [];
+  for (const i of e) {
+    const n = i.segmentType === "filter" ? Pn(i) : On(i);
+    n && t.push(n);
+  }
+  return t;
+}
+function Pn(e) {
+  const t = ut(e.name, e.filterId), i = Cn(e.intensity);
+  if (ct(t))
+    return new et({ strength: 1 + i * 14, quality: 2, kernelSize: 5 });
+  const n = new ge();
+  return zn(t) ? n.grayscale(i, !1) : t.includes("sepia") || t.includes("warm") ? n.sepia(!1) : t.includes("negative") || t.includes("invert") ? n.negative(!1) : t.includes("vintage") || t.includes("retro") ? n.vintage(!1) : t.includes("contrast") ? n.contrast(0.5 + i * 0.5, !1) : t.includes("brightness") || t.includes("bright") ? n.brightness(0.5 + i, !1) : t.includes("saturate") || t.includes("vivid") ? n.saturate(i, !1) : t.includes("cool") ? n.hue(-20 * i, !1) : n.saturate(-0.3 * i, !1), n;
+}
+function On(e) {
+  const t = ut(e.name, e.effectId);
+  if (ct(t) || t.includes("glow") || t.includes("dream") || t.includes("soft"))
+    return new et({ strength: 4, quality: 2, kernelSize: 5 });
+  if (t.includes("vintage") || t.includes("retro")) {
+    const i = new ge();
+    return i.vintage(!1), i;
+  }
+  if (t.includes("sharpen") || t.includes("clarity")) {
+    const i = new ge();
+    return i.contrast(0.75, !1), i;
+  }
+}
+function ct(e) {
+  return e.includes("blur") || e.includes("gaussian");
+}
+function zn(e) {
+  return e.includes("grayscale") || e.includes("grey") || e.includes("gray") || e.includes("mono") || e.includes("blackwhite") || e.includes("bw");
+}
+function ut(...e) {
+  return e.join(" ").toLowerCase().replace(/[^a-z0-9]+/g, "");
+}
+function Cn(e) {
+  return Number.isFinite(e) ? Math.min(Math.max(e, 0), 1) : 1;
+}
+function Un(e) {
+  const t = Dn(e), i = $n(t);
+  if (!i.length)
+    return [];
+  const n = [], o = /* @__PURE__ */ new Map(), u = Tn().evaluateSequence(e, i);
+  for (const d of u)
+    for (const f of d.audioEvents)
+      Nn(f, t, o, n);
+  for (const d of o.values()) {
+    const f = dt(d, t, Kn(d, t));
+    f && n.push(f);
+  }
+  return n.sort((d, f) => d.startTime !== f.startTime ? d.startTime - f.startTime : d.endTime !== f.endTime ? d.endTime - f.endTime : d.segmentId.localeCompare(f.segmentId));
+}
+function Nn(e, t, i, n) {
+  if (e.action === "start") {
+    const u = xe(e.segmentKind, e.segmentId, t);
+    if (!u || lt(u) <= 0)
+      return;
+    const f = {
+      voiceId: e.voiceId,
+      segmentKind: e.segmentKind,
+      segmentId: e.segmentId,
+      startTime: e.atTimelineMs,
+      fromTime: Math.max(0, e.sourceTimeMs ?? Gn(u)),
+      playRate: ft(e.rate ?? Ln(u))
+    };
+    i.set(e.voiceId, f);
+    return;
+  }
+  if (e.action !== "stop")
+    return;
+  const o = i.get(e.voiceId);
+  if (!o)
+    return;
+  i.delete(e.voiceId);
+  const a = dt(o, t, e.atTimelineMs);
+  a && n.push(a);
+}
+function dt(e, t, i) {
+  const n = xe(e.segmentKind, e.segmentId, t);
+  if (!n)
+    return;
+  const o = Xe(e.startTime, n.startTime, n.endTime), a = Xe(i, o, n.endTime);
+  if (a <= o)
+    return;
+  const u = {
+    segmentId: n.id,
+    segmentKind: e.segmentKind,
+    url: n.url,
+    startTime: o,
+    endTime: a,
+    fromTime: e.fromTime,
+    playRate: e.playRate,
+    volume: lt(n)
+  };
+  if (n.segmentType === "audio") {
+    const d = Math.max(0, a - o);
+    return {
+      ...u,
+      fadeInDuration: Ye(n.fadeInDuration, d),
+      fadeOutDuration: Ye(n.fadeOutDuration, d)
+    };
+  }
+  return u;
+}
+function Dn(e) {
+  const t = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
+  for (const n of e.tracks)
+    for (const o of n.children)
+      o.segmentType === "audio" ? t.set(o.id, o) : o.segmentType === "frames" && o.type === "video" && i.set(o.id, o);
+  return { audioById: t, videoById: i };
+}
+function $n(e) {
+  const t = /* @__PURE__ */ new Set([0]);
+  for (const i of e.audioById.values())
+    We(t, i.startTime, i.endTime);
+  for (const i of e.videoById.values())
+    We(t, i.startTime, i.endTime);
+  return [...t].sort((i, n) => i - n);
+}
+function We(e, t, i) {
+  !Number.isFinite(t) || !Number.isFinite(i) || i <= t || (e.add(Math.max(0, t)), e.add(Math.max(0, i)));
+}
+function xe(e, t, i) {
+  return e === "audio" ? i.audioById.get(t) : i.videoById.get(t);
+}
+function Kn(e, t) {
+  const i = xe(e.segmentKind, e.segmentId, t);
+  return i ? i.endTime : e.startTime;
+}
+function Gn(e) {
+  return typeof e.fromTime != "number" || !Number.isFinite(e.fromTime) ? 0 : Math.max(0, e.fromTime);
+}
+function Ln(e) {
+  return ft(e.playRate);
+}
+function lt(e) {
+  return Bn(e.volume);
+}
+function Ye(e, t) {
+  return typeof e != "number" || !Number.isFinite(e) ? 0 : Math.max(0, Math.min(e, t));
+}
+function ft(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0.1, Math.min(100, e));
+}
+function Bn(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0, Math.min(1, e));
+}
+function Xe(e, t, i) {
+  return Math.min(Math.max(e, t), i);
+}
+const jn = 100, N = /* @__PURE__ */ new Map();
+let qn = jn;
+function _n(e, t) {
+  N.delete(e), N.set(e, t);
+}
+function Wn() {
+  for (; N.size > qn; ) {
+    const [e, t] = N.entries().next().value;
+    N.delete(e), t.close?.();
+  }
+}
+function Yn(e) {
   return e.map((t) => t.content).filter(Boolean).join(`
 `);
 }
-function me(e) {
-  const t = Array.isArray(e.fontFamily) ? e.fontFamily.join(", ") : e.fontFamily, o = e.fontSize ?? 32, i = e.fontWeight ?? "normal", n = e.fontStyle ?? "normal", a = e.fill ?? "#ffffff", c = e.align ?? "left", u = [
-    `font-size: ${o}px`,
-    `font-weight: ${i}`,
-    `font-style: ${n}`,
+function Xn(e) {
+  const t = Array.isArray(e.fontFamily) ? e.fontFamily.join(", ") : e.fontFamily, i = e.fontSize ?? 32, n = e.fontWeight ?? "normal", o = e.fontStyle ?? "normal", a = e.fill ?? "#ffffff", u = e.align ?? "left", d = [
+    `font-size: ${i}px`,
+    `font-weight: ${n}`,
+    `font-style: ${o}`,
     `color: ${a}`,
-    `text-align: ${c}`,
+    `text-align: ${u}`,
     "white-space: pre-wrap"
   ];
-  if (t && u.push(`font-family: ${t}`), typeof e.letterSpacing == "number" && u.push(`letter-spacing: ${e.letterSpacing}px`), typeof e.leading == "number" && u.push(`line-height: ${e.leading}px`), e.background?.color && u.push(`background: ${e.background.color}`), e.stroke?.color && typeof e.stroke.width == "number" && u.push(`-webkit-text-stroke: ${e.stroke.width}px ${e.stroke.color}`), e.underline && u.push("text-decoration: underline"), e.dropShadow?.color && typeof e.dropShadow.distance == "number") {
-    const d = (e.dropShadow.angle ?? 45) * (Math.PI / 180), y = Math.cos(d) * e.dropShadow.distance, h = Math.sin(d) * e.dropShadow.distance, w = e.dropShadow.blur ?? 0;
-    u.push(`text-shadow: ${y}px ${h}px ${w}px ${e.dropShadow.color}`);
-  }
-  return u.join("; ");
-}
-async function ye(e, t) {
-  const o = `${t}::${e}`, i = $.get(o);
-  if (i)
-    return fe(o, i), i;
-  const n = await Zt(e, t);
-  return $.set(o, n), he(), n;
-}
-const we = "/video-editor-res";
-async function ve(e) {
-  const t = Wt(), o = Jt(e.protocol) ? e.protocol : vt(e.protocol), i = vt(
-    t.verify(St(Mt(o)))
-  ), n = e.app ?? await oe(e.appOptions), a = new ee();
-  n.stage.addChild(a);
-  const c = Yt({ dir: e.resourceDir }), u = /* @__PURE__ */ new Set(), d = /* @__PURE__ */ new Map(), y = /* @__PURE__ */ new Map(), h = /* @__PURE__ */ new Set(), w = /* @__PURE__ */ new Set(), M = e.videoSourceMode ?? "auto", p = /* @__PURE__ */ new Map(), v = /* @__PURE__ */ new Map(), m = gt(0), g = gt(!1), R = Ht(() => it(i.value)), P = new ue(i.value);
-  let A, E = 0, b = 0;
-  async function q(r) {
-    const l = b, { protocol: s, at: f, layer: S } = r, x = Kt(s, f), T = Rt(s, x), k = r.app.renderer.width, C = r.app.renderer.height;
-    P.sync(f, g.value);
-    const I = [];
-    for (const { segment: N } of T) {
-      if (l !== b)
+  if (t && d.push(`font-family: ${t}`), typeof e.letterSpacing == "number" && d.push(`letter-spacing: ${e.letterSpacing}px`), typeof e.leading == "number" && d.push(`line-height: ${e.leading}px`), e.background?.color && d.push(`background: ${e.background.color}`), e.stroke?.color && typeof e.stroke.width == "number" && d.push(`-webkit-text-stroke: ${e.stroke.width}px ${e.stroke.color}`), e.underline && d.push("text-decoration: underline"), e.dropShadow?.color && typeof e.dropShadow.distance == "number") {
+    const f = (e.dropShadow.angle ?? 45) * (Math.PI / 180), g = Math.cos(f) * e.dropShadow.distance, m = Math.sin(f) * e.dropShadow.distance, S = e.dropShadow.blur ?? 0;
+    d.push(`text-shadow: ${g}px ${m}px ${S}px ${e.dropShadow.color}`);
+  }
+  return d.join("; ");
+}
+async function Hn(e, t) {
+  const i = `${t}::${e}`, n = N.get(i);
+  if (n)
+    return _n(i, n), n;
+  const o = await Lt(e, t);
+  return N.set(i, o), Wn(), o;
+}
+const Jn = "/video-editor-res", Qn = 1500, Zn = 2;
+async function ei(e) {
+  const t = Ut(), i = $t(e.protocol) ? e.protocol : Ge(e.protocol), n = Ge(
+    t.verify(je(Le(i)))
+  ), o = e.app ?? await _t(e.appOptions), a = new qt();
+  o.stage.addChild(a);
+  const u = Nt({ dir: e.resourceDir }), d = /* @__PURE__ */ new Set(), f = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Set(), S = /* @__PURE__ */ new Set(), w = e.videoSourceMode ?? "auto", l = /* @__PURE__ */ new Map(), h = /* @__PURE__ */ new Map(), b = /* @__PURE__ */ new Set(), T = Be(0), I = Be(!1), E = Kt(() => ve(n.value)), A = /* @__PURE__ */ new Map(), R = /* @__PURE__ */ new Map(), x = new Wt(n.value, {
+    resolveMediaElementUrl: Ft
+  }), O = rn({
+    initialTimelineMs: T.value,
+    initialRate: 1,
+    playing: !1
+  }), re = Mn({
+    transport: O
+  }), G = In({
+    transport: O,
+    runner: re,
+    getProtocol: () => n.value,
+    onPlan: (r) => {
+      Re(r);
+    }
+  });
+  let L, W = 0, P = 0;
+  function Y() {
+    re.reset(), x.resetTimelineState({ stop: !0 });
+  }
+  function Re(r) {
+    x.applyTimelinePlan(r, I.value);
+  }
+  function pt(r, c) {
+    if (I.value)
+      return;
+    const s = re.evaluate(r, c);
+    Re(s);
+  }
+  async function ht(r) {
+    const c = P, { protocol: s, at: p, layer: v } = r, M = Vt(s, p), y = r.app.renderer.width, k = r.app.renderer.height;
+    pt(s, p), It(s, M);
+    const V = rt(s, {
+      atMs: M,
+      windowStartMs: M,
+      windowEndMs: M,
+      fps: Math.max(s.fps || 30, 1)
+    }, ne()).plan.visuals, F = xn(s, V), D = /* @__PURE__ */ new Map(), Q = [];
+    for (const Z of F) {
+      const { segment: ee } = Z;
+      if (c !== P)
         return;
-      const L = await r.getDisplay(N);
-      if (l !== b)
+      const q = await r.getDisplay(ee);
+      if (c !== P)
         return;
-      if (L && !L.destroyed) {
-        if (ae(L, N, k, C), Gt(N) && await H(N, x), l !== b)
+      if (q && !q.destroyed) {
+        if (yt(q, Z.effects, D), Jt(q, ee, y, k, {
+          opacity: Z.opacity
+        }), H(ee) && await X(ee, Z.sourceTimeMs), c !== P)
           return;
-        I.push(L);
+        Q.push(q);
       }
     }
-    if (l !== b)
+    if (c !== P)
       return;
-    S.removeChildren();
-    const U = I.filter(Boolean);
-    U.length && S.addChild(...U), l === b && r.app.render();
+    v.removeChildren();
+    const j = Q.filter(Boolean);
+    j.length && v.addChild(...j), c === P && r.app.render();
+  }
+  function yt(r, c, s) {
+    const p = c?.length ? JSON.stringify(c) : "";
+    let v = s.get(p);
+    v === void 0 && (v = c?.length ? Fn(c) : null, s.set(p, v)), r.filters = v;
   }
-  const D = Me(() => q({
-    app: n,
+  const oe = ti(() => ht({
+    app: o,
     layer: a,
-    protocol: i.value,
-    at: m.value,
-    getDisplay: Lt
-  })), z = Qt();
-  z.run(() => {
-    Z(
-      () => Mt(o),
+    protocol: n.value,
+    at: T.value,
+    getDisplay: bt
+  })), Ve = Gt();
+  Ve.run(() => {
+    fe(
+      () => Le(i),
       (r) => {
         try {
-          i.value = t.verify(St(r));
-        } catch (l) {
-          console.error("[renderer] invalid protocol update", l);
+          n.value = t.verify(je(r));
+        } catch (c) {
+          console.error("[renderer] invalid protocol update", c);
           return;
         }
-        P.setProtocol(i.value), b += 1, _(), e.warmUpResources !== !1 && F(i.value), Y(i.value), O(), e.manualRender || D();
+        x.setProtocol(n.value), Y(), I.value && G.tick(), P += 1, Fe(), e.warmUpResources !== !1 && (wt(n.value), gt(n.value)), vt(n.value), Mt(n.value), ae(), e.manualRender || oe();
       },
       { deep: !0, immediate: !0 }
-    ), e.manualRender || Z(m, () => {
-      O(), D();
-    }), Z(R, () => O());
+    ), e.manualRender || fe(T, () => {
+      ae(), oe();
+    }), fe(E, () => ae());
   });
-  function O() {
-    const r = R.value;
-    r <= 0 ? m.value = 0 : m.value > r ? m.value = r : m.value < 0 && (m.value = 0);
+  function ae() {
+    const r = E.value;
+    r <= 0 ? T.value = 0 : T.value > r ? T.value = r : T.value < 0 && (T.value = 0);
   }
-  function F(r) {
-    for (const l of ne(r))
-      u.has(l) || (u.add(l), mt(l) !== "video" && ft(l) && c.add(l).catch(() => {
+  function wt(r) {
+    for (const c of Ht(r))
+      d.has(c) || (d.add(c), De(c) !== "video" && de(c) && u.add(c).catch(() => {
       }));
   }
-  function Y(r) {
-    const l = /* @__PURE__ */ new Set();
+  function gt(r) {
+    for (const c of r.tracks)
+      for (const s of c.children)
+        H(s) && ((s.volume ?? 1) <= 0 || ue(s.url));
+  }
+  function vt(r) {
+    const c = /* @__PURE__ */ new Set();
+    for (const s of r.tracks)
+      for (const p of s.children)
+        c.add(p.id);
+    for (const [s, p] of f)
+      c.has(s) || (p.destroy(), f.delete(s));
+    for (const [s, p] of l)
+      c.has(s) || (Ue(p), l.delete(s));
+  }
+  function Mt(r) {
+    const c = /* @__PURE__ */ new Set();
     for (const s of r.tracks)
-      for (const f of s.children)
-        l.add(f.id);
-    for (const [s, f] of d)
-      l.has(s) || (f.destroy(), d.delete(s));
-    for (const [s, f] of p)
-      l.has(s) || (ht(f), p.delete(s));
-  }
-  function _() {
+      for (const p of s.children) {
+        if (!H(p))
+          continue;
+        const v = z(p.url);
+        v && c.add(v);
+      }
+    for (const [s, p] of A)
+      c.has(s) || (URL.revokeObjectURL(p), A.delete(s));
+  }
+  function Fe() {
     a.removeChildren();
-    for (const r of d.values())
+    for (const r of f.values())
       r.destroy();
-    d.clear(), y.clear();
-    for (const r of p.values())
-      ht(r);
-    p.clear();
+    f.clear(), g.clear();
+    for (const r of l.values())
+      Ue(r);
+    l.clear();
   }
-  function ct() {
-    g.value || (g.value = !0, E = performance.now(), A = requestAnimationFrame(ut));
+  function Pe() {
+    if (I.value)
+      return;
+    I.value = !0;
+    const r = performance.now();
+    O.seek(T.value, r), O.play(r), G.start(), W = r, L = requestAnimationFrame(Oe);
   }
-  function X() {
-    g.value = !1, A !== void 0 && cancelAnimationFrame(A), A = void 0, P.sync(m.value, !1), e.freezeOnPause !== !1 && qt();
+  function se() {
+    I.value = !1;
+    const r = performance.now();
+    O.pause(r), G.stop(), Y(), L !== void 0 && cancelAnimationFrame(L), L = void 0, e.freezeOnPause !== !1 && Pt();
   }
-  function ut() {
-    lt(), g.value && (A = requestAnimationFrame(ut));
+  function Oe() {
+    ze(), I.value && (L = requestAnimationFrame(Oe));
   }
-  function lt(r) {
-    if (!g.value && r === void 0)
+  function ze(r) {
+    if (!I.value && r === void 0)
       return;
-    const l = performance.now(), s = r ?? (E ? l - E : 0);
-    E = l, s !== 0 && (m.value = et(
-      m.value + s,
+    const c = performance.now(), s = r ?? (W ? c - W : 0);
+    W = c, s !== 0 && (T.value = pe(
+      T.value + s,
       0,
-      R.value || Number.POSITIVE_INFINITY
-    ), R.value > 0 && m.value >= R.value && X());
+      E.value || Number.POSITIVE_INFINITY
+    ), E.value > 0 && T.value >= E.value && se());
   }
-  function Ut(r) {
-    m.value = et(r, 0, R.value || Number.POSITIVE_INFINITY);
+  function St(r) {
+    T.value = pe(r, 0, E.value || Number.POSITIVE_INFINITY), O.seek(T.value, performance.now()), Y(), I.value && G.tick();
   }
-  async function Ot(r) {
-    m.value = et(r, 0, R.value || Number.POSITIVE_INFINITY), await D();
+  async function Tt(r) {
+    T.value = pe(r, 0, E.value || Number.POSITIVE_INFINITY), O.seek(T.value, performance.now()), Y(), I.value && G.tick(), await oe();
   }
-  async function Lt(r) {
-    const l = d.get(r.id);
-    if (l)
-      return l;
-    const s = y.get(r.id);
+  async function bt(r) {
+    const c = f.get(r.id);
+    if (c)
+      return c;
+    const s = g.get(r.id);
     if (s)
       return s;
-    const f = Vt(r);
-    y.set(r.id, f);
-    const S = await f;
-    return S && d.set(r.id, S), y.delete(r.id), S;
+    const p = Ce(r);
+    g.set(r.id, p);
+    const v = await p;
+    return v && f.set(r.id, v), g.delete(r.id), v;
   }
-  async function Vt(r) {
+  function It(r, c) {
+    const s = Zn - b.size;
+    if (s <= 0)
+      return;
+    const p = c + Qn, v = [];
+    for (const M of r.tracks)
+      for (const y of M.children)
+        H(y) && (y.startTime <= c || y.startTime > p || f.has(y.id) || g.has(y.id) || b.has(y.id) || v.push(y));
+    v.sort((M, y) => M.startTime - y.startTime);
+    for (const M of v.slice(0, s))
+      kt(M);
+  }
+  async function kt(r) {
+    b.add(r.id);
+    try {
+      const c = await Ce(r);
+      c && !f.has(r.id) && f.set(r.id, c), await X(r, Math.max(r.fromTime ?? 0, 0));
+    } catch (c) {
+      console.error("[renderer] failed to preload upcoming video segment", r.url, c);
+    } finally {
+      b.delete(r.id);
+    }
+  }
+  async function Ce(r) {
     if (r.segmentType === "frames" || r.segmentType === "sticker") {
       if (!r.url)
-        return tt(r.segmentType);
-      if ("type" in r && r.type === "video" && yt(r.url)) {
-        const s = await zt(r);
-        return s || tt(r.segmentType, r.url);
+        return me(r.segmentType);
+      if ("type" in r && r.type === "video" && $e(r.url)) {
+        const s = await Et(r);
+        return s || me(r.segmentType, r.url);
       }
-      const l = await Dt(r.url);
-      return l ? new V(l) : tt(r.segmentType, r.url);
+      const c = await At(r.url);
+      return c ? new U(c) : me(r.segmentType, r.url);
     }
     if (r.segmentType === "text")
-      return await $t(r);
+      return await xt(r);
     r.segmentType === "effect" || r.segmentType;
   }
-  async function $t(r) {
-    const l = pe(r.texts);
-    if (!l)
+  async function xt(r) {
+    const c = Yn(r.texts);
+    if (!c)
       return;
     const [s] = r.texts;
     if (!s)
       return;
-    const f = await ye(l, me(s)), S = G.from(f);
-    return new V(S);
+    const p = await Hn(c, Xn(s)), v = $.from(p);
+    return new U(v);
   }
-  async function Dt(r) {
-    const l = r.startsWith("data:"), s = /^https?:\/\//.test(r);
-    if (!l && !s)
+  async function At(r) {
+    const c = r.startsWith("data:"), s = /^https?:\/\//.test(r);
+    if (!c && !s)
       try {
-        await c.add(r);
-        const f = await c.get(r);
-        if (f instanceof HTMLImageElement)
-          return G.from(f);
+        await u.add(r);
+        const p = await u.get(r);
+        if (p instanceof HTMLImageElement)
+          return $.from(p);
       } catch {
       }
-    return await jt(r);
-  }
-  async function zt(r) {
-    const l = p.get(r.id);
-    if (l)
-      return l.sprite;
-    const s = W(r.url), f = M !== "element", S = M !== "mp4clip";
-    if (s && h.has(s)) {
-      if (!S)
+    return await zt(r);
+  }
+  async function Et(r) {
+    const c = l.get(r.id);
+    if (c)
+      return c.sprite;
+    ue(r.url);
+    const s = z(r.url), p = w !== "element", v = w !== "mp4clip";
+    if (s && m.has(s)) {
+      if (!v)
         throw new Error(`[renderer] MP4Clip unsupported for ${r.url}`);
-      const x = await B(r.url).catch((T) => {
-        console.warn("[renderer] failed to load video via <video>", r.url, T);
+      const M = await B(r.url).catch((y) => {
+        console.warn("[renderer] failed to load video via <video>", r.url, y);
       });
-      return x ? (p.set(r.id, x), x.sprite) : void 0;
+      return M ? (l.set(r.id, M), M.sprite) : void 0;
     }
-    if (f) {
-      const x = await pt(r.url).catch((T) => {
-        if (s && J(T) && h.add(s), (!s || !w.has(s)) && (s && w.add(s), console.warn("[renderer] failed to load video via MP4Clip", r.url, T)), !S)
-          throw T;
+    if (p) {
+      const M = await Ne(r.url).catch((y) => {
+        if (s && ce(y) && m.add(s), (!s || !S.has(s)) && (s && S.add(s), console.warn("[renderer] failed to load video via MP4Clip", r.url, y)), !v)
+          throw y;
       });
-      if (x)
-        return console.info("[renderer] video source: mp4clip", r.url), p.set(r.id, x), x.sprite;
+      if (M)
+        return console.info("[renderer] video source: mp4clip", r.url), l.set(r.id, M), M.sprite;
     }
-    if (S) {
-      const x = await B(r.url).catch((T) => {
-        console.warn("[renderer] failed to load video via <video>", r.url, T);
+    if (v) {
+      const M = await B(r.url).catch((y) => {
+        console.warn("[renderer] failed to load video via <video>", r.url, y);
       });
-      if (x)
-        return console.info("[renderer] video source: element", r.url), p.set(r.id, x), x.sprite;
+      if (M)
+        return console.info("[renderer] video source: element", r.url), l.set(r.id, M), M.sprite;
     }
   }
-  function J(r) {
+  function ce(r) {
     if (!(r instanceof Error))
       return !1;
-    const l = r.message || "";
-    return l.includes("stream is done") || l.includes("not emit ready") || l.includes("tick video timeout");
+    const c = r.message || "";
+    return c.includes("stream is done") || c.includes("not emit ready") || c.includes("tick video timeout");
   }
-  async function H(r, l) {
-    const s = p.get(r.id);
+  async function X(r, c) {
+    const s = l.get(r.id);
     if (s)
       try {
-        const f = r.fromTime ?? 0, S = Math.max(0, l - r.startTime + f), x = Math.floor(S * 1e3);
+        const p = Math.max(0, c), v = Math.floor(p * 1e3);
         if (s.kind === "frozen") {
-          const k = W(r.url);
-          if (!k)
+          const y = z(r.url);
+          if (!y)
             return;
-          const C = await Nt(r.url, k, { sprite: s.sprite, oldTexture: s.texture });
-          return C ? (p.set(r.id, C), await H(r, l)) : void 0;
+          const k = await Rt(r.url, y, { sprite: s.sprite, oldTexture: s.texture });
+          return k ? (l.set(r.id, k), await X(r, c)) : void 0;
         }
         if (s.kind === "mp4clip")
           try {
-            const k = await s.clip.tick(x);
-            if (k.video) {
-              const C = s.canvas.getContext("2d");
-              C && (C.drawImage(k.video, 0, 0, s.canvas.width, s.canvas.height), wt(s.texture)), k.video.close();
-            }
-            if (g.value && k.audio && k.audio.length > 0) {
-              const C = s.clip.meta?.audioSampleRate ?? 48e3;
-              P.playMp4AudioFrames(r.id, k.audio, C);
+            const y = await s.clip.tick(v);
+            if (y.video) {
+              const k = s.canvas.getContext("2d");
+              k && (k.drawImage(y.video, 0, 0, s.canvas.width, s.canvas.height), Ke(s.texture)), y.video.close();
             }
             return;
-          } catch (k) {
-            const C = W(r.url);
-            if (C && J(k) && (h.add(C), s.clip.destroy(), M !== "mp4clip")) {
-              const I = await B(r.url, { sprite: s.sprite, oldTexture: s.texture }).catch((U) => {
-                console.warn("[renderer] failed to fallback to <video> after MP4Clip error", r.url, U);
+          } catch (y) {
+            const k = z(r.url);
+            if (k && ce(y) && (m.add(k), s.clip.destroy(), w !== "mp4clip")) {
+              const V = await B(r.url, { sprite: s.sprite, oldTexture: s.texture }).catch((F) => {
+                console.warn("[renderer] failed to fallback to <video> after MP4Clip error", r.url, F);
               });
-              if (I)
-                return p.set(r.id, I), await H(r, l);
+              if (V)
+                return l.set(r.id, V), await X(r, c);
             }
-            C && !w.has(C) && (w.add(C), console.warn("[renderer] MP4Clip tick failed", r.url, k));
+            k && !S.has(k) && (S.add(k), console.warn("[renderer] MP4Clip tick failed", r.url, y));
             return;
           }
-        const T = S / 1e3;
-        if (!Number.isFinite(T) || s.kind !== "element")
+        const M = p / 1e3;
+        if (!Number.isFinite(M) || s.kind !== "element")
           return;
-        await Bt(s, {
-          targetSec: T,
-          playbackRate: r.playRate ?? 1,
-          volume: r.volume ?? 1
+        await Ot(s, {
+          targetSec: M,
+          playbackRate: r.playRate ?? 1
         });
-      } catch (f) {
-        console.warn("[renderer] update video frame failed", f);
+      } catch (p) {
+        console.warn("[renderer] update video frame failed", p);
       }
   }
-  async function Nt(r, l, s) {
-    const f = M !== "element", S = M !== "mp4clip";
-    if (h.has(l)) {
-      if (!S)
+  async function Rt(r, c, s) {
+    const p = w !== "element", v = w !== "mp4clip";
+    if (m.has(c)) {
+      if (!v)
         throw new Error(`[renderer] MP4Clip unsupported for ${r}`);
       return await B(r, s).catch(() => {
       });
     }
-    if (f) {
-      const x = await pt(r, s).catch((T) => {
-        if (J(T) && h.add(l), !S)
-          throw T;
+    if (p) {
+      const M = await Ne(r, s).catch((y) => {
+        if (ce(y) && m.add(c), !v)
+          throw y;
       });
-      if (x)
-        return x;
+      if (M)
+        return M;
     }
-    if (S)
+    if (v)
       return await B(r, s).catch(() => {
       });
   }
-  function Gt(r) {
-    return r.segmentType === "frames" && r.type === "video" && typeof r.url == "string" && yt(r.url);
+  function H(r) {
+    return r.segmentType === "frames" && r.type === "video" && typeof r.url == "string" && $e(r.url);
   }
-  function Kt(r, l) {
-    const s = it(r);
+  function Vt(r, c) {
+    const s = ve(r);
     if (s <= 0)
       return 0;
-    if (l < s)
-      return l;
-    const f = Math.max(1e3 / Math.max(r.fps || 30, 1), 1);
-    return Math.max(s - f, 0);
+    if (c < s)
+      return c;
+    const p = Math.max(1e3 / Math.max(r.fps || 30, 1), 1);
+    return Math.max(s - p, 0);
   }
-  async function dt(r) {
-    const l = e.resourceDir ?? we;
+  async function J(r) {
+    const c = e.resourceDir ?? Jn;
     try {
-      const s = W(r);
+      const s = z(r);
       if (!s)
         return;
-      const f = te(`${l}/${s}`, "r");
-      if (await f.exists())
-        return f;
+      const p = jt(`${c}/${s}`, "r");
+      if (await p.exists())
+        return p;
     } catch {
       return;
     }
   }
-  function ft(r) {
+  function Ft(r) {
+    if (r.segmentType !== "frames" || r.type !== "video")
+      return;
+    const c = z(r.url);
+    if (c)
+      return ue(r.url), A.get(c);
+  }
+  async function ue(r) {
+    if (!de(r))
+      return;
+    const c = z(r);
+    if (!c)
+      return;
+    const s = A.get(c);
+    if (s)
+      return s;
+    const p = R.get(c);
+    if (p)
+      return await p;
+    const v = (async () => {
+      let M = await J(r);
+      if (M || (await u.add(r).catch(() => {
+      }), M = await J(r)), !M)
+        return;
+      const y = await M.getOriginFile();
+      if (!y)
+        return;
+      const k = URL.createObjectURL(y);
+      return A.set(c, k), k;
+    })();
+    R.set(c, v);
+    try {
+      return await v;
+    } finally {
+      R.delete(c);
+    }
+  }
+  function de(r) {
     return !(!r || r.startsWith("data:") || r.startsWith("blob:"));
   }
-  function qt() {
-    for (const [r, l] of p) {
-      if (l.kind === "mp4clip") {
-        l.clip.destroy(), p.set(r, {
+  function Pt() {
+    for (const [r, c] of l) {
+      if (c.kind === "mp4clip") {
+        c.clip.destroy(), l.set(r, {
           kind: "frozen",
-          canvas: l.canvas,
-          texture: l.texture,
-          sprite: l.sprite,
-          meta: l.meta
+          canvas: c.canvas,
+          texture: c.texture,
+          sprite: c.sprite,
+          meta: c.meta
         });
         continue;
       }
-      l.kind === "element" && l.video.pause();
+      c.kind === "element" && c.video.pause();
     }
   }
-  function ht(r) {
+  function Ue(r) {
     if (r.kind === "mp4clip") {
       r.clip.destroy();
       return;
@@ -861,156 +1553,159 @@ async function ve(e) {
     if (r.kind === "frozen")
       return;
     r.video.pause();
-    const l = v.get(r.video);
-    l && (URL.revokeObjectURL(l), v.delete(r.video)), r.video.removeAttribute("src"), r.video.load();
-  }
-  function Q(r, l, s = 1e3) {
-    return new Promise((f, S) => {
-      const x = window.setTimeout(() => {
-        C(), S(new Error(`Timed out waiting for media event: ${l}`));
-      }, s), T = () => {
-        C(), f();
+    const c = h.get(r.video);
+    c && (URL.revokeObjectURL(c), h.delete(r.video)), r.video.removeAttribute("src"), r.video.load();
+  }
+  function le(r, c, s = 1e3) {
+    return new Promise((p, v) => {
+      const M = window.setTimeout(() => {
+        V(), v(new Error(`Timed out waiting for media event: ${c}`));
+      }, s), y = () => {
+        V(), p();
       }, k = () => {
-        C();
-        const I = r.error ? `${r.error.code}` : "unknown";
-        S(new Error(`Media error (${I}) while waiting for ${l}`));
-      }, C = () => {
-        window.clearTimeout(x), r.removeEventListener(l, T), r.removeEventListener("error", k);
+        V();
+        const F = r.error ? `${r.error.code}` : "unknown";
+        v(new Error(`Media error (${F}) while waiting for ${c}`));
+      }, V = () => {
+        window.clearTimeout(M), r.removeEventListener(c, y), r.removeEventListener("error", k);
       };
-      r.addEventListener(l, T, { once: !0 }), r.addEventListener("error", k, { once: !0 });
+      r.addEventListener(c, y, { once: !0 }), r.addEventListener("error", k, { once: !0 });
     });
   }
-  async function pt(r, l) {
+  async function Ne(r, c) {
     let s;
-    ft(r) && (s = await dt(r), s || (await c.add(r).catch(() => {
-    }), s = await dt(r)));
-    let f;
+    de(r) && (s = await J(r), s || (await u.add(r).catch(() => {
+    }), s = await J(r)));
+    let p;
     try {
       if (s)
-        f = new K(s);
+        p = new K(s, { audio: !1 });
       else {
-        const I = await fetch(r);
-        if (I.body)
-          f = new K(I.body);
+        const F = await fetch(r);
+        if (F.body)
+          p = new K(F.body, { audio: !1 });
         else {
-          const U = await I.arrayBuffer(), N = new ReadableStream({
-            start(L) {
-              L.enqueue(new Uint8Array(U)), L.close();
+          const D = await F.arrayBuffer(), Q = new ReadableStream({
+            start(j) {
+              j.enqueue(new Uint8Array(D)), j.close();
             }
           });
-          f = new K(N);
+          p = new K(Q, { audio: !1 });
         }
       }
-      await f.ready;
-      const { width: S, height: x } = f.meta, T = document.createElement("canvas");
-      T.width = S || 1, T.height = x || 1;
-      const k = G.from(T), C = l?.sprite ?? new V(k);
-      return l?.sprite && (l.sprite.texture = k, l.oldTexture?.destroy(!0)), { kind: "mp4clip", clip: f, canvas: T, texture: k, sprite: C, meta: { width: S, height: x } };
-    } catch (S) {
-      throw f?.destroy(), S;
+      await p.ready;
+      const { width: v, height: M } = p.meta, y = document.createElement("canvas");
+      y.width = v || 1, y.height = M || 1;
+      const k = $.from(y), V = c?.sprite ?? new U(k);
+      return c?.sprite && (c.sprite.texture = k, c.oldTexture?.destroy(!0)), { kind: "mp4clip", clip: p, canvas: y, texture: k, sprite: V, meta: { width: v, height: M } };
+    } catch (v) {
+      throw p?.destroy(), v;
     }
   }
-  function mt(r) {
+  function De(r) {
     const s = r.split("#")[0].split("?")[0].split("/").pop()?.split(".").pop()?.toLowerCase() ?? "";
     return ["mp4", "m4v", "mov", "webm"].includes(s) ? "video" : ["png", "jpg", "jpeg", "gif", "webp", "bmp", "svg", "avif"].includes(s) ? "image" : ["mp3", "wav", "aac", "m4a", "ogg", "flac"].includes(s) ? "audio" : "unknown";
   }
-  function yt(r) {
-    const l = mt(r);
-    return !(l === "image" || l === "audio");
+  function $e(r) {
+    const c = De(r);
+    return !(c === "image" || c === "audio");
   }
-  async function B(r, l) {
+  async function B(r, c) {
     const s = document.createElement("video");
-    s.crossOrigin = "anonymous", s.muted = !1, s.playsInline = !0, s.preload = "metadata", s.src = r, s.load();
+    s.crossOrigin = "anonymous", s.muted = !0, s.playsInline = !0, s.preload = "metadata", s.src = r, s.load();
     try {
-      await Q(s, "loadedmetadata", 15e3);
-    } catch (C) {
+      await le(s, "loadedmetadata", 15e3);
+    } catch (V) {
       s.pause();
-      const I = v.get(s);
-      throw I && (URL.revokeObjectURL(I), v.delete(s)), s.removeAttribute("src"), s.load(), C;
+      const F = h.get(s);
+      throw F && (URL.revokeObjectURL(F), h.delete(s)), s.removeAttribute("src"), s.load(), V;
     }
-    const f = s.videoWidth || 1, S = s.videoHeight || 1, x = document.createElement("canvas");
-    x.width = f, x.height = S;
-    const T = G.from(x), k = l?.sprite ?? new V(T);
-    return l?.sprite && (l.sprite.texture = T, l.oldTexture?.destroy(!0)), { kind: "element", video: s, canvas: x, texture: T, sprite: k, meta: { width: f, height: S } };
-  }
-  async function Bt(r, l) {
-    const { video: s, canvas: f, texture: S } = r;
-    s.playbackRate = Number.isFinite(l.playbackRate) && l.playbackRate > 0 ? l.playbackRate : 1, s.volume = Math.max(0, Math.min(1, l.volume ?? 1)), g.value ? s.play().catch(() => {
+    const p = s.videoWidth || 1, v = s.videoHeight || 1, M = document.createElement("canvas");
+    M.width = p, M.height = v;
+    const y = $.from(M), k = c?.sprite ?? new U(y);
+    return c?.sprite && (c.sprite.texture = y, c.oldTexture?.destroy(!0)), { kind: "element", video: s, canvas: M, texture: y, sprite: k, meta: { width: p, height: v } };
+  }
+  async function Ot(r, c) {
+    const { video: s, canvas: p, texture: v } = r;
+    s.playbackRate = Number.isFinite(c.playbackRate) && c.playbackRate > 0 ? c.playbackRate : 1, s.muted = !0, s.volume = 0, I.value ? s.play().catch(() => {
     }) : s.pause();
-    const x = Number.isFinite(s.duration) && s.duration > 0 ? s.duration : null, T = x ? Math.min(l.targetSec, Math.max(x - 0.03, 0)) : l.targetSec, k = s.currentTime, C = Math.abs(k - T), I = g.value ? 0.25 : 0.03;
-    if (Number.isFinite(k) && C > I) {
+    const M = Number.isFinite(s.duration) && s.duration > 0 ? s.duration : null, y = M ? Math.min(c.targetSec, Math.max(M - 0.03, 0)) : c.targetSec, k = s.currentTime, V = Math.abs(k - y), F = I.value ? 0.25 : 0.03;
+    if (Number.isFinite(k) && V > F) {
       try {
-        s.currentTime = T;
+        s.currentTime = y;
       } catch {
       }
-      await Q(s, "seeked", 250).catch(() => {
+      await le(s, "seeked", 250).catch(() => {
       });
     }
-    if (s.readyState < 2 && (await Q(s, "canplay", 250).catch(() => {
+    if (s.readyState < 2 && (await le(s, "canplay", 250).catch(() => {
     }), s.readyState < 2))
       return;
-    const U = f.getContext("2d");
-    U && (U.drawImage(s, 0, 0, f.width, f.height), wt(S));
+    const D = p.getContext("2d");
+    D && (D.drawImage(s, 0, 0, p.width, p.height), Ke(v));
   }
-  function jt(r) {
-    return new Promise((l) => {
+  function zt(r) {
+    return new Promise((c) => {
       const s = new Image();
-      s.crossOrigin = "anonymous", s.onload = () => l(G.from(s)), s.onerror = () => {
-        console.warn("[renderer] failed to load image", r), l(void 0);
+      s.crossOrigin = "anonymous", s.onload = () => c($.from(s)), s.onerror = () => {
+        console.warn("[renderer] failed to load image", r), c(void 0);
       }, s.src = r;
     });
   }
-  function wt(r) {
-    const l = r.source;
-    if ("update" in l && typeof l.update == "function") {
-      l.update();
+  function Ke(r) {
+    const c = r.source;
+    if ("update" in c && typeof c.update == "function") {
+      c.update();
       return;
     }
     typeof r.update == "function" && r.update();
   }
-  function _t() {
-    X(), b += 1, z.stop(), _(), a.destroy({ children: !0 }), d.clear(), y.clear(), u.clear(), e.app || n.destroy(), P.destroy();
+  function Ct() {
+    se(), P += 1, Ve.stop(), Fe(), a.destroy({ children: !0 }), f.clear(), g.clear(), d.clear();
+    for (const r of A.values())
+      URL.revokeObjectURL(r);
+    A.clear(), R.clear(), e.app || o.destroy(), x.destroy();
   }
-  return e.autoPlay && ct(), {
-    app: n,
+  return e.autoPlay && Pe(), {
+    app: o,
     layer: a,
-    currentTime: m,
-    duration: R,
-    isPlaying: g,
-    play: ct,
-    pause: X,
-    tick: lt,
-    seek: Ut,
-    renderAt: Ot,
-    destroy: _t
+    currentTime: T,
+    duration: E,
+    isPlaying: I,
+    play: Pe,
+    pause: se,
+    tick: ze,
+    seek: St,
+    renderAt: Tt,
+    destroy: Ct
   };
 }
-function Me(e) {
-  let t = !1, o = !1, i = null, n = null;
+function ti(e) {
+  let t = !1, i = !1, n = null, o = null;
   return async () => {
-    i || (i = new Promise((u) => {
-      n = u;
+    n || (n = new Promise((d) => {
+      o = d;
     }));
-    const c = i;
-    if (o)
-      return t = !0, c;
-    o = !0;
+    const u = n;
+    if (i)
+      return t = !0, u;
+    i = !0;
     do
       t = !1, await e();
     while (t);
-    return o = !1, n?.(), i = null, n = null, c;
+    return i = !1, o?.(), n = null, o = null, u;
   };
 }
-function ge(e) {
+function ni(e) {
   return typeof e == "object" && e !== null && "createReader" in e && "getSize" in e;
 }
-function Se(e) {
+function ii(e) {
   return typeof ReadableStream < "u" && e instanceof ReadableStream;
 }
-function xe(e) {
-  return typeof e == "string" || e instanceof Blob || ge(e) || Se(e) ? { source: e } : e;
+function ri(e) {
+  return typeof e == "string" || e instanceof Blob || ni(e) || ii(e) ? { source: e } : e;
 }
-async function xt(e) {
+async function He(e) {
   if (typeof e == "string") {
     const t = await fetch(e);
     if (!t.body)
@@ -1019,81 +1714,81 @@ async function xt(e) {
   }
   return e instanceof Blob ? e.stream() : e;
 }
-function Te(e, t) {
-  let o = !1;
-  const i = () => {
-    o || (o = !0, t());
-  }, n = e.getReader();
+function oi(e, t) {
+  let i = !1;
+  const n = () => {
+    i || (i = !0, t());
+  }, o = e.getReader();
   return new ReadableStream({
     async pull(a) {
-      const { done: c, value: u } = await n.read();
-      if (c) {
-        i(), a.close();
+      const { done: u, value: d } = await o.read();
+      if (u) {
+        n(), a.close();
         return;
       }
-      a.enqueue(u);
+      a.enqueue(d);
     },
     async cancel(a) {
       try {
-        await n.cancel(a);
+        await o.cancel(a);
       } finally {
-        i();
+        n();
       }
     }
   });
 }
-async function Ne(e, t = {}) {
+async function bi(e, t = {}) {
   if (e.length === 0)
     throw new Error("concatVideos: expected at least one source");
   const {
-    onProgress: o,
-    width: i,
-    height: n,
+    onProgress: i,
+    width: n,
+    height: o,
     ...a
-  } = t, c = e.map(xe), [u, ...d] = c, y = await xt(u.source), h = new K(y);
-  await h.ready;
-  const w = i ?? Math.round(h.meta.width || 0), M = n ?? Math.round(h.meta.height || 0);
-  if (!w || !M)
-    throw h.destroy(), new Error("concatVideos: output width/height is required");
-  const p = new bt({
+  } = t, u = e.map(ri), [d, ...f] = u, g = await He(d.source), m = new K(g);
+  await m.ready;
+  const S = n ?? Math.round(m.meta.width || 0), w = o ?? Math.round(m.meta.height || 0);
+  if (!S || !w)
+    throw m.destroy(), new Error("concatVideos: output width/height is required");
+  const l = new Je({
     ...a,
-    width: w,
-    height: M
+    width: S,
+    height: w
   });
-  o && p.on("OutputProgress", o);
-  let v = 0;
-  const m = async (A) => {
-    const E = A.meta.duration;
-    if (!Number.isFinite(E) || E <= 0)
+  i && l.on("OutputProgress", i);
+  let h = 0;
+  const b = async (A) => {
+    const R = A.meta.duration;
+    if (!Number.isFinite(R) || R <= 0)
       throw A.destroy(), new Error("concatVideos: invalid clip duration");
-    const b = new nt(A);
+    const x = new be(A);
     try {
-      await b.ready, b.rect.x = 0, b.rect.y = 0, b.rect.w = w, b.rect.h = M, b.time.offset = v, b.time.duration = E, await p.addSprite(b), v += E;
+      await x.ready, x.rect.x = 0, x.rect.y = 0, x.rect.w = S, x.rect.h = w, x.time.offset = h, x.time.duration = R, await l.addSprite(x), h += R;
     } finally {
-      b.destroy();
+      x.destroy();
     }
   };
   try {
-    await m(h);
-    for (const A of d) {
-      const E = await xt(A.source), b = new K(E);
-      await b.ready, await m(b);
+    await b(m);
+    for (const A of f) {
+      const R = await He(A.source), x = new K(R);
+      await x.ready, await b(x);
     }
   } catch (A) {
-    throw p.destroy(), A;
+    throw l.destroy(), A;
   }
-  const g = v, R = p.output({ maxTime: g }), P = () => {
-    p.destroy();
+  const T = h, I = l.output({ maxTime: T }), E = () => {
+    l.destroy();
   };
   return {
-    stream: Te(R, P),
-    width: w,
-    height: M,
-    durationMs: Math.round(g / 1e3),
-    destroy: P
+    stream: oi(I, E),
+    width: S,
+    height: w,
+    durationMs: Math.round(T / 1e3),
+    destroy: E
   };
 }
-class at {
+class Ae {
   ready;
   meta;
   protocol;
@@ -1101,90 +1796,90 @@ class at {
   renderer;
   app;
   destroyed = !1;
-  constructor(t, o = {}) {
-    this.protocol = t, this.options = o;
-    const i = o.width ?? t.width, n = o.height ?? t.height, a = it(t);
+  constructor(t, i = {}) {
+    this.protocol = t, this.options = i;
+    const n = i.width ?? t.width, o = i.height ?? t.height, a = ve(t);
     this.meta = {
-      width: i,
-      height: n,
+      width: n,
+      height: o,
       duration: Math.max(0, Math.round(a * 1e3))
     }, this.ready = this.init();
   }
   async init() {
-    const t = this.options.width ?? this.protocol.width, o = this.options.height ?? this.protocol.height;
-    if (!t || !o)
+    const t = this.options.width ?? this.protocol.width, i = this.options.height ?? this.protocol.height;
+    if (!t || !i)
       throw new Error("ProtocolVideoClip: output width/height is required");
-    const i = new kt();
-    await i.init({
+    const n = new Qe();
+    await n.init({
       width: t,
-      height: o,
+      height: i,
       backgroundAlpha: 0,
       ...this.options.appOptions
-    }), i.ticker.stop(), this.app = i;
-    const n = this.options.rendererOptions ?? {}, a = await ve({
+    }), n.ticker.stop(), this.app = n;
+    const o = this.options.rendererOptions ?? {}, a = await ei({
       protocol: this.protocol,
-      app: i,
-      ...n,
+      app: n,
+      ...o,
       autoPlay: !1,
       freezeOnPause: !1,
       manualRender: !0,
-      videoSourceMode: n.videoSourceMode ?? "mp4clip"
+      videoSourceMode: o.videoSourceMode ?? "mp4clip"
     });
     this.renderer = a;
-    const c = a.duration.value;
+    const u = a.duration.value;
     return this.meta = {
-      width: i.renderer.width,
-      height: i.renderer.height,
-      duration: Math.max(0, Math.round(c * 1e3))
+      width: n.renderer.width,
+      height: n.renderer.height,
+      duration: Math.max(0, Math.round(u * 1e3))
     }, this.meta;
   }
   async tick(t) {
-    const o = [];
+    const i = [];
     if (this.destroyed)
-      return { audio: o, state: "done" };
+      return { audio: i, state: "done" };
     if (await this.ready, !this.renderer)
-      return { audio: o, state: "done" };
-    const i = this.meta.duration;
-    if (t >= i)
-      return { audio: o, state: "done" };
-    const n = Math.max(0, Math.min(t, i));
-    return await this.renderer.renderAt(n / 1e3), {
+      return { audio: i, state: "done" };
+    const n = this.meta.duration;
+    if (t >= n)
+      return { audio: i, state: "done" };
+    const o = Math.max(0, Math.min(t, n));
+    return await this.renderer.renderAt(o / 1e3), {
       video: new VideoFrame(this.renderer.app.canvas, {
         timestamp: t
       }),
-      audio: o,
+      audio: i,
       state: "success"
     };
   }
   async clone() {
-    const t = new at(this.protocol, this.options);
+    const t = new Ae(this.protocol, this.options);
     return await t.ready, t;
   }
   destroy() {
     this.destroyed || (this.destroyed = !0, this.renderer?.destroy(), this.app?.destroy(!0));
   }
 }
-const It = 12e3;
-function be(e, t, o) {
-  return new Promise((i, n) => {
+const mt = 12e3;
+function ai(e, t, i) {
+  return new Promise((n, o) => {
     const a = globalThis.setTimeout(() => {
-      n(new Error(`composeProtocol: ${o} timed out (${t}ms)`));
+      o(new Error(`composeProtocol: ${i} timed out (${t}ms)`));
     }, t);
-    e.then((c) => {
-      globalThis.clearTimeout(a), i(c);
-    }).catch((c) => {
-      globalThis.clearTimeout(a), n(c);
+    e.then((u) => {
+      globalThis.clearTimeout(a), n(u);
+    }).catch((u) => {
+      globalThis.clearTimeout(a), o(u);
     });
   });
 }
-class st {
-  constructor(t, o) {
-    this.sourceClip = t, this.config = o, this.ready = this.sourceClip.ready.then((i) => {
-      const n = Math.round(this.config.segmentDurationUs * this.config.playRate), a = Math.max(0, i.duration - this.config.fromUs);
+class Ee {
+  constructor(t, i) {
+    this.sourceClip = t, this.config = i, this.ready = this.sourceClip.ready.then((n) => {
+      const o = Math.round(this.config.segmentDurationUs * this.config.playRate), a = Math.max(0, n.duration - this.config.fromUs);
       return this.clipMeta = {
-        width: i.width,
-        height: i.height,
-        duration: Math.max(0, Math.min(n, a))
+        width: n.width,
+        height: n.height,
+        duration: Math.max(0, Math.min(o, a))
       }, this.meta;
     });
   }
@@ -1198,217 +1893,200 @@ class st {
     return { ...this.clipMeta };
   }
   async tick(t) {
-    const o = Math.max(0, Math.round(t)), i = Math.round(o / this.config.playRate);
-    if (i >= this.config.segmentDurationUs)
+    const i = Math.max(0, Math.round(t)), n = Math.round(i / this.config.playRate);
+    if (n >= this.config.segmentDurationUs)
       return {
         audio: [],
         state: "done"
       };
-    const n = this.config.fromUs + o, a = await this.sourceClip.tick(n);
-    ke(a.video);
-    const c = this.resolveGain(i);
+    const o = this.config.fromUs + i, a = await this.sourceClip.tick(o);
+    si(a.video);
+    const u = this.resolveGain(n);
     return {
-      audio: Ce(a.audio ?? [], c),
+      audio: ci(a.audio ?? [], u),
       state: a.state
     };
   }
   async clone() {
-    const t = await this.sourceClip.clone(), o = new st(t, this.config);
-    return await o.ready, o;
+    const t = await this.sourceClip.clone(), i = new Ee(t, this.config);
+    return await i.ready, i;
   }
   destroy() {
     this.sourceClip.destroy();
   }
   resolveGain(t) {
-    let o = 1;
-    this.config.fadeInUs > 0 && t < this.config.fadeInUs && (o = Math.max(0, t / this.config.fadeInUs));
-    const i = this.config.segmentDurationUs - t;
-    return this.config.fadeOutUs > 0 && i < this.config.fadeOutUs && (o = Math.min(o, Math.max(0, i / this.config.fadeOutUs))), this.config.baseVolume * o;
+    let i = 1;
+    this.config.fadeInUs > 0 && t < this.config.fadeInUs && (i = Math.max(0, t / this.config.fadeInUs));
+    const n = this.config.segmentDurationUs - t;
+    return this.config.fadeOutUs > 0 && n < this.config.fadeOutUs && (i = Math.min(i, Math.max(0, n / this.config.fadeOutUs))), this.config.baseVolume * i;
   }
 }
-function ke(e) {
+function si(e) {
   if (!e || typeof e != "object")
     return;
   const t = e.close;
   typeof t == "function" && t.call(e);
 }
-function Ce(e, t) {
-  return !e.length || t >= 0.999 ? e : t <= 0 ? e.map((o) => new Float32Array(o.length)) : e.map((o) => {
-    const i = new Float32Array(o.length);
-    for (let n = 0; n < o.length; n++)
-      i[n] = o[n] * t;
-    return i;
+function ci(e, t) {
+  return !e.length || t >= 0.999 ? e : t <= 0 ? e.map((i) => new Float32Array(i.length)) : e.map((i) => {
+    const n = new Float32Array(i.length);
+    for (let o = 0; o < i.length; o++)
+      n[o] = i[o] * t;
+    return n;
   });
 }
-function j(e) {
+function _(e) {
   return Number.isFinite(e) ? Math.max(0, Math.round(e * 1e3)) : 0;
 }
-function rt(e) {
+function ui(e) {
   return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0, Math.min(1, e));
 }
-function Re(e) {
+function di(e) {
   return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0.1, Math.min(100, e));
 }
-function Ae(e) {
-  const t = Math.max(0, e.endTime - e.startTime), o = Math.max(0, Math.min(e.fadeInDuration ?? 0, t)), i = Math.max(0, Math.min(e.fadeOutDuration ?? 0, t));
+function li(e) {
+  const t = Math.max(0, e.endTime - e.startTime), i = Math.max(0, Math.min(e.fadeInDuration ?? 0, t)), n = Math.max(0, Math.min(e.fadeOutDuration ?? 0, t));
   return {
-    fromUs: j(e.fromTime ?? 0),
-    segmentDurationUs: j(t),
-    playRate: Re(e.playRate),
-    baseVolume: rt(e.volume),
-    fadeInUs: j(o),
-    fadeOutUs: j(i)
+    fromUs: _(e.fromTime ?? 0),
+    segmentDurationUs: _(t),
+    playRate: di(e.playRate),
+    baseVolume: ui(e.volume),
+    fadeInUs: _(i),
+    fadeOutUs: _(n)
   };
 }
-function Ee(e) {
-  return e.segmentType === "audio";
-}
-function Ie(e) {
-  return e.segmentType === "frames" && e.type === "video";
-}
-async function Pt(e, t = It) {
-  const o = new AbortController(), i = globalThis.setTimeout(() => o.abort(), t);
+async function fi(e, t = mt) {
+  const i = new AbortController(), n = globalThis.setTimeout(() => i.abort(), t);
   try {
-    const n = await fetch(e, { signal: o.signal });
-    if (!n.body)
+    const o = await fetch(e, { signal: i.signal });
+    if (!o.body)
       throw new Error(`composeProtocol: unable to read resource stream: ${e}`);
-    return n.body;
-  } catch (n) {
-    throw o.signal.aborted ? new Error(`composeProtocol: loading resource timed out (${t}ms): ${e}`) : n;
+    return o.body;
+  } catch (o) {
+    throw i.signal.aborted ? new Error(`composeProtocol: loading resource timed out (${t}ms): ${e}`) : o;
   } finally {
-    globalThis.clearTimeout(i);
+    globalThis.clearTimeout(n);
   }
 }
-async function Ft(e, t) {
-  const o = Ae(t), i = new st(e, o), n = new nt(i);
+async function mi(e, t) {
+  const i = li(t), n = new Ee(e, i), o = new be(n);
   try {
-    await be(n.ready, It, "prepare audio sprite");
+    await ai(o.ready, mt, "prepare audio sprite");
   } catch (a) {
-    throw n.destroy(), a;
+    throw o.destroy(), a;
   }
-  return n.time.offset = j(t.startTime), n.time.duration = o.segmentDurationUs, n.time.playbackRate = o.playRate, n;
-}
-async function Pe(e) {
-  const t = await Pt(e.url), o = new Tt(t);
-  return await Ft(o, e);
+  return o.time.offset = _(t.startTime), o.time.duration = i.segmentDurationUs, o.time.playbackRate = i.playRate, o;
 }
-async function Fe(e) {
-  const t = await Pt(e.url), o = new K(t, { audio: !0 });
-  return await Ft(o, e);
+async function pi(e) {
+  const t = await fi(e.url), i = e.segmentKind === "audio" ? new Bt(t) : new K(t, { audio: !0 });
+  return await mi(i, e);
 }
-async function Ue(e) {
-  const t = [];
-  for (const n of e.tracks)
-    for (const a of n.children)
-      if (!(a.endTime <= a.startTime)) {
-        if (Ee(a)) {
-          if (rt(a.volume) <= 0)
-            continue;
-          t.push(Pe(a));
-          continue;
-        }
-        if (Ie(a)) {
-          if (rt(a.volume) <= 0)
-            continue;
-          t.push(Fe(a));
-        }
-      }
-  if (!t.length)
+async function hi(e) {
+  const i = Un(e).map((a) => pi(a));
+  if (!i.length)
     return [];
-  const o = await Promise.allSettled(t), i = [];
-  for (const n of o) {
-    if (n.status === "fulfilled") {
-      i.push(n.value);
+  const n = await Promise.allSettled(i), o = [];
+  for (const a of n) {
+    if (a.status === "fulfilled") {
+      o.push(a.value);
       continue;
     }
-    console.warn("[compose] skip audio sprite due to load failure", n.reason);
+    console.warn("[compose] skip audio sprite due to load failure", a.reason);
   }
-  return i;
+  return o;
 }
-function ot(e) {
+function we(e) {
   for (const t of e)
     t.destroy();
 }
-function Oe(e, t) {
-  let o = !1;
-  const i = () => {
-    o || (o = !0, t());
-  }, n = e.getReader();
+function yi(e, t) {
+  let i = !1;
+  const n = () => {
+    i || (i = !0, t());
+  }, o = e.getReader();
   return new ReadableStream({
     async pull(a) {
-      const { done: c, value: u } = await n.read();
-      if (c) {
-        i(), a.close();
+      const { done: u, value: d } = await o.read();
+      if (u) {
+        n(), a.close();
         return;
       }
-      a.enqueue(u);
+      a.enqueue(d);
     },
     async cancel(a) {
       try {
-        await n.cancel(a);
+        await o.cancel(a);
       } finally {
-        i();
+        n();
       }
     }
   });
 }
-async function Ge(e, t = {}) {
+async function Ii(e, t = {}) {
   const {
-    width: o,
-    height: i,
-    fps: n,
+    width: i,
+    height: n,
+    fps: o,
     onProgress: a,
-    clipOptions: c,
-    audioSprites: u,
-    ...d
-  } = t, y = o ?? e.width, h = i ?? e.height;
-  if (!y || !h)
+    clipOptions: u,
+    audioSprites: d,
+    ...f
+  } = t, g = i ?? e.width, m = n ?? e.height;
+  if (!g || !m)
     throw new Error("composeProtocol: output width/height is required");
-  const w = n ?? e.fps, M = d.audio === !1 ? [] : typeof u == "function" ? await u(e) : await Ue(e), p = d.audio ?? (M.length > 0 ? void 0 : !1), v = new bt({
-    ...d,
-    audio: p,
-    width: y,
-    height: h,
-    fps: w
+  const S = o ?? e.fps, w = f.audio === !1 ? [] : typeof d == "function" ? await d(e) : await hi(e), l = f.audio ?? (w.length > 0 ? void 0 : !1), h = new Je({
+    ...f,
+    audio: l,
+    width: g,
+    height: m,
+    fps: S
   });
-  a && v.on("OutputProgress", a);
-  let m, g;
+  a && h.on("OutputProgress", a);
+  let b, T;
   try {
-    m = new at(e, {
-      width: y,
-      height: h,
-      fps: w,
-      ...c,
+    b = new Ae(e, {
+      width: g,
+      height: m,
+      fps: S,
+      ...u,
       rendererOptions: {
         warmUpResources: !1,
-        ...c?.rendererOptions
+        ...u?.rendererOptions
       }
-    }), await m.ready, g = new nt(m), await g.ready, g.time.offset = 0, g.time.duration = m.meta.duration, g.rect.x = 0, g.rect.y = 0, g.rect.w = m.meta.width, g.rect.h = m.meta.height, await v.addSprite(g, { main: !0 });
-    for (const b of M)
-      await v.addSprite(b);
-  } catch (b) {
-    throw ot(M), g?.destroy(), m?.destroy(), v.destroy(), b;
-  }
-  const R = m?.meta.duration ?? 0;
-  if (!R)
-    throw ot(M), g?.destroy(), m?.destroy(), v.destroy(), new Error("composeProtocol: protocol has no duration");
-  const P = v.output({ maxTime: R });
+    }), await b.ready, T = new be(b), await T.ready, T.time.offset = 0, T.time.duration = b.meta.duration, T.rect.x = 0, T.rect.y = 0, T.rect.w = b.meta.width, T.rect.h = b.meta.height, await h.addSprite(T, { main: !0 });
+    for (const x of w)
+      await h.addSprite(x);
+  } catch (x) {
+    throw we(w), T?.destroy(), b?.destroy(), h.destroy(), x;
+  }
+  const I = b?.meta.duration ?? 0;
+  if (!I)
+    throw we(w), T?.destroy(), b?.destroy(), h.destroy(), new Error("composeProtocol: protocol has no duration");
+  const E = h.output({ maxTime: I });
   let A = !1;
-  const E = () => {
-    A || (A = !0, ot(M), g?.destroy(), m?.destroy(), v.destroy());
+  const R = () => {
+    A || (A = !0, we(w), T?.destroy(), b?.destroy(), h.destroy());
   };
   return {
-    stream: Oe(P, E),
-    width: y,
-    height: h,
-    durationMs: Math.round(R / 1e3),
-    destroy: E
+    stream: yi(E, R),
+    width: g,
+    height: m,
+    durationMs: Math.round(I / 1e3),
+    destroy: R
   };
 }
 export {
-  at as ProtocolVideoClip,
-  Ge as composeProtocol,
-  Ne as concatVideos,
-  ve as createRenderer
+  Ae as ProtocolVideoClip,
+  an as collectTransitionByFromSegmentId,
+  Ii as composeProtocol,
+  bi as concatVideos,
+  Un as createComposeAudioInputs,
+  Tn as createComposeRunner,
+  ne as createEmptyEvaluatorState,
+  Fn as createPixiFiltersFromVisualEffects,
+  ei as createRenderer,
+  rn as createTimelineTransport,
+  xn as createVisualRenderItems,
+  rt as evaluateTimelinePlan
 };
 //# sourceMappingURL=index.js.map