@video-editor/renderer 0.0.1-beta.30 → 0.0.1-beta.31

package/dist/index.js

@@ -1,100 +1,100 @@
-import { createValidator as Gt, createResourceManager as Nt, getResourceKey as N } from "@video-editor/protocol";
-import { toRaw as zt, isRef as Kt, shallowRef as ut, unref as lt, ref as ft, computed as qt, effectScope as Bt, watch as W } from "@vue/reactivity";
-import { AudioClip as jt, renderTxt2ImgBitmap as _t, MP4Clip as G, Combinator as mt, OffscreenSprite as wt } from "@webav/av-cliper";
-import { file as Wt } from "opfs-tools";
-import { Application as yt, Sprite as O, Texture as V, Graphics as vt, Container as Yt } from "pixi.js";
-async function Xt(o) {
-  const t = new yt();
-  return await t.init({ resizeTo: window, backgroundAlpha: 0, ...o }), t;
+import { createValidator as De, createResourceManager as Ne, getResourceKey as _ } from "@video-editor/protocol";
+import { toRaw as Ge, isRef as Ke, shallowRef as pe, unref as he, ref as me, computed as qe, effectScope as Be, watch as Q } from "@vue/reactivity";
+import { AudioClip as je, renderTxt2ImgBitmap as _e, MP4Clip as B, Combinator as ve, OffscreenSprite as Me } from "@webav/av-cliper";
+import { file as We } from "opfs-tools";
+import { Application as Se, Sprite as $, Texture as G, Graphics as ge, Container as Ye } from "pixi.js";
+async function Xe(o) {
+  const e = new Se();
+  return await e.init({ resizeTo: window, backgroundAlpha: 0, ...o }), e;
 }
-function Jt(o, t, i, r, a) {
-  const u = t || r, c = i || a;
-  if (!u || !c)
-    return { width: r, height: a };
-  const d = u / c, l = r / a;
+function Je(o, e, r, i, n) {
+  const d = e || i, c = r || n;
+  if (!d || !c)
+    return { width: i, height: n };
+  const s = d / c, l = i / n;
   switch (o) {
     case "none":
-      return { width: u, height: c };
+      return { width: d, height: c };
     case "cover":
-      return d > l ? { width: a * d, height: a } : { width: r, height: r / d };
+      return s > l ? { width: n * s, height: n } : { width: i, height: i / s };
     case "stretch":
-      return { width: r, height: a };
+      return { width: i, height: n };
     default:
-      return d > l ? { width: r, height: r / d } : { width: a * d, height: a };
+      return s > l ? { width: i, height: i / s } : { width: n * s, height: n };
   }
 }
-function Ht(o, t, i, r, a) {
-  const u = "fillMode" in o ? o.fillMode : void 0, { width: c, height: d } = Jt(
-    u,
-    r,
-    a,
-    t,
-    i
-  ), l = "transform" in o ? o.transform : void 0, [p, h] = l?.position ?? [0, 0], [m, S] = l?.scale ?? [1, 1], M = l?.rotation?.[2] ?? 0, k = c * m, w = d * S, x = t / 2 + p * t / 2, R = i / 2 - h * i / 2;
+function He(o, e, r, i, n) {
+  const d = "fillMode" in o ? o.fillMode : void 0, { width: c, height: s } = Je(
+    d,
+    i,
+    n,
+    e,
+    r
+  ), l = "transform" in o ? o.transform : void 0, [m, p] = l?.position ?? [0, 0], [w, T] = l?.scale ?? [1, 1], h = l?.rotation?.[2] ?? 0, v = c * w, y = s * T, g = e / 2 + m * e / 2, R = r / 2 - p * r / 2;
   return {
-    width: k,
-    height: w,
-    centerX: x,
+    width: v,
+    height: y,
+    centerX: g,
     centerY: R,
-    rotationRad: M / 180 * Math.PI
+    rotationRad: h / 180 * Math.PI
   };
 }
-function Qt(o) {
-  const t = /* @__PURE__ */ new Set();
-  for (const i of o.tracks)
-    for (const r of i.children)
-      r.url && t.add(r.url);
-  return t;
+function Qe(o) {
+  const e = /* @__PURE__ */ new Set();
+  for (const r of o.tracks)
+    for (const i of r.children)
+      i.url && e.add(i.url);
+  return e;
 }
-function Mt(o, t) {
-  const i = [];
-  return o.tracks.forEach((r, a) => {
-    r.children.forEach((u, c) => {
-      u.startTime <= t && t < u.endTime && i.push({ segment: u, trackIndex: a, childIndex: c });
+function xe(o, e) {
+  const r = [];
+  return o.tracks.forEach((i, n) => {
+    i.children.forEach((d, c) => {
+      d.startTime <= e && e < d.endTime && r.push({ segment: d, trackIndex: n, childIndex: c });
     });
-  }), i.sort((r, a) => {
-    const u = o.tracks[r.trackIndex], c = o.tracks[a.trackIndex], d = u?.trackType === "frames" && u.isMain, l = c?.trackType === "frames" && c.isMain, p = o.tracks.length, h = d ? 0 : p - r.trackIndex, m = l ? 0 : p - a.trackIndex;
-    return h !== m ? h - m : r.trackIndex === a.trackIndex ? r.childIndex - a.childIndex : r.trackIndex - a.trackIndex;
+  }), r.sort((i, n) => {
+    const d = o.tracks[i.trackIndex], c = o.tracks[n.trackIndex], s = d?.trackType === "frames" && d.isMain, l = c?.trackType === "frames" && c.isMain, m = o.tracks.length, p = s ? 0 : m - i.trackIndex, w = l ? 0 : m - n.trackIndex;
+    return p !== w ? p - w : i.trackIndex === n.trackIndex ? i.childIndex - n.childIndex : i.trackIndex - n.trackIndex;
   });
 }
-function Zt(o, t, i, r) {
-  const a = ee(t), u = o instanceof O && o.texture.width || i, c = o instanceof O && o.texture.height || r, d = Ht(t, i, r, u, c);
-  o instanceof O ? (o.anchor.set(0.5), o.width = d.width, o.height = d.height, o.position.set(d.centerX, d.centerY), o.rotation = d.rotationRad, o.texture.source?.addEventListener?.("error", () => {
-    o.texture = V.from(te(i, r));
-  }, { once: !0 })) : o instanceof vt && (o.clear(), o.rect(0, 0, d.width, d.height).fill({ color: gt("url" in t && typeof t.url == "string" ? t.url : t.segmentType), alpha: xt(t) ? a : 0.35 }), o.pivot.set(d.width / 2, d.height / 2), o.position.set(d.centerX, d.centerY), o.rotation = d.rotationRad), o.alpha = a;
+function Ze(o, e, r, i) {
+  const n = tt(e), d = o instanceof $ && o.texture.width || r, c = o instanceof $ && o.texture.height || i, s = He(e, r, i, d, c);
+  o instanceof $ ? (o.anchor.set(0.5), o.width = s.width, o.height = s.height, o.position.set(s.centerX, s.centerY), o.rotation = s.rotationRad, o.texture.source?.addEventListener?.("error", () => {
+    o.texture = G.from(et(r, i));
+  }, { once: !0 })) : o instanceof ge && (o.clear(), o.rect(0, 0, s.width, s.height).fill({ color: Te("url" in e && typeof e.url == "string" ? e.url : e.segmentType), alpha: be(e) ? n : 0.35 }), o.pivot.set(s.width / 2, s.height / 2), o.position.set(s.centerX, s.centerY), o.rotation = s.rotationRad), o.alpha = n;
 }
-function Y(o, t) {
-  const i = new vt();
-  return i.rect(0, 0, 10, 10).fill({ color: gt(t ?? o), alpha: 1 }), i;
+function Z(o, e) {
+  const r = new ge();
+  return r.rect(0, 0, 10, 10).fill({ color: Te(e ?? o), alpha: 1 }), r;
 }
-function te(o, t, i) {
-  const r = `<svg xmlns="http://www.w3.org/2000/svg" width="${o}" height="${t}"><rect width="100%" height="100%" fill="#0f172a" fill-opacity="0.8"/></svg>`;
-  return `data:image/svg+xml;base64,${btoa(r)}`;
+function et(o, e, r) {
+  const i = `<svg xmlns="http://www.w3.org/2000/svg" width="${o}" height="${e}"><rect width="100%" height="100%" fill="#0f172a" fill-opacity="0.8"/></svg>`;
+  return `data:image/svg+xml;base64,${btoa(i)}`;
 }
-function gt(o) {
-  let t = 0;
-  for (let i = 0; i < o.length; i++)
-    t = o.charCodeAt(i) + ((t << 5) - t);
-  return t & 16777215;
+function Te(o) {
+  let e = 0;
+  for (let r = 0; r < o.length; r++)
+    e = o.charCodeAt(r) + ((e << 5) - e);
+  return e & 16777215;
 }
-function J(o) {
-  const t = o.tracks.flatMap((i) => i.children.map((r) => r.endTime));
-  return t.length ? Math.max(...t) : 0;
+function te(o) {
+  const e = o.tracks.flatMap((r) => r.children.map((i) => i.endTime));
+  return e.length ? Math.max(...e) : 0;
 }
-function X(o, t, i) {
-  return Math.min(Math.max(o, t), i);
+function ee(o, e, r) {
+  return Math.min(Math.max(o, e), r);
 }
-function pt(o) {
-  const t = zt(o);
-  return JSON.parse(JSON.stringify(t));
+function ye(o) {
+  const e = Ge(o);
+  return JSON.parse(JSON.stringify(e));
 }
-function xt(o) {
+function be(o) {
   return "opacity" in o;
 }
-function ee(o) {
-  return xt(o) && typeof o.opacity == "number" ? o.opacity : 1;
+function tt(o) {
+  return be(o) && typeof o.opacity == "number" ? o.opacity : 1;
 }
-class oe {
+class ot {
   protocol;
   clips = /* @__PURE__ */ new Map();
   loadingClips = /* @__PURE__ */ new Map();
@@ -104,44 +104,54 @@ class oe {
   mp4States = /* @__PURE__ */ new Map();
   audioGains = /* @__PURE__ */ new Map();
   mp4Gains = /* @__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(e) {
+    this.protocol = e, this.ctx = new (window.AudioContext || window.webkitAudioContext)();
   }
-  setProtocol(t) {
-    this.protocol = t;
+  setProtocol(e) {
+    this.protocol = e;
   }
-  async sync(t, i) {
-    if (!i) {
-      this.stopAll(), this.lastTime = t;
+  async sync(e, r) {
+    if (!r) {
+      this.stopAll(), this.lastTime = e;
       return;
     }
     this.ctx.state === "suspended" && await this.ctx.resume().catch(() => {
-    }), Math.abs(t - this.lastTime) > 1e3 && this.stopAll(), this.lastTime = t;
-    const r = Mt(this.protocol, t), a = /* @__PURE__ */ new Set(), u = /* @__PURE__ */ new Set();
-    for (const { segment: c } of r)
+    }), Math.abs(e - this.lastTime) > 1e3 && this.stopAll(), this.lastTime = e;
+    const i = xe(this.protocol, e), n = /* @__PURE__ */ new Set(), d = /* @__PURE__ */ new Set();
+    for (const { segment: c } of i)
       if (c.segmentType === "audio") {
-        const d = this.audioKey(c.id);
-        a.add(d), this.ensureAudioLoop(c, t);
+        const s = this.audioKey(c.id);
+        n.add(s), this.useMediaElementForAudio ? this.syncAudioElement(c, e) : this.ensureAudioLoop(c, e);
       } else if (c.segmentType === "frames" && "type" in c && c.type === "video") {
-        const d = this.videoKey(c.id);
-        u.add(d);
+        const s = this.videoKey(c.id);
+        d.add(s);
       }
-    for (const [c, d] of this.audioLoops)
-      if (!a.has(c)) {
-        d.stop();
-        for (const l of d.sources)
+    for (const [c, s] of this.audioLoops)
+      if (!n.has(c)) {
+        s.stop();
+        for (const l of s.sources)
           try {
             l.stop(), l.disconnect();
           } catch {
           }
         this.audioLoops.delete(c), this.audioLoopContexts.delete(c), this.audioGains.delete(c);
       }
-    for (const [c, d] of this.mp4Loops)
-      if (!u.has(c)) {
-        d.stop();
-        for (const l of d.sources)
+    for (const [c, s] of this.audioElements)
+      if (!n.has(c)) {
+        try {
+          s.el.pause(), s.pendingPlay = void 0, s.lastTimelineMs = void 0, s.lastSourceSec = void 0, s.lastSeekTimelineMs = void 0;
+        } catch {
+        }
+        this.findSegmentInProtocol(s.segmentId) || (this.destroyAudioElement(s.el), this.audioElements.delete(c));
+      }
+    for (const [c, s] of this.mp4Loops)
+      if (!d.has(c)) {
+        s.stop();
+        for (const l of s.sources)
           try {
             l.stop(), l.disconnect();
           } catch {
@@ -149,872 +159,941 @@ class oe {
         this.mp4Loops.delete(c), this.mp4States.delete(c), this.mp4Gains.delete(c);
       }
     for (const c of this.mp4States.keys())
-      !u.has(c) && !this.mp4Loops.has(c) && (this.mp4States.delete(c), this.mp4Gains.delete(c));
+      !d.has(c) && !this.mp4Loops.has(c) && (this.mp4States.delete(c), this.mp4Gains.delete(c));
   }
   /**
    * Play audio frames from MP4 video directly.
    * Called by renderer after it gets audio data from clip.tick()
    */
-  playMp4AudioFrames(t, i, r) {
-    if (!i || i.length === 0 || !i[0]?.length)
+  playMp4AudioFrames(e, r, i) {
+    if (!r || r.length === 0 || !r[0]?.length)
       return;
-    const a = this.videoKey(t), u = this.getSegmentVolume(t), c = this.getOrCreateGain(this.mp4Gains, a, u);
+    const n = this.videoKey(e), d = this.getSegmentVolume(e), c = this.getOrCreateGain(this.mp4Gains, n, d);
     this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
     });
-    let d = this.mp4States.get(a);
-    d || (d = {
+    let s = this.mp4States.get(n);
+    s || (s = {
       loop: { stop: () => {
       }, sources: [], isStopped: () => !1 },
       startUs: 0,
       startCtxTime: this.ctx.currentTime,
       fps: 30,
       nextStartAt: 0
-    }, this.mp4States.set(a, d)), d.nextStartAt = this.playFrames(i, r, d.nextStartAt ?? 0, c, d.loop.sources);
+    }, this.mp4States.set(n, s)), s.nextStartAt = this.playFrames(r, i, s.nextStartAt ?? 0, c, s.loop.sources);
   }
   /**
    * Reset MP4 audio playback state (call when seeking or pausing)
    */
-  resetMp4Audio(t) {
-    const i = this.videoKey(t), r = this.mp4States.get(i);
-    r && (r.nextStartAt = 0);
+  resetMp4Audio(e) {
+    const r = this.videoKey(e), i = this.mp4States.get(r);
+    i && (i.nextStartAt = 0);
   }
   /**
    * Stop and clean up MP4 audio for a video segment
    */
-  stopMp4Audio(t) {
-    const i = this.videoKey(t), r = this.mp4States.get(i);
-    if (r) {
-      r.loop.stop();
-      for (const a of r.loop.sources)
+  stopMp4Audio(e) {
+    const r = this.videoKey(e), i = this.mp4States.get(r);
+    if (i) {
+      i.loop.stop();
+      for (const n of i.loop.sources)
         try {
-          a.stop(), a.disconnect();
+          n.stop(), n.disconnect();
         } catch {
         }
-      this.mp4Loops.delete(i), this.mp4States.delete(i), this.mp4Gains.delete(i);
+      this.mp4Loops.delete(r), this.mp4States.delete(r), this.mp4Gains.delete(r);
     }
   }
   /**
    * @deprecated Use playMp4AudioFrames instead
    */
-  ensureMp4Audio(t, i, r, a) {
-    const u = this.videoKey(t), c = this.getSegmentVolume(t), d = this.getOrCreateGain(this.mp4Gains, u, c), l = this.mp4States.get(u);
+  ensureMp4Audio(e, r, i, n) {
+    const d = this.videoKey(e), c = this.getSegmentVolume(e), s = this.getOrCreateGain(this.mp4Gains, d, c), l = this.mp4States.get(d);
     if (l) {
-      d.gain.value = Math.max(0, c);
-      const h = (this.ctx.currentTime - l.startCtxTime) * 1e6, m = l.startUs + h;
-      if (Math.abs(m - r) < 15e4 && l.fps === a)
+      s.gain.value = Math.max(0, c);
+      const p = (this.ctx.currentTime - l.startCtxTime) * 1e6, w = l.startUs + p;
+      if (Math.abs(w - i) < 15e4 && l.fps === n)
         return;
       l.loop.stop();
-      for (const S of l.loop.sources)
+      for (const T of l.loop.sources)
         try {
-          S.stop(), S.disconnect();
+          T.stop(), T.disconnect();
         } catch {
         }
-      this.mp4Loops.delete(u), this.mp4States.delete(u);
+      this.mp4Loops.delete(d), this.mp4States.delete(d);
     }
     this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
     });
-    const p = this.startMp4Loop(i, r, a, d);
-    this.mp4Loops.set(u, p), this.mp4States.set(u, {
-      loop: p,
-      startUs: r,
+    const m = this.startMp4Loop(r, i, n, s);
+    this.mp4Loops.set(d, m), this.mp4States.set(d, {
+      loop: m,
+      startUs: i,
       startCtxTime: this.ctx.currentTime,
-      fps: a
+      fps: n
     });
   }
   destroy() {
     this.stopAll();
-    for (const t of this.clips.values())
-      t.clip.destroy();
+    for (const e of this.clips.values())
+      e.clip.destroy();
     this.clips.clear();
+    for (const e of this.audioElements.values())
+      this.destroyAudioElement(e.el);
+    this.audioElements.clear();
   }
   stopAll() {
-    for (const t of this.audioLoops.values()) {
-      t.stop();
-      for (const i of t.sources)
+    for (const e of this.audioElements.values())
+      try {
+        e.el.pause(), e.pendingPlay = void 0, e.lastTimelineMs = void 0, e.lastSourceSec = void 0, e.lastSeekTimelineMs = void 0;
+      } catch {
+      }
+    for (const e of this.audioLoops.values()) {
+      e.stop();
+      for (const r of e.sources)
         try {
-          i.stop(0), i.disconnect();
+          r.stop(0), r.disconnect();
         } catch {
         }
-      t.sources.length = 0;
+      e.sources.length = 0;
     }
-    for (const t of this.mp4Loops.values()) {
-      t.stop();
-      for (const i of t.sources)
+    for (const e of this.mp4Loops.values()) {
+      e.stop();
+      for (const r of e.sources)
         try {
-          i.stop(0), i.disconnect();
+          r.stop(0), r.disconnect();
         } catch {
         }
-      t.sources.length = 0;
+      e.sources.length = 0;
     }
-    for (const t of this.audioGains.values())
+    for (const e of this.audioGains.values())
       try {
-        t.disconnect();
+        e.disconnect();
       } catch {
       }
-    for (const t of this.mp4Gains.values())
+    for (const e of this.mp4Gains.values())
       try {
-        t.disconnect();
+        e.disconnect();
       } catch {
       }
     this.audioLoops.clear(), this.audioLoopContexts.clear(), this.audioGains.clear(), this.mp4Loops.clear(), this.mp4States.clear(), this.mp4Gains.clear();
   }
-  async ensureAudioLoop(t, i) {
-    const r = this.audioKey(t.id), a = await this.loadClip(t);
-    if (!a)
+  async ensureAudioLoop(e, r) {
+    const i = this.audioKey(e.id), n = await this.loadClip(e);
+    if (!n)
       return;
-    const u = t.fromTime ?? 0, c = Math.max(0.1, Math.min(100, t.playRate ?? 1)), d = i - t.startTime, l = u + d * c, p = this.getOrCreateGain(this.audioGains, r, t.volume);
-    this.applyFadeToGain(t, d, p);
-    const h = this.audioLoops.get(r);
-    if (h && !h.isStopped())
+    const d = e.fromTime ?? 0, c = this.normalizePlayRate(e.playRate), s = r - e.startTime, l = d + s * c, m = this.getOrCreateGain(this.audioGains, i, e.volume);
+    this.applyFadeToGain(e, s, m);
+    const p = this.audioLoops.get(i);
+    if (p && !p.isStopped())
       return;
-    h && (this.audioLoops.delete(r), this.audioLoopContexts.delete(r));
-    const S = (t.endTime - t.startTime) * c, M = u + S, k = this.startAudioLoop(a.clip, Math.max(0, l) * 1e3, p, c, M * 1e3);
-    this.audioLoops.set(r, k), this.audioLoopContexts.set(r, {
-      segment: t,
+    p && (this.audioLoops.delete(i), this.audioLoopContexts.delete(i));
+    const T = (e.endTime - e.startTime) * c, h = d + T, v = this.startAudioLoop(n.clip, Math.max(0, l) * 1e3, m, c, h * 1e3);
+    this.audioLoops.set(i, v), this.audioLoopContexts.set(i, {
+      segment: e,
       startedAt: this.ctx.currentTime,
-      segmentRelativeMs: d
+      segmentRelativeMs: s
     });
   }
-  applyFadeToGain(t, i, r) {
-    const a = Math.max(0, typeof t.volume == "number" ? t.volume : 1), u = t.endTime - t.startTime, c = t.fadeInDuration ?? 0, d = t.fadeOutDuration ?? 0;
-    let l = 1;
-    c > 0 && i < c && (l = Math.max(0, i / c));
-    const p = u - i;
-    d > 0 && p < d && (l = Math.min(l, Math.max(0, p / d))), r.gain.value = a * l;
-  }
-  startMp4Loop(t, i, r, a) {
-    let u = !1, c = i, d = 0, l = !0;
-    const p = Math.round(1e3 / Math.max(r || 30, 1) * 1e3), h = this.getClipSampleRate(t), m = [], S = window.setInterval(async () => {
-      if (u)
+  syncAudioElement(e, r) {
+    const i = this.audioKey(e.id), n = this.getOrCreateAudioElementState(i, e), d = r - e.startTime, c = this.normalizePlayRate(e.playRate), s = e.fromTime ?? 0, l = s + d * c, p = Math.max(0, e.endTime - e.startTime) * c, w = s + p, T = Math.max(0, w) / 1e3, h = Number.isFinite(n.el.duration) ? Math.max(0, n.el.duration) : void 0, v = h === void 0 ? T : Math.min(T, h), y = Math.max(0, Math.min(l / 1e3, v)), g = l / 1e3 >= v - 0.01;
+    Math.abs(n.el.playbackRate - c) > 1e-3 && (n.el.playbackRate = c);
+    const R = this.computeSegmentVolume(e, d);
+    Math.abs(n.el.volume - R) > 1e-3 && (n.el.volume = R);
+    const I = 0.24, E = 500, A = 300, k = -40, K = n.lastTimelineMs, z = n.lastSourceSec, D = K === void 0 ? 0 : r - K;
+    let O = !1;
+    if (K === void 0)
+      O = !0;
+    else if (D < k || D > A)
+      O = !0;
+    else if (z !== void 0) {
+      const L = z + D * c / 1e3, W = Math.abs(L - y), j = n.lastSeekTimelineMs === void 0 || r - n.lastSeekTimelineMs >= E;
+      W > I && j && (O = !0);
+    }
+    if (O && Math.abs(n.el.currentTime - y) > 0.06)
+      try {
+        n.el.currentTime = y, n.lastSeekTimelineMs = r;
+      } catch {
+      }
+    if (n.lastTimelineMs = r, n.lastSourceSec = y, g) {
+      if (!n.el.paused)
+        try {
+          n.el.pause();
+        } catch {
+        }
+      n.pendingPlay = void 0;
+      return;
+    }
+    if (n.el.paused && !n.pendingPlay) {
+      const L = n.el.play();
+      L && typeof L.then == "function" && (n.pendingPlay = L.catch(() => {
+      }).finally(() => {
+        n.pendingPlay = void 0;
+      }));
+    }
+  }
+  applyFadeToGain(e, r, i) {
+    i.gain.value = this.computeSegmentVolume(e, r);
+  }
+  startMp4Loop(e, r, i, n) {
+    let d = !1, c = r, s = 0, l = !0;
+    const m = Math.round(1e3 / Math.max(i || 30, 1) * 1e3), p = this.getClipSampleRate(e), w = [], T = window.setInterval(async () => {
+      if (d)
         return;
-      const { audio: M, state: k } = await t.tick(Math.round(c));
-      if (c += p, k === "done")
+      const { audio: h, state: v } = await e.tick(Math.round(c));
+      if (c += m, v === "done")
         return;
       if (l) {
         l = !1;
         return;
       }
-      (M?.[0]?.length ?? 0) !== 0 && (d = this.playFrames(M, h, d, a, m));
-    }, Math.round(1e3 / Math.max(r || 30, 1)));
+      (h?.[0]?.length ?? 0) !== 0 && (s = this.playFrames(h, p, s, n, w));
+    }, Math.round(1e3 / Math.max(i || 30, 1)));
     return {
-      sources: m,
+      sources: w,
       stop: () => {
-        u = !0, window.clearInterval(S);
+        d = !0, window.clearInterval(T);
       },
-      isStopped: () => u
+      isStopped: () => d
     };
   }
-  startAudioLoop(t, i, r, a = 1, u) {
-    let c = !1, d = i, l = 0, p = !1;
-    const h = this.getClipSampleRate(t), m = [], M = Math.round(1e5 * a), k = async () => {
+  startAudioLoop(e, r, i, n = 1, d) {
+    let c = !1, s = r, l = 0, m = !1;
+    const p = this.getClipSampleRate(e), w = [], h = Math.round(1e5 * n), v = async () => {
       if (c)
         return;
-      if (p || (i > 0 && await t.tick(i), p = !0), d += M, u !== void 0 && d > u) {
+      if (m || (r > 0 && await e.tick(r), m = !0), s += h, d !== void 0 && s > d) {
         c = !0;
         return;
       }
-      const { audio: w, state: x } = await t.tick(d);
+      const { audio: y, state: g } = await e.tick(s);
       if (c)
         return;
-      if (x === "done") {
+      if (g === "done") {
         c = !0;
         return;
       }
-      if ((w?.[0]?.length ?? 0) === 0) {
+      if ((y?.[0]?.length ?? 0) === 0) {
         c = !0;
         return;
       }
-      const E = a !== 1 ? this.resampleForPlayRate(w, a) : w;
-      l = this.playFrames(E, h, l, r, m), c || setTimeout(() => k(), 0);
+      l = this.playFrames(y, p, l, i, w, n), c || setTimeout(() => v(), 0);
     };
-    return k(), {
-      sources: m,
+    return v(), {
+      sources: w,
       stop: () => {
         c = !0;
       },
-      isStopped: () => c
+      // Treat loop as active while there are still scheduled sources playing.
+      isStopped: () => c && w.length === 0
     };
   }
-  resampleForPlayRate(t, i) {
-    const r = Math.round(t[0].length / i);
-    return r <= 0 ? t : t.map((a) => {
-      const u = new Float32Array(r);
-      for (let c = 0; c < r; c++) {
-        const d = c * i, l = Math.floor(d), p = Math.min(l + 1, a.length - 1), h = d - l;
-        u[c] = a[l] * (1 - h) + a[p] * h;
-      }
-      return u;
-    });
-  }
-  playFrames(t, i, r, a, u) {
-    const c = Math.max(t.length, 1), d = t[0]?.length ?? 0;
-    if (d === 0)
-      return r;
-    const l = this.ctx.createBuffer(c, d, i);
-    for (let m = 0; m < c; m++) {
-      const S = t[m] ?? new Float32Array(d);
-      l.copyToChannel(new Float32Array(S), m);
+  playFrames(e, r, i, n, d, c = 1) {
+    const s = Math.max(e.length, 1), l = e[0]?.length ?? 0;
+    if (l === 0)
+      return i;
+    const m = this.ctx.createBuffer(s, l, r);
+    for (let h = 0; h < s; h++) {
+      const v = e[h] ?? new Float32Array(l);
+      m.copyToChannel(new Float32Array(v), h);
     }
     const p = this.ctx.createBufferSource();
-    p.buffer = l, p.connect(a);
-    const h = Math.max(this.ctx.currentTime, r);
-    if (p.start(h), u) {
-      u.push(p);
-      const m = l.duration * 1e3;
+    p.buffer = m;
+    const w = Math.max(0.1, c);
+    p.playbackRate.value = w, p.connect(n);
+    const T = Math.max(this.ctx.currentTime, i);
+    if (p.start(T), d) {
+      d.push(p);
+      const h = m.duration / w * 1e3;
       setTimeout(() => {
-        const S = u.indexOf(p);
-        S > -1 && u.splice(S, 1);
-      }, m + 100);
+        const v = d.indexOf(p);
+        v > -1 && d.splice(v, 1);
+      }, h + 100);
     }
-    return h + l.duration;
+    return T + m.duration / w;
   }
-  getOrCreateGain(t, i, r) {
-    const a = t.get(i);
-    if (a)
-      return typeof r == "number" && (a.gain.value = Math.max(0, r)), a;
-    const u = this.ctx.createGain();
-    return u.gain.value = Math.max(0, typeof r == "number" ? r : 1), u.connect(this.ctx.destination), t.set(i, u), u;
+  getOrCreateGain(e, r, i) {
+    const n = e.get(r);
+    if (n)
+      return typeof i == "number" && (n.gain.value = this.normalizeVolume(i)), n;
+    const d = this.ctx.createGain();
+    return d.gain.value = this.normalizeVolume(i), d.connect(this.ctx.destination), e.set(r, d), d;
   }
-  audioKey(t) {
-    return `audio:${t}`;
+  getOrCreateAudioElementState(e, r) {
+    const i = this.audioElements.get(e);
+    if (i)
+      return i.url !== r.url && (i.el.pause(), i.el.src = r.url, i.el.currentTime = 0, i.url = r.url, i.pendingPlay = void 0, i.lastTimelineMs = void 0, i.lastSourceSec = void 0, i.lastSeekTimelineMs = void 0), i;
+    const n = new Audio(r.url);
+    n.preload = "auto", n.loop = !1, n.volume = this.normalizeVolume(r.volume), n.playbackRate = this.normalizePlayRate(r.playRate);
+    const d = {
+      segmentId: r.id,
+      url: r.url,
+      el: n
+    };
+    return this.audioElements.set(e, d), d;
   }
-  videoKey(t) {
-    return `video:${t}`;
+  destroyAudioElement(e) {
+    try {
+      e.pause();
+    } catch {
+    }
+    e.removeAttribute("src");
+    try {
+      e.load();
+    } catch {
+    }
   }
-  async loadClip(t) {
-    const i = this.clips.get(t.id);
-    if (i)
-      return i;
-    const r = this.loadingClips.get(t.id);
+  normalizePlayRate(e) {
+    return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0.1, Math.min(100, e));
+  }
+  normalizeVolume(e) {
+    return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0, Math.min(1, e));
+  }
+  computeSegmentVolume(e, r) {
+    const i = this.normalizeVolume(e.volume), n = Math.max(0, e.endTime - e.startTime), d = Math.max(0, e.fadeInDuration ?? 0), c = Math.max(0, e.fadeOutDuration ?? 0);
+    let s = 1;
+    d > 0 && r < d && (s = Math.max(0, r / d));
+    const l = n - r;
+    return c > 0 && l < c && (s = Math.min(s, Math.max(0, l / c))), i * s;
+  }
+  audioKey(e) {
+    return `audio:${e}`;
+  }
+  videoKey(e) {
+    return `video:${e}`;
+  }
+  async loadClip(e) {
+    const r = this.clips.get(e.id);
     if (r)
       return r;
-    const a = (async () => {
+    const i = this.loadingClips.get(e.id);
+    if (i)
+      return i;
+    const n = (async () => {
       try {
-        const u = await fetch(t.url);
-        if (!u.body) {
-          this.loadingClips.delete(t.id);
+        const d = await fetch(e.url);
+        if (!d.body) {
+          this.loadingClips.delete(e.id);
           return;
         }
-        const c = new jt(u.body), d = { clip: c, ready: c.ready };
-        if (await c.ready, !this.findSegmentInProtocol(t.id)) {
-          c.destroy(), this.loadingClips.delete(t.id);
+        const c = new je(d.body), s = { clip: c, ready: c.ready };
+        if (await c.ready, !this.findSegmentInProtocol(e.id)) {
+          c.destroy(), this.loadingClips.delete(e.id);
           return;
         }
-        return this.clips.set(t.id, d), this.loadingClips.delete(t.id), d;
-      } catch (u) {
-        console.error(`[AudioManager] Failed to load audio ${t.url}`, u), this.loadingClips.delete(t.id);
+        return this.clips.set(e.id, s), this.loadingClips.delete(e.id), s;
+      } catch (d) {
+        console.error(`[AudioManager] Failed to load audio ${e.url}`, d), this.loadingClips.delete(e.id);
         return;
       }
     })();
-    return this.loadingClips.set(t.id, a), a;
+    return this.loadingClips.set(e.id, n), n;
   }
-  findSegmentInProtocol(t) {
-    for (const i of this.protocol.tracks)
-      for (const r of i.children)
-        if (r.id === t) return !0;
+  findSegmentInProtocol(e) {
+    for (const r of this.protocol.tracks)
+      for (const i of r.children)
+        if (i.id === e) return !0;
     return !1;
   }
-  getSegmentVolume(t) {
-    for (const i of this.protocol.tracks)
-      for (const r of i.children) {
-        if (r.id !== t)
+  getSegmentVolume(e) {
+    for (const r of this.protocol.tracks)
+      for (const i of r.children) {
+        if (i.id !== e)
           continue;
-        const a = r.volume;
-        return typeof a == "number" ? a : 1;
+        const n = i.volume;
+        return this.normalizeVolume(n);
       }
     return 1;
   }
-  getClipSampleRate(t) {
-    const i = t.meta;
-    if (!i)
+  getClipSampleRate(e) {
+    const r = e.meta;
+    if (!r)
       return 48e3;
-    const r = i.audioSampleRate;
-    if (typeof r == "number" && r > 0)
-      return r;
-    const a = i.sampleRate;
-    return typeof a == "number" && a > 0 ? a : 48e3;
+    const i = r.audioSampleRate;
+    if (typeof i == "number" && i > 0)
+      return i;
+    const n = r.sampleRate;
+    return typeof n == "number" && n > 0 ? n : 48e3;
   }
 }
-const re = 100, $ = /* @__PURE__ */ new Map();
-let ie = re;
-function ne(o, t) {
-  $.delete(o), $.set(o, t);
+const it = 100, U = /* @__PURE__ */ new Map();
+let rt = it;
+function nt(o, e) {
+  U.delete(o), U.set(o, e);
 }
-function ae() {
-  for (; $.size > ie; ) {
-    const [o, t] = $.entries().next().value;
-    $.delete(o), t.close?.();
+function at() {
+  for (; U.size > rt; ) {
+    const [o, e] = U.entries().next().value;
+    U.delete(o), e.close?.();
   }
 }
-function se(o) {
-  return o.map((t) => t.content).filter(Boolean).join(`
+function st(o) {
+  return o.map((e) => e.content).filter(Boolean).join(`
 `);
 }
-function ce(o) {
-  const t = Array.isArray(o.fontFamily) ? o.fontFamily.join(", ") : o.fontFamily, i = o.fontSize ?? 32, r = o.fontWeight ?? "normal", a = o.fontStyle ?? "normal", u = o.fill ?? "#ffffff", c = o.align ?? "left", d = [
-    `font-size: ${i}px`,
-    `font-weight: ${r}`,
-    `font-style: ${a}`,
-    `color: ${u}`,
+function ct(o) {
+  const e = Array.isArray(o.fontFamily) ? o.fontFamily.join(", ") : o.fontFamily, r = o.fontSize ?? 32, i = o.fontWeight ?? "normal", n = o.fontStyle ?? "normal", d = o.fill ?? "#ffffff", c = o.align ?? "left", s = [
+    `font-size: ${r}px`,
+    `font-weight: ${i}`,
+    `font-style: ${n}`,
+    `color: ${d}`,
     `text-align: ${c}`,
     "white-space: pre-wrap"
   ];
-  if (t && d.push(`font-family: ${t}`), typeof o.letterSpacing == "number" && d.push(`letter-spacing: ${o.letterSpacing}px`), typeof o.leading == "number" && d.push(`line-height: ${o.leading}px`), o.background?.color && d.push(`background: ${o.background.color}`), o.stroke?.color && typeof o.stroke.width == "number" && d.push(`-webkit-text-stroke: ${o.stroke.width}px ${o.stroke.color}`), o.underline && d.push("text-decoration: underline"), o.dropShadow?.color && typeof o.dropShadow.distance == "number") {
-    const l = (o.dropShadow.angle ?? 45) * (Math.PI / 180), p = Math.cos(l) * o.dropShadow.distance, h = Math.sin(l) * o.dropShadow.distance, m = o.dropShadow.blur ?? 0;
-    d.push(`text-shadow: ${p}px ${h}px ${m}px ${o.dropShadow.color}`);
+  if (e && s.push(`font-family: ${e}`), typeof o.letterSpacing == "number" && s.push(`letter-spacing: ${o.letterSpacing}px`), typeof o.leading == "number" && s.push(`line-height: ${o.leading}px`), o.background?.color && s.push(`background: ${o.background.color}`), o.stroke?.color && typeof o.stroke.width == "number" && s.push(`-webkit-text-stroke: ${o.stroke.width}px ${o.stroke.color}`), o.underline && s.push("text-decoration: underline"), o.dropShadow?.color && typeof o.dropShadow.distance == "number") {
+    const l = (o.dropShadow.angle ?? 45) * (Math.PI / 180), m = Math.cos(l) * o.dropShadow.distance, p = Math.sin(l) * o.dropShadow.distance, w = o.dropShadow.blur ?? 0;
+    s.push(`text-shadow: ${m}px ${p}px ${w}px ${o.dropShadow.color}`);
   }
-  return d.join("; ");
+  return s.join("; ");
 }
-async function de(o, t) {
-  const i = `${t}::${o}`, r = $.get(i);
-  if (r)
-    return ne(i, r), r;
-  const a = await _t(o, t);
-  return $.set(i, a), ae(), a;
+async function ut(o, e) {
+  const r = `${e}::${o}`, i = U.get(r);
+  if (i)
+    return nt(r, i), i;
+  const n = await _e(o, e);
+  return U.set(r, n), at(), n;
 }
-const ue = "/video-editor-res";
-async function le(o) {
-  const t = Gt(), i = Kt(o.protocol) ? o.protocol : ut(o.protocol), r = ut(
-    t.verify(pt(lt(i)))
-  ), a = o.app ?? await Xt(o.appOptions), u = new Yt();
-  a.stage.addChild(u);
-  const c = Nt({ dir: o.resourceDir }), d = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Map(), p = /* @__PURE__ */ new Map(), h = /* @__PURE__ */ new Set(), m = /* @__PURE__ */ new Set(), S = o.videoSourceMode ?? "auto", M = /* @__PURE__ */ new Map(), k = /* @__PURE__ */ new Map(), w = ft(0), x = ft(!1), R = qt(() => J(r.value)), E = new oe(r.value);
-  let A, L = 0, C = 0;
-  async function St(e) {
-    const s = C, { protocol: n, at: f, layer: y } = e, v = Ot(n, f), g = Mt(n, v), T = e.app.renderer.width, b = e.app.renderer.height;
-    E.sync(f, x.value);
-    const I = [];
-    for (const { segment: U } of g) {
-      if (s !== C)
+const dt = "/video-editor-res";
+async function lt(o) {
+  const e = De(), r = Ke(o.protocol) ? o.protocol : pe(o.protocol), i = pe(
+    e.verify(ye(he(r)))
+  ), n = o.app ?? await Xe(o.appOptions), d = new Ye();
+  n.stage.addChild(d);
+  const c = Ne({ dir: o.resourceDir }), s = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map(), p = /* @__PURE__ */ new Set(), w = /* @__PURE__ */ new Set(), T = o.videoSourceMode ?? "auto", h = /* @__PURE__ */ new Map(), v = /* @__PURE__ */ new Map(), y = me(0), g = me(!1), R = qe(() => te(i.value)), I = new ot(i.value);
+  let E, A = 0, k = 0;
+  async function K(t) {
+    const u = k, { protocol: a, at: f, layer: M } = t, S = Oe(a, f), x = xe(a, S), b = t.app.renderer.width, C = t.app.renderer.height;
+    I.sync(f, g.value);
+    const P = [];
+    for (const { segment: N } of x) {
+      if (u !== k)
         return;
-      const P = await e.getDisplay(U);
-      if (s !== C)
+      const V = await t.getDisplay(N);
+      if (u !== k)
         return;
-      if (P && !P.destroyed) {
-        if (Zt(P, U, T, b), Pt(U) && await j(U, v), s !== C)
+      if (V && !V.destroyed) {
+        if (Ze(V, N, b, C), Fe(N) && await J(N, S), u !== k)
           return;
-        I.push(P);
+        P.push(V);
       }
     }
-    if (s !== C)
+    if (u !== k)
       return;
-    y.removeChildren();
-    const F = I.filter(Boolean);
-    F.length && y.addChild(...F), s === C && e.app.render();
-  }
-  const z = fe(() => St({
-    app: a,
-    layer: u,
-    protocol: r.value,
-    at: w.value,
-    getDisplay: Rt
-  })), Q = Bt();
-  Q.run(() => {
-    W(
-      () => lt(i),
-      (e) => {
+    M.removeChildren();
+    const F = P.filter(Boolean);
+    F.length && M.addChild(...F), u === k && t.app.render();
+  }
+  const z = ft(() => K({
+    app: n,
+    layer: d,
+    protocol: i.value,
+    at: y.value,
+    getDisplay: Re
+  })), D = Be();
+  D.run(() => {
+    Q(
+      () => he(r),
+      (t) => {
         try {
-          r.value = t.verify(pt(e));
-        } catch (s) {
-          console.error("[renderer] invalid protocol update", s);
+          i.value = e.verify(ye(t));
+        } catch (u) {
+          console.error("[renderer] invalid protocol update", u);
           return;
         }
-        E.setProtocol(r.value), C += 1, Z(), o.warmUpResources !== !1 && Tt(r.value), bt(r.value), K(), o.manualRender || z();
+        I.setProtocol(i.value), k += 1, j(), o.warmUpResources !== !1 && L(i.value), W(i.value), O(), o.manualRender || z();
       },
       { deep: !0, immediate: !0 }
-    ), o.manualRender || W(w, () => {
-      K(), z();
-    }), W(R, () => K());
+    ), o.manualRender || Q(y, () => {
+      O(), z();
+    }), Q(R, () => O());
   });
-  function K() {
-    const e = R.value;
-    e <= 0 ? w.value = 0 : w.value > e ? w.value = e : w.value < 0 && (w.value = 0);
+  function O() {
+    const t = R.value;
+    t <= 0 ? y.value = 0 : y.value > t ? y.value = t : y.value < 0 && (y.value = 0);
   }
-  function Tt(e) {
-    for (const s of Qt(e))
-      d.has(s) || (d.add(s), st(s) !== "video" && it(s) && c.add(s).catch(() => {
+  function L(t) {
+    for (const u of Qe(t))
+      s.has(u) || (s.add(u), de(u) !== "video" && se(u) && c.add(u).catch(() => {
       }));
   }
-  function bt(e) {
-    const s = /* @__PURE__ */ new Set();
-    for (const n of e.tracks)
-      for (const f of n.children)
-        s.add(f.id);
-    for (const [n, f] of l)
-      s.has(n) || (f.destroy(), l.delete(n));
-    for (const [n, f] of M)
-      s.has(n) || (nt(f), M.delete(n));
-  }
-  function Z() {
-    u.removeChildren();
-    for (const e of l.values())
-      e.destroy();
-    l.clear(), p.clear();
-    for (const e of M.values())
-      nt(e);
-    M.clear();
-  }
-  function tt() {
-    x.value || (x.value = !0, L = performance.now(), A = requestAnimationFrame(et));
-  }
-  function q() {
-    x.value = !1, A !== void 0 && cancelAnimationFrame(A), A = void 0, E.sync(w.value, !1), o.freezeOnPause !== !1 && $t();
-  }
-  function et() {
-    ot(), x.value && (A = requestAnimationFrame(et));
-  }
-  function ot(e) {
-    if (!x.value && e === void 0)
+  function W(t) {
+    const u = /* @__PURE__ */ new Set();
+    for (const a of t.tracks)
+      for (const f of a.children)
+        u.add(f.id);
+    for (const [a, f] of l)
+      u.has(a) || (f.destroy(), l.delete(a));
+    for (const [a, f] of h)
+      u.has(a) || (ce(f), h.delete(a));
+  }
+  function j() {
+    d.removeChildren();
+    for (const t of l.values())
+      t.destroy();
+    l.clear(), m.clear();
+    for (const t of h.values())
+      ce(t);
+    h.clear();
+  }
+  function ie() {
+    g.value || (g.value = !0, A = performance.now(), E = requestAnimationFrame(re));
+  }
+  function Y() {
+    g.value = !1, E !== void 0 && cancelAnimationFrame(E), E = void 0, I.sync(y.value, !1), o.freezeOnPause !== !1 && Ve();
+  }
+  function re() {
+    ne(), g.value && (E = requestAnimationFrame(re));
+  }
+  function ne(t) {
+    if (!g.value && t === void 0)
       return;
-    const s = performance.now(), n = e ?? (L ? s - L : 0);
-    L = s, n !== 0 && (w.value = X(
-      w.value + n,
+    const u = performance.now(), a = t ?? (A ? u - A : 0);
+    A = u, a !== 0 && (y.value = ee(
+      y.value + a,
       0,
       R.value || Number.POSITIVE_INFINITY
-    ), R.value > 0 && w.value >= R.value && q());
+    ), R.value > 0 && y.value >= R.value && Y());
   }
-  function kt(e) {
-    w.value = X(e, 0, R.value || Number.POSITIVE_INFINITY);
+  function ke(t) {
+    y.value = ee(t, 0, R.value || Number.POSITIVE_INFINITY);
   }
-  async function Ct(e) {
-    w.value = X(e, 0, R.value || Number.POSITIVE_INFINITY), await z();
+  async function Ce(t) {
+    y.value = ee(t, 0, R.value || Number.POSITIVE_INFINITY), await z();
   }
-  async function Rt(e) {
-    const s = l.get(e.id);
-    if (s)
-      return s;
-    const n = p.get(e.id);
-    if (n)
-      return n;
-    const f = At(e);
-    p.set(e.id, f);
-    const y = await f;
-    return y && l.set(e.id, y), p.delete(e.id), y;
-  }
-  async function At(e) {
-    if (e.segmentType === "frames" || e.segmentType === "sticker") {
-      if (!e.url)
-        return Y(e.segmentType);
-      if ("type" in e && e.type === "video" && ct(e.url)) {
-        const n = await Et(e);
-        return n || Y(e.segmentType, e.url);
+  async function Re(t) {
+    const u = l.get(t.id);
+    if (u)
+      return u;
+    const a = m.get(t.id);
+    if (a)
+      return a;
+    const f = Ee(t);
+    m.set(t.id, f);
+    const M = await f;
+    return M && l.set(t.id, M), m.delete(t.id), M;
+  }
+  async function Ee(t) {
+    if (t.segmentType === "frames" || t.segmentType === "sticker") {
+      if (!t.url)
+        return Z(t.segmentType);
+      if ("type" in t && t.type === "video" && le(t.url)) {
+        const a = await Ie(t);
+        return a || Z(t.segmentType, t.url);
       }
-      const s = await Lt(e.url);
-      return s ? new O(s) : Y(e.segmentType, e.url);
+      const u = await Pe(t.url);
+      return u ? new $(u) : Z(t.segmentType, t.url);
     }
-    if (e.segmentType === "text")
-      return await It(e);
-    e.segmentType === "effect" || e.segmentType;
+    if (t.segmentType === "text")
+      return await Ae(t);
+    t.segmentType === "effect" || t.segmentType;
   }
-  async function It(e) {
-    const s = se(e.texts);
-    if (!s)
+  async function Ae(t) {
+    const u = st(t.texts);
+    if (!u)
       return;
-    const [n] = e.texts;
-    if (!n)
+    const [a] = t.texts;
+    if (!a)
       return;
-    const f = await de(s, ce(n)), y = V.from(f);
-    return new O(y);
+    const f = await ut(u, ct(a)), M = G.from(f);
+    return new $(M);
   }
-  async function Lt(e) {
-    const s = e.startsWith("data:"), n = /^https?:\/\//.test(e);
-    if (!s && !n)
+  async function Pe(t) {
+    const u = t.startsWith("data:"), a = /^https?:\/\//.test(t);
+    if (!u && !a)
       try {
-        await c.add(e);
-        const f = await c.get(e);
+        await c.add(t);
+        const f = await c.get(t);
         if (f instanceof HTMLImageElement)
-          return V.from(f);
+          return G.from(f);
       } catch {
       }
-    return await Vt(e);
-  }
-  async function Et(e) {
-    const s = M.get(e.id);
-    if (s)
-      return s.sprite;
-    const n = N(e.url), f = S !== "element", y = S !== "mp4clip";
-    if (n && h.has(n)) {
-      if (!y)
-        throw new Error(`[renderer] MP4Clip unsupported for ${e.url}`);
-      const v = await D(e.url).catch((g) => {
-        console.warn("[renderer] failed to load video via <video>", e.url, g);
+    return await Ue(t);
+  }
+  async function Ie(t) {
+    const u = h.get(t.id);
+    if (u)
+      return u.sprite;
+    const a = _(t.url), f = T !== "element", M = T !== "mp4clip";
+    if (a && p.has(a)) {
+      if (!M)
+        throw new Error(`[renderer] MP4Clip unsupported for ${t.url}`);
+      const S = await q(t.url).catch((x) => {
+        console.warn("[renderer] failed to load video via <video>", t.url, x);
       });
-      return v ? (M.set(e.id, v), v.sprite) : void 0;
+      return S ? (h.set(t.id, S), S.sprite) : void 0;
     }
     if (f) {
-      const v = await at(e.url).catch((g) => {
-        if (n && B(g) && h.add(n), (!n || !m.has(n)) && (n && m.add(n), console.warn("[renderer] failed to load video via MP4Clip", e.url, g)), !y)
-          throw g;
+      const S = await ue(t.url).catch((x) => {
+        if (a && X(x) && p.add(a), (!a || !w.has(a)) && (a && w.add(a), console.warn("[renderer] failed to load video via MP4Clip", t.url, x)), !M)
+          throw x;
       });
-      if (v)
-        return console.info("[renderer] video source: mp4clip", e.url), M.set(e.id, v), v.sprite;
+      if (S)
+        return console.info("[renderer] video source: mp4clip", t.url), h.set(t.id, S), S.sprite;
     }
-    if (y) {
-      const v = await D(e.url).catch((g) => {
-        console.warn("[renderer] failed to load video via <video>", e.url, g);
+    if (M) {
+      const S = await q(t.url).catch((x) => {
+        console.warn("[renderer] failed to load video via <video>", t.url, x);
       });
-      if (v)
-        return console.info("[renderer] video source: element", e.url), M.set(e.id, v), v.sprite;
+      if (S)
+        return console.info("[renderer] video source: element", t.url), h.set(t.id, S), S.sprite;
     }
   }
-  function B(e) {
-    if (!(e instanceof Error))
+  function X(t) {
+    if (!(t instanceof Error))
       return !1;
-    const s = e.message || "";
-    return s.includes("stream is done") || s.includes("not emit ready") || s.includes("tick video timeout");
+    const u = t.message || "";
+    return u.includes("stream is done") || u.includes("not emit ready") || u.includes("tick video timeout");
   }
-  async function j(e, s) {
-    const n = M.get(e.id);
-    if (n)
+  async function J(t, u) {
+    const a = h.get(t.id);
+    if (a)
       try {
-        const f = e.fromTime ?? 0, y = Math.max(0, s - e.startTime + f), v = Math.floor(y * 1e3);
-        if (n.kind === "frozen") {
-          const T = N(e.url);
-          if (!T)
+        const f = t.fromTime ?? 0, M = Math.max(0, u - t.startTime + f), S = Math.floor(M * 1e3);
+        if (a.kind === "frozen") {
+          const b = _(t.url);
+          if (!b)
             return;
-          const b = await Ft(e.url, T, { sprite: n.sprite, oldTexture: n.texture });
-          return b ? (M.set(e.id, b), await j(e, s)) : void 0;
+          const C = await Le(t.url, b, { sprite: a.sprite, oldTexture: a.texture });
+          return C ? (h.set(t.id, C), await J(t, u)) : void 0;
         }
-        if (n.kind === "mp4clip")
+        if (a.kind === "mp4clip")
           try {
-            const T = await n.clip.tick(v);
-            if (T.video) {
-              const b = n.canvas.getContext("2d");
-              b && (b.drawImage(T.video, 0, 0, n.canvas.width, n.canvas.height), dt(n.texture)), T.video.close();
+            const b = await a.clip.tick(S);
+            if (b.video) {
+              const C = a.canvas.getContext("2d");
+              C && (C.drawImage(b.video, 0, 0, a.canvas.width, a.canvas.height), fe(a.texture)), b.video.close();
             }
-            if (x.value && T.audio && T.audio.length > 0) {
-              const b = n.clip.meta?.audioSampleRate ?? 48e3;
-              E.playMp4AudioFrames(e.id, T.audio, b);
+            if (g.value && b.audio && b.audio.length > 0) {
+              const C = a.clip.meta?.audioSampleRate ?? 48e3;
+              I.playMp4AudioFrames(t.id, b.audio, C);
             }
             return;
-          } catch (T) {
-            const b = N(e.url);
-            if (b && B(T) && (h.add(b), n.clip.destroy(), S !== "mp4clip")) {
-              const I = await D(e.url, { sprite: n.sprite, oldTexture: n.texture }).catch((F) => {
-                console.warn("[renderer] failed to fallback to <video> after MP4Clip error", e.url, F);
+          } catch (b) {
+            const C = _(t.url);
+            if (C && X(b) && (p.add(C), a.clip.destroy(), T !== "mp4clip")) {
+              const P = await q(t.url, { sprite: a.sprite, oldTexture: a.texture }).catch((F) => {
+                console.warn("[renderer] failed to fallback to <video> after MP4Clip error", t.url, F);
               });
-              if (I)
-                return M.set(e.id, I), await j(e, s);
+              if (P)
+                return h.set(t.id, P), await J(t, u);
             }
-            b && !m.has(b) && (m.add(b), console.warn("[renderer] MP4Clip tick failed", e.url, T));
+            C && !w.has(C) && (w.add(C), console.warn("[renderer] MP4Clip tick failed", t.url, b));
             return;
           }
-        const g = y / 1e3;
-        if (!Number.isFinite(g) || n.kind !== "element")
+        const x = M / 1e3;
+        if (!Number.isFinite(x) || a.kind !== "element")
           return;
-        await Ut(n, {
-          targetSec: g,
-          playbackRate: e.playRate ?? 1,
-          volume: e.volume ?? 1
+        await $e(a, {
+          targetSec: x,
+          playbackRate: t.playRate ?? 1,
+          volume: t.volume ?? 1
         });
       } catch (f) {
         console.warn("[renderer] update video frame failed", f);
       }
   }
-  async function Ft(e, s, n) {
-    const f = S !== "element", y = S !== "mp4clip";
-    if (h.has(s)) {
-      if (!y)
-        throw new Error(`[renderer] MP4Clip unsupported for ${e}`);
-      return await D(e, n).catch(() => {
+  async function Le(t, u, a) {
+    const f = T !== "element", M = T !== "mp4clip";
+    if (p.has(u)) {
+      if (!M)
+        throw new Error(`[renderer] MP4Clip unsupported for ${t}`);
+      return await q(t, a).catch(() => {
       });
     }
     if (f) {
-      const v = await at(e, n).catch((g) => {
-        if (B(g) && h.add(s), !y)
-          throw g;
+      const S = await ue(t, a).catch((x) => {
+        if (X(x) && p.add(u), !M)
+          throw x;
       });
-      if (v)
-        return v;
+      if (S)
+        return S;
     }
-    if (y)
-      return await D(e, n).catch(() => {
+    if (M)
+      return await q(t, a).catch(() => {
       });
   }
-  function Pt(e) {
-    return e.segmentType === "frames" && e.type === "video" && typeof e.url == "string" && ct(e.url);
+  function Fe(t) {
+    return t.segmentType === "frames" && t.type === "video" && typeof t.url == "string" && le(t.url);
   }
-  function Ot(e, s) {
-    const n = J(e);
-    if (n <= 0)
+  function Oe(t, u) {
+    const a = te(t);
+    if (a <= 0)
       return 0;
-    if (s < n)
-      return s;
-    const f = Math.max(1e3 / Math.max(e.fps || 30, 1), 1);
-    return Math.max(n - f, 0);
+    if (u < a)
+      return u;
+    const f = Math.max(1e3 / Math.max(t.fps || 30, 1), 1);
+    return Math.max(a - f, 0);
   }
-  async function rt(e) {
-    const s = o.resourceDir ?? ue;
+  async function ae(t) {
+    const u = o.resourceDir ?? dt;
     try {
-      const n = N(e);
-      if (!n)
+      const a = _(t);
+      if (!a)
         return;
-      const f = Wt(`${s}/${n}`, "r");
+      const f = We(`${u}/${a}`, "r");
       if (await f.exists())
         return f;
     } catch {
       return;
     }
   }
-  function it(e) {
-    return !(!e || e.startsWith("data:") || e.startsWith("blob:"));
+  function se(t) {
+    return !(!t || t.startsWith("data:") || t.startsWith("blob:"));
   }
-  function $t() {
-    for (const [e, s] of M) {
-      if (s.kind === "mp4clip") {
-        s.clip.destroy(), M.set(e, {
+  function Ve() {
+    for (const [t, u] of h) {
+      if (u.kind === "mp4clip") {
+        u.clip.destroy(), h.set(t, {
           kind: "frozen",
-          canvas: s.canvas,
-          texture: s.texture,
-          sprite: s.sprite,
-          meta: s.meta
+          canvas: u.canvas,
+          texture: u.texture,
+          sprite: u.sprite,
+          meta: u.meta
         });
         continue;
       }
-      s.kind === "element" && s.video.pause();
+      u.kind === "element" && u.video.pause();
     }
   }
-  function nt(e) {
-    if (e.kind === "mp4clip") {
-      e.clip.destroy();
+  function ce(t) {
+    if (t.kind === "mp4clip") {
+      t.clip.destroy();
       return;
     }
-    if (e.kind === "frozen")
+    if (t.kind === "frozen")
       return;
-    e.video.pause();
-    const s = k.get(e.video);
-    s && (URL.revokeObjectURL(s), k.delete(e.video)), e.video.removeAttribute("src"), e.video.load();
-  }
-  function _(e, s, n = 1e3) {
-    return new Promise((f, y) => {
-      const v = window.setTimeout(() => {
-        b(), y(new Error(`Timed out waiting for media event: ${s}`));
-      }, n), g = () => {
-        b(), f();
-      }, T = () => {
-        b();
-        const I = e.error ? `${e.error.code}` : "unknown";
-        y(new Error(`Media error (${I}) while waiting for ${s}`));
+    t.video.pause();
+    const u = v.get(t.video);
+    u && (URL.revokeObjectURL(u), v.delete(t.video)), t.video.removeAttribute("src"), t.video.load();
+  }
+  function H(t, u, a = 1e3) {
+    return new Promise((f, M) => {
+      const S = window.setTimeout(() => {
+        C(), M(new Error(`Timed out waiting for media event: ${u}`));
+      }, a), x = () => {
+        C(), f();
       }, b = () => {
-        window.clearTimeout(v), e.removeEventListener(s, g), e.removeEventListener("error", T);
+        C();
+        const P = t.error ? `${t.error.code}` : "unknown";
+        M(new Error(`Media error (${P}) while waiting for ${u}`));
+      }, C = () => {
+        window.clearTimeout(S), t.removeEventListener(u, x), t.removeEventListener("error", b);
       };
-      e.addEventListener(s, g, { once: !0 }), e.addEventListener("error", T, { once: !0 });
+      t.addEventListener(u, x, { once: !0 }), t.addEventListener("error", b, { once: !0 });
     });
   }
-  async function at(e, s) {
-    let n;
-    it(e) && (n = await rt(e), n || (await c.add(e).catch(() => {
-    }), n = await rt(e)));
+  async function ue(t, u) {
+    let a;
+    se(t) && (a = await ae(t), a || (await c.add(t).catch(() => {
+    }), a = await ae(t)));
     let f;
     try {
-      if (n)
-        f = new G(n);
+      if (a)
+        f = new B(a);
       else {
-        const I = await fetch(e);
-        if (I.body)
-          f = new G(I.body);
+        const P = await fetch(t);
+        if (P.body)
+          f = new B(P.body);
         else {
-          const F = await I.arrayBuffer(), U = new ReadableStream({
-            start(P) {
-              P.enqueue(new Uint8Array(F)), P.close();
+          const F = await P.arrayBuffer(), N = new ReadableStream({
+            start(V) {
+              V.enqueue(new Uint8Array(F)), V.close();
             }
           });
-          f = new G(U);
+          f = new B(N);
         }
       }
       await f.ready;
-      const { width: y, height: v } = f.meta, g = document.createElement("canvas");
-      g.width = y || 1, g.height = v || 1;
-      const T = V.from(g), b = s?.sprite ?? new O(T);
-      return s?.sprite && (s.sprite.texture = T, s.oldTexture?.destroy(!0)), { kind: "mp4clip", clip: f, canvas: g, texture: T, sprite: b, meta: { width: y, height: v } };
-    } catch (y) {
-      throw f?.destroy(), y;
+      const { width: M, height: S } = f.meta, x = document.createElement("canvas");
+      x.width = M || 1, x.height = S || 1;
+      const b = G.from(x), C = u?.sprite ?? new $(b);
+      return u?.sprite && (u.sprite.texture = b, u.oldTexture?.destroy(!0)), { kind: "mp4clip", clip: f, canvas: x, texture: b, sprite: C, meta: { width: M, height: S } };
+    } catch (M) {
+      throw f?.destroy(), M;
     }
   }
-  function st(e) {
-    const n = e.split("#")[0].split("?")[0].split("/").pop()?.split(".").pop()?.toLowerCase() ?? "";
-    return ["mp4", "m4v", "mov", "webm"].includes(n) ? "video" : ["png", "jpg", "jpeg", "gif", "webp", "bmp", "svg", "avif"].includes(n) ? "image" : ["mp3", "wav", "aac", "m4a", "ogg", "flac"].includes(n) ? "audio" : "unknown";
+  function de(t) {
+    const a = t.split("#")[0].split("?")[0].split("/").pop()?.split(".").pop()?.toLowerCase() ?? "";
+    return ["mp4", "m4v", "mov", "webm"].includes(a) ? "video" : ["png", "jpg", "jpeg", "gif", "webp", "bmp", "svg", "avif"].includes(a) ? "image" : ["mp3", "wav", "aac", "m4a", "ogg", "flac"].includes(a) ? "audio" : "unknown";
   }
-  function ct(e) {
-    const s = st(e);
-    return !(s === "image" || s === "audio");
+  function le(t) {
+    const u = de(t);
+    return !(u === "image" || u === "audio");
   }
-  async function D(e, s) {
-    const n = document.createElement("video");
-    n.crossOrigin = "anonymous", n.muted = !1, n.playsInline = !0, n.preload = "metadata", n.src = e, n.load();
+  async function q(t, u) {
+    const a = document.createElement("video");
+    a.crossOrigin = "anonymous", a.muted = !1, a.playsInline = !0, a.preload = "metadata", a.src = t, a.load();
     try {
-      await _(n, "loadedmetadata", 15e3);
-    } catch (b) {
-      n.pause();
-      const I = k.get(n);
-      throw I && (URL.revokeObjectURL(I), k.delete(n)), n.removeAttribute("src"), n.load(), b;
+      await H(a, "loadedmetadata", 15e3);
+    } catch (C) {
+      a.pause();
+      const P = v.get(a);
+      throw P && (URL.revokeObjectURL(P), v.delete(a)), a.removeAttribute("src"), a.load(), C;
     }
-    const f = n.videoWidth || 1, y = n.videoHeight || 1, v = document.createElement("canvas");
-    v.width = f, v.height = y;
-    const g = V.from(v), T = s?.sprite ?? new O(g);
-    return s?.sprite && (s.sprite.texture = g, s.oldTexture?.destroy(!0)), { kind: "element", video: n, canvas: v, texture: g, sprite: T, meta: { width: f, height: y } };
-  }
-  async function Ut(e, s) {
-    const { video: n, canvas: f, texture: y } = e;
-    n.playbackRate = Number.isFinite(s.playbackRate) && s.playbackRate > 0 ? s.playbackRate : 1, n.volume = Math.max(0, Math.min(1, s.volume ?? 1)), x.value ? n.play().catch(() => {
-    }) : n.pause();
-    const v = Number.isFinite(n.duration) && n.duration > 0 ? n.duration : null, g = v ? Math.min(s.targetSec, Math.max(v - 0.03, 0)) : s.targetSec, T = n.currentTime, b = Math.abs(T - g), I = x.value ? 0.25 : 0.03;
-    if (Number.isFinite(T) && b > I) {
+    const f = a.videoWidth || 1, M = a.videoHeight || 1, S = document.createElement("canvas");
+    S.width = f, S.height = M;
+    const x = G.from(S), b = u?.sprite ?? new $(x);
+    return u?.sprite && (u.sprite.texture = x, u.oldTexture?.destroy(!0)), { kind: "element", video: a, canvas: S, texture: x, sprite: b, meta: { width: f, height: M } };
+  }
+  async function $e(t, u) {
+    const { video: a, canvas: f, texture: M } = t;
+    a.playbackRate = Number.isFinite(u.playbackRate) && u.playbackRate > 0 ? u.playbackRate : 1, a.volume = Math.max(0, Math.min(1, u.volume ?? 1)), g.value ? a.play().catch(() => {
+    }) : a.pause();
+    const S = Number.isFinite(a.duration) && a.duration > 0 ? a.duration : null, x = S ? Math.min(u.targetSec, Math.max(S - 0.03, 0)) : u.targetSec, b = a.currentTime, C = Math.abs(b - x), P = g.value ? 0.25 : 0.03;
+    if (Number.isFinite(b) && C > P) {
       try {
-        n.currentTime = g;
+        a.currentTime = x;
       } catch {
       }
-      await _(n, "seeked", 250).catch(() => {
+      await H(a, "seeked", 250).catch(() => {
       });
     }
-    if (n.readyState < 2 && (await _(n, "canplay", 250).catch(() => {
-    }), n.readyState < 2))
+    if (a.readyState < 2 && (await H(a, "canplay", 250).catch(() => {
+    }), a.readyState < 2))
       return;
     const F = f.getContext("2d");
-    F && (F.drawImage(n, 0, 0, f.width, f.height), dt(y));
-  }
-  function Vt(e) {
-    return new Promise((s) => {
-      const n = new Image();
-      n.crossOrigin = "anonymous", n.onload = () => s(V.from(n)), n.onerror = () => {
-        console.warn("[renderer] failed to load image", e), s(void 0);
-      }, n.src = e;
+    F && (F.drawImage(a, 0, 0, f.width, f.height), fe(M));
+  }
+  function Ue(t) {
+    return new Promise((u) => {
+      const a = new Image();
+      a.crossOrigin = "anonymous", a.onload = () => u(G.from(a)), a.onerror = () => {
+        console.warn("[renderer] failed to load image", t), u(void 0);
+      }, a.src = t;
     });
   }
-  function dt(e) {
-    const s = e.source;
-    if ("update" in s && typeof s.update == "function") {
-      s.update();
+  function fe(t) {
+    const u = t.source;
+    if ("update" in u && typeof u.update == "function") {
+      u.update();
       return;
     }
-    typeof e.update == "function" && e.update();
+    typeof t.update == "function" && t.update();
   }
-  function Dt() {
-    q(), C += 1, Q.stop(), Z(), u.destroy({ children: !0 }), l.clear(), p.clear(), d.clear(), o.app || a.destroy(), E.destroy();
+  function ze() {
+    Y(), k += 1, D.stop(), j(), d.destroy({ children: !0 }), l.clear(), m.clear(), s.clear(), o.app || n.destroy(), I.destroy();
   }
-  return o.autoPlay && tt(), {
-    app: a,
-    layer: u,
-    currentTime: w,
+  return o.autoPlay && ie(), {
+    app: n,
+    layer: d,
+    currentTime: y,
     duration: R,
-    isPlaying: x,
-    play: tt,
-    pause: q,
-    tick: ot,
-    seek: kt,
-    renderAt: Ct,
-    destroy: Dt
+    isPlaying: g,
+    play: ie,
+    pause: Y,
+    tick: ne,
+    seek: ke,
+    renderAt: Ce,
+    destroy: ze
   };
 }
-function fe(o) {
-  let t = !1, i = !1, r = null, a = null;
+function ft(o) {
+  let e = !1, r = !1, i = null, n = null;
   return async () => {
-    r || (r = new Promise((d) => {
-      a = d;
+    i || (i = new Promise((s) => {
+      n = s;
     }));
-    const c = r;
-    if (i)
-      return t = !0, c;
-    i = !0;
+    const c = i;
+    if (r)
+      return e = !0, c;
+    r = !0;
     do
-      t = !1, await o();
-    while (t);
-    return i = !1, a?.(), r = null, a = null, c;
+      e = !1, await o();
+    while (e);
+    return r = !1, n?.(), i = null, n = null, c;
   };
 }
-function pe(o) {
+function pt(o) {
   return typeof o == "object" && o !== null && "createReader" in o && "getSize" in o;
 }
-function he(o) {
+function ht(o) {
   return typeof ReadableStream < "u" && o instanceof ReadableStream;
 }
-function me(o) {
-  return typeof o == "string" || o instanceof Blob || pe(o) || he(o) ? { source: o } : o;
+function mt(o) {
+  return typeof o == "string" || o instanceof Blob || pt(o) || ht(o) ? { source: o } : o;
 }
-async function ht(o) {
+async function we(o) {
   if (typeof o == "string") {
-    const t = await fetch(o);
-    if (!t.body)
+    const e = await fetch(o);
+    if (!e.body)
       throw new Error("concatVideos: unable to read video stream from url");
-    return t.body;
+    return e.body;
   }
   return o instanceof Blob ? o.stream() : o;
 }
-function we(o, t) {
-  let i = !1;
-  const r = () => {
-    i || (i = !0, t());
-  }, a = o.getReader();
+function yt(o, e) {
+  let r = !1;
+  const i = () => {
+    r || (r = !0, e());
+  }, n = o.getReader();
   return new ReadableStream({
-    async pull(u) {
-      const { done: c, value: d } = await a.read();
+    async pull(d) {
+      const { done: c, value: s } = await n.read();
       if (c) {
-        r(), u.close();
+        i(), d.close();
         return;
       }
-      u.enqueue(d);
+      d.enqueue(s);
     },
-    async cancel(u) {
+    async cancel(d) {
       try {
-        await a.cancel(u);
+        await n.cancel(d);
       } finally {
-        r();
+        i();
       }
     }
   });
 }
-async function Te(o, t = {}) {
+async function Tt(o, e = {}) {
   if (o.length === 0)
     throw new Error("concatVideos: expected at least one source");
   const {
-    onProgress: i,
-    width: r,
-    height: a,
-    ...u
-  } = t, c = o.map(me), [d, ...l] = c, p = await ht(d.source), h = new G(p);
-  await h.ready;
-  const m = r ?? Math.round(h.meta.width || 0), S = a ?? Math.round(h.meta.height || 0);
-  if (!m || !S)
-    throw h.destroy(), new Error("concatVideos: output width/height is required");
-  const M = new mt({
-    ...u,
-    width: m,
-    height: S
+    onProgress: r,
+    width: i,
+    height: n,
+    ...d
+  } = e, c = o.map(mt), [s, ...l] = c, m = await we(s.source), p = new B(m);
+  await p.ready;
+  const w = i ?? Math.round(p.meta.width || 0), T = n ?? Math.round(p.meta.height || 0);
+  if (!w || !T)
+    throw p.destroy(), new Error("concatVideos: output width/height is required");
+  const h = new ve({
+    ...d,
+    width: w,
+    height: T
   });
-  i && M.on("OutputProgress", i);
-  let k = 0;
-  const w = async (A) => {
-    const L = A.meta.duration;
-    if (!Number.isFinite(L) || L <= 0)
-      throw A.destroy(), new Error("concatVideos: invalid clip duration");
-    const C = new wt(A);
+  r && h.on("OutputProgress", r);
+  let v = 0;
+  const y = async (E) => {
+    const A = E.meta.duration;
+    if (!Number.isFinite(A) || A <= 0)
+      throw E.destroy(), new Error("concatVideos: invalid clip duration");
+    const k = new Me(E);
     try {
-      await C.ready, C.rect.x = 0, C.rect.y = 0, C.rect.w = m, C.rect.h = S, C.time.offset = k, C.time.duration = L, await M.addSprite(C), k += L;
+      await k.ready, k.rect.x = 0, k.rect.y = 0, k.rect.w = w, k.rect.h = T, k.time.offset = v, k.time.duration = A, await h.addSprite(k), v += A;
     } finally {
-      C.destroy();
+      k.destroy();
     }
   };
   try {
-    await w(h);
-    for (const A of l) {
-      const L = await ht(A.source), C = new G(L);
-      await C.ready, await w(C);
+    await y(p);
+    for (const E of l) {
+      const A = await we(E.source), k = new B(A);
+      await k.ready, await y(k);
     }
-  } catch (A) {
-    throw M.destroy(), A;
+  } catch (E) {
+    throw h.destroy(), E;
   }
-  const x = k, R = M.output({ maxTime: x }), E = () => {
-    M.destroy();
+  const g = v, R = h.output({ maxTime: g }), I = () => {
+    h.destroy();
   };
   return {
-    stream: we(R, E),
-    width: m,
-    height: S,
-    durationMs: Math.round(x / 1e3),
-    destroy: E
+    stream: yt(R, I),
+    width: w,
+    height: T,
+    durationMs: Math.round(g / 1e3),
+    destroy: I
   };
 }
-class H {
+class oe {
   ready;
   meta;
   protocol;
@@ -1022,149 +1101,149 @@ class H {
   renderer;
   app;
   destroyed = !1;
-  constructor(t, i = {}) {
-    this.protocol = t, this.options = i;
-    const r = i.width ?? t.width, a = i.height ?? t.height, u = J(t);
+  constructor(e, r = {}) {
+    this.protocol = e, this.options = r;
+    const i = r.width ?? e.width, n = r.height ?? e.height, d = te(e);
     this.meta = {
-      width: r,
-      height: a,
-      duration: Math.max(0, Math.round(u * 1e3))
+      width: i,
+      height: n,
+      duration: Math.max(0, Math.round(d * 1e3))
     }, this.ready = this.init();
   }
   async init() {
-    const t = this.options.width ?? this.protocol.width, i = this.options.height ?? this.protocol.height;
-    if (!t || !i)
+    const e = this.options.width ?? this.protocol.width, r = this.options.height ?? this.protocol.height;
+    if (!e || !r)
       throw new Error("ProtocolVideoClip: output width/height is required");
-    const r = new yt();
-    await r.init({
-      width: t,
-      height: i,
+    const i = new Se();
+    await i.init({
+      width: e,
+      height: r,
       backgroundAlpha: 0,
       ...this.options.appOptions
-    }), r.ticker.stop(), this.app = r;
-    const a = this.options.rendererOptions ?? {}, u = await le({
+    }), i.ticker.stop(), this.app = i;
+    const n = this.options.rendererOptions ?? {}, d = await lt({
       protocol: this.protocol,
-      app: r,
-      ...a,
+      app: i,
+      ...n,
       autoPlay: !1,
       freezeOnPause: !1,
       manualRender: !0,
-      videoSourceMode: a.videoSourceMode ?? "mp4clip"
+      videoSourceMode: n.videoSourceMode ?? "mp4clip"
     });
-    this.renderer = u;
-    const c = u.duration.value;
+    this.renderer = d;
+    const c = d.duration.value;
     return this.meta = {
-      width: r.renderer.width,
-      height: r.renderer.height,
+      width: i.renderer.width,
+      height: i.renderer.height,
       duration: Math.max(0, Math.round(c * 1e3))
     }, this.meta;
   }
-  async tick(t) {
-    const i = [];
+  async tick(e) {
+    const r = [];
     if (this.destroyed)
-      return { audio: i, state: "done" };
+      return { audio: r, state: "done" };
     if (await this.ready, !this.renderer)
-      return { audio: i, state: "done" };
-    const r = this.meta.duration;
-    if (t >= r)
-      return { audio: i, state: "done" };
-    const a = Math.max(0, Math.min(t, r));
-    return await this.renderer.renderAt(a / 1e3), {
+      return { audio: r, state: "done" };
+    const i = this.meta.duration;
+    if (e >= i)
+      return { audio: r, state: "done" };
+    const n = Math.max(0, Math.min(e, i));
+    return await this.renderer.renderAt(n / 1e3), {
       video: new VideoFrame(this.renderer.app.canvas, {
-        timestamp: t
+        timestamp: e
       }),
-      audio: i,
+      audio: r,
       state: "success"
     };
   }
   async clone() {
-    const t = new H(this.protocol, this.options);
-    return await t.ready, t;
+    const e = new oe(this.protocol, this.options);
+    return await e.ready, e;
   }
   destroy() {
     this.destroyed || (this.destroyed = !0, this.renderer?.destroy(), this.app?.destroy(!0));
   }
 }
-function ye(o, t) {
-  let i = !1;
-  const r = () => {
-    i || (i = !0, t());
-  }, a = o.getReader();
+function wt(o, e) {
+  let r = !1;
+  const i = () => {
+    r || (r = !0, e());
+  }, n = o.getReader();
   return new ReadableStream({
-    async pull(u) {
-      const { done: c, value: d } = await a.read();
+    async pull(d) {
+      const { done: c, value: s } = await n.read();
       if (c) {
-        r(), u.close();
+        i(), d.close();
         return;
       }
-      u.enqueue(d);
+      d.enqueue(s);
     },
-    async cancel(u) {
+    async cancel(d) {
       try {
-        await a.cancel(u);
+        await n.cancel(d);
       } finally {
-        r();
+        i();
       }
     }
   });
 }
-async function be(o, t = {}) {
+async function bt(o, e = {}) {
   const {
-    width: i,
-    height: r,
-    fps: a,
-    onProgress: u,
+    width: r,
+    height: i,
+    fps: n,
+    onProgress: d,
     clipOptions: c,
-    audioSprites: d,
+    audioSprites: s,
     ...l
-  } = t, p = i ?? o.width, h = r ?? o.height;
-  if (!p || !h)
+  } = e, m = r ?? o.width, p = i ?? o.height;
+  if (!m || !p)
     throw new Error("composeProtocol: output width/height is required");
-  const m = a ?? o.fps, S = typeof d == "function", M = l.audio ?? (S ? void 0 : !1), k = new mt({
+  const w = n ?? o.fps, T = typeof s == "function", h = l.audio ?? (T ? void 0 : !1), v = new ve({
     ...l,
-    audio: M,
-    width: p,
-    height: h,
-    fps: m
+    audio: h,
+    width: m,
+    height: p,
+    fps: w
   });
-  u && k.on("OutputProgress", u);
-  let w, x;
+  d && v.on("OutputProgress", d);
+  let y, g;
   try {
-    if (w = new H(o, {
-      width: p,
-      height: h,
-      fps: m,
+    if (y = new oe(o, {
+      width: m,
+      height: p,
+      fps: w,
       ...c,
       rendererOptions: {
         warmUpResources: !1,
         ...c?.rendererOptions
       }
-    }), await w.ready, x = new wt(w), await x.ready, x.time.offset = 0, x.time.duration = w.meta.duration, x.rect.x = 0, x.rect.y = 0, x.rect.w = w.meta.width, x.rect.h = w.meta.height, await k.addSprite(x, { main: !0 }), d) {
-      const L = await d(o);
-      for (const C of L)
-        await k.addSprite(C);
+    }), await y.ready, g = new Me(y), await g.ready, g.time.offset = 0, g.time.duration = y.meta.duration, g.rect.x = 0, g.rect.y = 0, g.rect.w = y.meta.width, g.rect.h = y.meta.height, await v.addSprite(g, { main: !0 }), s) {
+      const A = await s(o);
+      for (const k of A)
+        await v.addSprite(k);
     }
-  } catch (L) {
-    throw k.destroy(), L;
+  } catch (A) {
+    throw v.destroy(), A;
   }
-  const R = w?.meta.duration ?? 0;
+  const R = y?.meta.duration ?? 0;
   if (!R)
     throw new Error("composeProtocol: protocol has no duration");
-  const E = k.output({ maxTime: R }), A = () => {
-    x?.destroy(), w?.destroy(), k.destroy();
+  const I = v.output({ maxTime: R }), E = () => {
+    g?.destroy(), y?.destroy(), v.destroy();
   };
   return {
-    stream: ye(E, A),
-    width: p,
-    height: h,
+    stream: wt(I, E),
+    width: m,
+    height: p,
     durationMs: Math.round(R / 1e3),
-    destroy: A
+    destroy: E
   };
 }
 export {
-  H as ProtocolVideoClip,
-  be as composeProtocol,
-  Te as concatVideos,
-  le as createRenderer
+  oe as ProtocolVideoClip,
+  bt as composeProtocol,
+  Tt as concatVideos,
+  lt as createRenderer
 };
 //# sourceMappingURL=index.js.map