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

package/dist/index.js

@@ -1,100 +1,100 @@
-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;
+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();
+  return await t.init({ resizeTo: window, backgroundAlpha: 0, ...e }), t;
 }
-function Je(o, e, r, i, n) {
-  const d = e || i, c = r || n;
-  if (!d || !c)
+function ie(e, t, o, i, n) {
+  const a = t || i, c = o || n;
+  if (!a || !c)
     return { width: i, height: n };
-  const s = d / c, l = i / n;
-  switch (o) {
+  const u = a / c, d = i / n;
+  switch (e) {
     case "none":
-      return { width: d, height: c };
+      return { width: a, height: c };
     case "cover":
-      return s > l ? { width: n * s, height: n } : { width: i, height: i / s };
+      return u > d ? { width: n * u, height: n } : { width: i, height: i / u };
     case "stretch":
       return { width: i, height: n };
     default:
-      return s > l ? { width: i, height: i / s } : { width: n * s, height: n };
+      return u > d ? { width: i, height: i / u } : { width: n * u, height: n };
   }
 }
-function He(o, e, r, i, n) {
-  const d = "fillMode" in o ? o.fillMode : void 0, { width: c, height: s } = Je(
-    d,
+function re(e, t, o, i, n) {
+  const a = "fillMode" in e ? e.fillMode : void 0, { width: c, height: u } = ie(
+    a,
     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;
+    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: y,
+    height: m,
     centerX: g,
     centerY: R,
-    rotationRad: h / 180 * Math.PI
+    rotationRad: p / 180 * Math.PI
   };
 }
-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 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 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 });
+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 });
     });
-  }), 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;
+  }), 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 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 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 Z(o, e) {
-  const r = new ge();
-  return r.rect(0, 0, 10, 10).fill({ color: Te(e ?? o), alpha: 1 }), r;
+function tt(e, t) {
+  const o = new Ct();
+  return o.rect(0, 0, 10, 10).fill({ color: At(t ?? e), alpha: 1 }), o;
 }
-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>`;
+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 Te(o) {
-  let e = 0;
-  for (let r = 0; r < o.length; r++)
-    e = o.charCodeAt(r) + ((e << 5) - e);
-  return e & 16777215;
+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 te(o) {
-  const e = o.tracks.flatMap((r) => r.children.map((i) => i.endTime));
-  return e.length ? Math.max(...e) : 0;
+function it(e) {
+  const t = e.tracks.flatMap((o) => o.children.map((i) => i.endTime));
+  return t.length ? Math.max(...t) : 0;
 }
-function ee(o, e, r) {
-  return Math.min(Math.max(o, e), r);
+function et(e, t, o) {
+  return Math.min(Math.max(e, t), o);
 }
-function ye(o) {
-  const e = Ge(o);
-  return JSON.parse(JSON.stringify(e));
+function St(e) {
+  const t = Xt(e);
+  return JSON.parse(JSON.stringify(t));
 }
-function be(o) {
-  return "opacity" in o;
+function Et(e) {
+  return "opacity" in e;
 }
-function tt(o) {
-  return be(o) && typeof o.opacity == "number" ? o.opacity : 1;
+function ce(e) {
+  return Et(e) && typeof e.opacity == "number" ? e.opacity : 1;
 }
-class ot {
+class ue {
   protocol;
   clips = /* @__PURE__ */ new Map();
   loadingClips = /* @__PURE__ */ new Map();
@@ -108,91 +108,91 @@ class ot {
   useMediaElementForAudio = !0;
   ctx;
   lastTime = 0;
-  constructor(e) {
-    this.protocol = e, this.ctx = new (window.AudioContext || window.webkitAudioContext)();
+  constructor(t) {
+    this.protocol = t, this.ctx = new (window.AudioContext || window.webkitAudioContext)();
   }
-  setProtocol(e) {
-    this.protocol = e;
+  setProtocol(t) {
+    this.protocol = t;
   }
-  async sync(e, r) {
-    if (!r) {
-      this.stopAll(), this.lastTime = e;
+  async sync(t, o) {
+    if (!o) {
+      this.stopAll(), this.lastTime = t;
       return;
     }
     this.ctx.state === "suspended" && await this.ctx.resume().catch(() => {
-    }), 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();
+    }), 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 s = this.audioKey(c.id);
-        n.add(s), this.useMediaElementForAudio ? this.syncAudioElement(c, e) : this.ensureAudioLoop(c, e);
+        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 s = this.videoKey(c.id);
-        d.add(s);
+        const u = this.videoKey(c.id);
+        a.add(u);
       }
-    for (const [c, s] of this.audioLoops)
+    for (const [c, u] of this.audioLoops)
       if (!n.has(c)) {
-        s.stop();
-        for (const l of s.sources)
+        u.stop();
+        for (const d of u.sources)
           try {
-            l.stop(), l.disconnect();
+            d.stop(), d.disconnect();
           } catch {
           }
         this.audioLoops.delete(c), this.audioLoopContexts.delete(c), this.audioGains.delete(c);
       }
-    for (const [c, s] of this.audioElements)
+    for (const [c, u] 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;
+          u.el.pause(), u.pendingPlay = void 0, u.lastTimelineMs = void 0, u.lastSourceSec = void 0, u.lastSeekTimelineMs = void 0;
         } catch {
         }
-        this.findSegmentInProtocol(s.segmentId) || (this.destroyAudioElement(s.el), this.audioElements.delete(c));
+        this.findSegmentInProtocol(u.segmentId) || (this.destroyAudioElement(u.el), this.audioElements.delete(c));
       }
-    for (const [c, s] of this.mp4Loops)
-      if (!d.has(c)) {
-        s.stop();
-        for (const l of s.sources)
+    for (const [c, u] of this.mp4Loops)
+      if (!a.has(c)) {
+        u.stop();
+        for (const d of u.sources)
           try {
-            l.stop(), l.disconnect();
+            d.stop(), d.disconnect();
           } catch {
           }
         this.mp4Loops.delete(c), this.mp4States.delete(c), this.mp4Gains.delete(c);
       }
     for (const c of this.mp4States.keys())
-      !d.has(c) && !this.mp4Loops.has(c) && (this.mp4States.delete(c), this.mp4Gains.delete(c));
+      !a.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(e, r, i) {
-    if (!r || r.length === 0 || !r[0]?.length)
+  playMp4AudioFrames(t, o, i) {
+    if (!o || o.length === 0 || !o[0]?.length)
       return;
-    const n = this.videoKey(e), d = this.getSegmentVolume(e), c = this.getOrCreateGain(this.mp4Gains, n, d);
+    const n = this.videoKey(t), a = this.getSegmentVolume(t), c = this.getOrCreateGain(this.mp4Gains, n, a);
     this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
     });
-    let s = this.mp4States.get(n);
-    s || (s = {
+    let u = this.mp4States.get(n);
+    u || (u = {
       loop: { stop: () => {
       }, sources: [], isStopped: () => !1 },
       startUs: 0,
       startCtxTime: this.ctx.currentTime,
       fps: 30,
       nextStartAt: 0
-    }, this.mp4States.set(n, s)), s.nextStartAt = this.playFrames(r, i, s.nextStartAt ?? 0, c, s.loop.sources);
+    }, this.mp4States.set(n, u)), u.nextStartAt = this.playFrames(o, i, u.nextStartAt ?? 0, c, u.loop.sources);
   }
   /**
    * Reset MP4 audio playback state (call when seeking or pausing)
    */
-  resetMp4Audio(e) {
-    const r = this.videoKey(e), i = this.mp4States.get(r);
+  resetMp4Audio(t) {
+    const o = this.videoKey(t), i = this.mp4States.get(o);
     i && (i.nextStartAt = 0);
   }
   /**
    * Stop and clean up MP4 audio for a video segment
    */
-  stopMp4Audio(e) {
-    const r = this.videoKey(e), i = this.mp4States.get(r);
+  stopMp4Audio(t) {
+    const o = this.videoKey(t), i = this.mp4States.get(o);
     if (i) {
       i.loop.stop();
       for (const n of i.loop.sources)
@@ -200,32 +200,32 @@ class ot {
           n.stop(), n.disconnect();
         } catch {
         }
-      this.mp4Loops.delete(r), this.mp4States.delete(r), this.mp4Gains.delete(r);
+      this.mp4Loops.delete(o), this.mp4States.delete(o), this.mp4Gains.delete(o);
     }
   }
   /**
    * @deprecated Use playMp4AudioFrames instead
    */
-  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) {
-      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)
+  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;
-      l.loop.stop();
-      for (const T of l.loop.sources)
+      d.loop.stop();
+      for (const M of d.loop.sources)
         try {
-          T.stop(), T.disconnect();
+          M.stop(), M.disconnect();
         } catch {
         }
-      this.mp4Loops.delete(d), this.mp4States.delete(d);
+      this.mp4Loops.delete(a), this.mp4States.delete(a);
     }
     this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
     });
-    const m = this.startMp4Loop(r, i, n, s);
-    this.mp4Loops.set(d, m), this.mp4States.set(d, {
-      loop: m,
+    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
@@ -233,87 +233,87 @@ class ot {
   }
   destroy() {
     this.stopAll();
-    for (const e of this.clips.values())
-      e.clip.destroy();
+    for (const t of this.clips.values())
+      t.clip.destroy();
     this.clips.clear();
-    for (const e of this.audioElements.values())
-      this.destroyAudioElement(e.el);
+    for (const t of this.audioElements.values())
+      this.destroyAudioElement(t.el);
     this.audioElements.clear();
   }
   stopAll() {
-    for (const e of this.audioElements.values())
+    for (const t of this.audioElements.values())
       try {
-        e.el.pause(), e.pendingPlay = void 0, e.lastTimelineMs = void 0, e.lastSourceSec = void 0, e.lastSeekTimelineMs = void 0;
+        t.el.pause(), t.pendingPlay = void 0, t.lastTimelineMs = void 0, t.lastSourceSec = void 0, t.lastSeekTimelineMs = void 0;
       } catch {
       }
-    for (const e of this.audioLoops.values()) {
-      e.stop();
-      for (const r of e.sources)
+    for (const t of this.audioLoops.values()) {
+      t.stop();
+      for (const o of t.sources)
         try {
-          r.stop(0), r.disconnect();
+          o.stop(0), o.disconnect();
         } catch {
         }
-      e.sources.length = 0;
+      t.sources.length = 0;
     }
-    for (const e of this.mp4Loops.values()) {
-      e.stop();
-      for (const r of e.sources)
+    for (const t of this.mp4Loops.values()) {
+      t.stop();
+      for (const o of t.sources)
         try {
-          r.stop(0), r.disconnect();
+          o.stop(0), o.disconnect();
         } catch {
         }
-      e.sources.length = 0;
+      t.sources.length = 0;
     }
-    for (const e of this.audioGains.values())
+    for (const t of this.audioGains.values())
       try {
-        e.disconnect();
+        t.disconnect();
       } catch {
       }
-    for (const e of this.mp4Gains.values())
+    for (const t of this.mp4Gains.values())
       try {
-        e.disconnect();
+        t.disconnect();
       } catch {
       }
     this.audioLoops.clear(), this.audioLoopContexts.clear(), this.audioGains.clear(), this.mp4Loops.clear(), this.mp4States.clear(), this.mp4Gains.clear();
   }
-  async ensureAudioLoop(e, r) {
-    const i = this.audioKey(e.id), n = await this.loadClip(e);
+  async ensureAudioLoop(t, o) {
+    const i = this.audioKey(t.id), n = await this.loadClip(t);
     if (!n)
       return;
-    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())
+    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;
-    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);
+    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: e,
+      segment: t,
       startedAt: this.ctx.currentTime,
-      segmentRelativeMs: s
+      segmentRelativeMs: 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;
+  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(e, d);
+    const R = this.computeSegmentVolume(t, a);
     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;
+    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 (K === void 0)
+    if (q === void 0)
       O = !0;
-    else if (D < k || D > A)
+    else if (z < b || z > E)
       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);
+    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 - y) > 0.06)
+    if (O && Math.abs(n.el.currentTime - m) > 0.06)
       try {
-        n.el.currentTime = y, n.lastSeekTimelineMs = r;
+        n.el.currentTime = m, n.lastSeekTimelineMs = o;
       } catch {
       }
-    if (n.lastTimelineMs = r, n.lastSourceSec = y, g) {
+    if (n.lastTimelineMs = o, n.lastSourceSec = m, g) {
       if (!n.el.paused)
         try {
           n.el.pause();
@@ -323,59 +323,59 @@ class ot {
       return;
     }
     if (n.el.paused && !n.pendingPlay) {
-      const L = n.el.play();
-      L && typeof L.then == "function" && (n.pendingPlay = L.catch(() => {
+      const F = n.el.play();
+      F && typeof F.then == "function" && (n.pendingPlay = F.catch(() => {
       }).finally(() => {
         n.pendingPlay = void 0;
       }));
     }
   }
-  applyFadeToGain(e, r, i) {
-    i.gain.value = this.computeSegmentVolume(e, r);
+  applyFadeToGain(t, o, i) {
+    i.gain.value = this.computeSegmentVolume(t, o);
   }
-  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)
+  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: h, state: v } = await e.tick(Math.round(c));
-      if (c += m, v === "done")
+      const { audio: p, state: v } = await t.tick(Math.round(c));
+      if (c += y, v === "done")
         return;
-      if (l) {
-        l = !1;
+      if (d) {
+        d = !1;
         return;
       }
-      (h?.[0]?.length ?? 0) !== 0 && (s = this.playFrames(h, p, s, n, w));
+      (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: () => {
-        d = !0, window.clearInterval(T);
+        a = !0, window.clearInterval(M);
       },
-      isStopped: () => d
+      isStopped: () => a
     };
   }
-  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 () => {
+  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 (m || (r > 0 && await e.tick(r), m = !0), s += h, d !== void 0 && s > d) {
+      if (y || (o > 0 && await t.tick(o), y = !0), u += p, a !== void 0 && u > a) {
         c = !0;
         return;
       }
-      const { audio: y, state: g } = await e.tick(s);
+      const { audio: m, state: g } = await t.tick(u);
       if (c)
         return;
       if (g === "done") {
         c = !0;
         return;
       }
-      if ((y?.[0]?.length ?? 0) === 0) {
+      if ((m?.[0]?.length ?? 0) === 0) {
         c = !0;
         return;
       }
-      l = this.playFrames(y, p, l, i, w, n), c || setTimeout(() => v(), 0);
+      d = this.playFrames(m, h, d, i, w, n), c || setTimeout(() => v(), 0);
     };
     return v(), {
       sources: w,
@@ -386,714 +386,714 @@ class ot {
       isStopped: () => c && w.length === 0
     };
   }
-  playFrames(e, r, i, n, d, c = 1) {
-    const s = Math.max(e.length, 1), l = e[0]?.length ?? 0;
-    if (l === 0)
+  playFrames(t, o, i, n, a, c = 1) {
+    const u = Math.max(t.length, 1), d = t[0]?.length ?? 0;
+    if (d === 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 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 p = this.ctx.createBufferSource();
-    p.buffer = m;
+    const h = this.ctx.createBufferSource();
+    h.buffer = y;
     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;
+    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;
       setTimeout(() => {
-        const v = d.indexOf(p);
-        v > -1 && d.splice(v, 1);
-      }, h + 100);
+        const v = a.indexOf(h);
+        v > -1 && a.splice(v, 1);
+      }, p + 100);
     }
-    return T + m.duration / w;
+    return M + y.duration / w;
   }
-  getOrCreateGain(e, r, i) {
-    const n = e.get(r);
+  getOrCreateGain(t, o, i) {
+    const n = t.get(o);
     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;
+    const a = this.ctx.createGain();
+    return a.gain.value = this.normalizeVolume(i), a.connect(this.ctx.destination), t.set(o, a), a;
   }
-  getOrCreateAudioElementState(e, r) {
-    const i = this.audioElements.get(e);
+  getOrCreateAudioElementState(t, o) {
+    const i = this.audioElements.get(t);
     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,
+      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
     };
-    return this.audioElements.set(e, d), d;
+    return this.audioElements.set(t, a), a;
   }
-  destroyAudioElement(e) {
+  destroyAudioElement(t) {
     try {
-      e.pause();
+      t.pause();
     } catch {
     }
-    e.removeAttribute("src");
+    t.removeAttribute("src");
     try {
-      e.load();
+      t.load();
     } catch {
     }
   }
-  normalizePlayRate(e) {
-    return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0.1, Math.min(100, e));
+  normalizePlayRate(t) {
+    return typeof t != "number" || !Number.isFinite(t) ? 1 : Math.max(0.1, Math.min(100, t));
   }
-  normalizeVolume(e) {
-    return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0, Math.min(1, e));
+  normalizeVolume(t) {
+    return typeof t != "number" || !Number.isFinite(t) ? 1 : Math.max(0, Math.min(1, t));
   }
-  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;
+  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;
   }
-  audioKey(e) {
-    return `audio:${e}`;
+  audioKey(t) {
+    return `audio:${t}`;
   }
-  videoKey(e) {
-    return `video:${e}`;
+  videoKey(t) {
+    return `video:${t}`;
   }
-  async loadClip(e) {
-    const r = this.clips.get(e.id);
-    if (r)
-      return r;
-    const i = this.loadingClips.get(e.id);
+  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 d = await fetch(e.url);
-        if (!d.body) {
-          this.loadingClips.delete(e.id);
+        const a = await fetch(t.url);
+        if (!a.body) {
+          this.loadingClips.delete(t.id);
           return;
         }
-        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);
+        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(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 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(e.id, n), n;
+    return this.loadingClips.set(t.id, n), n;
   }
-  findSegmentInProtocol(e) {
-    for (const r of this.protocol.tracks)
-      for (const i of r.children)
-        if (i.id === e) return !0;
+  findSegmentInProtocol(t) {
+    for (const o of this.protocol.tracks)
+      for (const i of o.children)
+        if (i.id === t) return !0;
     return !1;
   }
-  getSegmentVolume(e) {
-    for (const r of this.protocol.tracks)
-      for (const i of r.children) {
-        if (i.id !== e)
+  getSegmentVolume(t) {
+    for (const o of this.protocol.tracks)
+      for (const i of o.children) {
+        if (i.id !== t)
           continue;
         const n = i.volume;
         return this.normalizeVolume(n);
       }
     return 1;
   }
-  getClipSampleRate(e) {
-    const r = e.meta;
-    if (!r)
+  getClipSampleRate(t) {
+    const o = t.meta;
+    if (!o)
       return 48e3;
-    const i = r.audioSampleRate;
+    const i = o.audioSampleRate;
     if (typeof i == "number" && i > 0)
       return i;
-    const n = r.sampleRate;
+    const n = o.sampleRate;
     return typeof n == "number" && n > 0 ? n : 48e3;
   }
 }
-const it = 100, U = /* @__PURE__ */ new Map();
-let rt = it;
-function nt(o, e) {
-  U.delete(o), U.set(o, e);
+const le = 100, $ = /* @__PURE__ */ new Map();
+let de = le;
+function fe(e, t) {
+  $.delete(e), $.set(e, t);
 }
-function at() {
-  for (; U.size > rt; ) {
-    const [o, e] = U.entries().next().value;
-    U.delete(o), e.close?.();
+function he() {
+  for (; $.size > de; ) {
+    const [e, t] = $.entries().next().value;
+    $.delete(e), t.close?.();
   }
 }
-function st(o) {
-  return o.map((e) => e.content).filter(Boolean).join(`
+function pe(e) {
+  return e.map((t) => t.content).filter(Boolean).join(`
 `);
 }
-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`,
+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}`,
-    `color: ${d}`,
+    `color: ${a}`,
     `text-align: ${c}`,
     "white-space: pre-wrap"
   ];
-  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}`);
+  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 s.join("; ");
+  return u.join("; ");
 }
-async function ut(o, e) {
-  const r = `${e}::${o}`, i = U.get(r);
+async function ye(e, t) {
+  const o = `${t}::${e}`, i = $.get(o);
   if (i)
-    return nt(r, i), i;
-  const n = await _e(o, e);
-  return U.set(r, n), at(), n;
+    return fe(o, i), i;
+  const n = await Zt(e, t);
+  return $.set(o, n), he(), n;
 }
-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)
+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)
         return;
-      const V = await t.getDisplay(N);
-      if (u !== k)
+      const L = await r.getDisplay(N);
+      if (l !== b)
         return;
-      if (V && !V.destroyed) {
-        if (Ze(V, N, b, C), Fe(N) && await J(N, S), u !== k)
+      if (L && !L.destroyed) {
+        if (ae(L, N, k, C), Gt(N) && await H(N, x), l !== b)
           return;
-        P.push(V);
+        I.push(L);
       }
     }
-    if (u !== k)
+    if (l !== b)
       return;
-    M.removeChildren();
-    const F = P.filter(Boolean);
-    F.length && M.addChild(...F), u === k && t.app.render();
+    S.removeChildren();
+    const U = I.filter(Boolean);
+    U.length && S.addChild(...U), l === b && r.app.render();
   }
-  const z = ft(() => K({
+  const D = Me(() => q({
     app: n,
-    layer: d,
+    layer: a,
     protocol: i.value,
-    at: y.value,
-    getDisplay: Re
-  })), D = Be();
-  D.run(() => {
-    Q(
-      () => he(r),
-      (t) => {
+    at: m.value,
+    getDisplay: Lt
+  })), z = Qt();
+  z.run(() => {
+    Z(
+      () => Mt(o),
+      (r) => {
         try {
-          i.value = e.verify(ye(t));
-        } catch (u) {
-          console.error("[renderer] invalid protocol update", u);
+          i.value = t.verify(St(r));
+        } catch (l) {
+          console.error("[renderer] invalid protocol update", l);
           return;
         }
-        I.setProtocol(i.value), k += 1, j(), o.warmUpResources !== !1 && L(i.value), W(i.value), O(), o.manualRender || z();
+        P.setProtocol(i.value), b += 1, _(), e.warmUpResources !== !1 && F(i.value), Y(i.value), O(), e.manualRender || D();
       },
       { deep: !0, immediate: !0 }
-    ), o.manualRender || Q(y, () => {
-      O(), z();
-    }), Q(R, () => O());
+    ), e.manualRender || Z(m, () => {
+      O(), D();
+    }), Z(R, () => O());
   });
   function O() {
-    const t = R.value;
-    t <= 0 ? y.value = 0 : y.value > t ? y.value = t : y.value < 0 && (y.value = 0);
+    const r = R.value;
+    r <= 0 ? m.value = 0 : m.value > r ? m.value = r : m.value < 0 && (m.value = 0);
   }
-  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 F(r) {
+    for (const l of ne(r))
+      u.has(l) || (u.add(l), mt(l) !== "video" && ft(l) && c.add(l).catch(() => {
       }));
   }
-  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)
+  function Y(r) {
+    const l = /* @__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 _() {
+    a.removeChildren();
+    for (const r of d.values())
+      r.destroy();
+    d.clear(), y.clear();
+    for (const r of p.values())
+      ht(r);
+    p.clear();
+  }
+  function ct() {
+    g.value || (g.value = !0, E = performance.now(), A = requestAnimationFrame(ut));
+  }
+  function X() {
+    g.value = !1, A !== void 0 && cancelAnimationFrame(A), A = void 0, P.sync(m.value, !1), e.freezeOnPause !== !1 && qt();
+  }
+  function ut() {
+    lt(), g.value && (A = requestAnimationFrame(ut));
+  }
+  function lt(r) {
+    if (!g.value && r === void 0)
       return;
-    const u = performance.now(), a = t ?? (A ? u - A : 0);
-    A = u, a !== 0 && (y.value = ee(
-      y.value + a,
+    const l = performance.now(), s = r ?? (E ? l - E : 0);
+    E = l, s !== 0 && (m.value = et(
+      m.value + s,
       0,
       R.value || Number.POSITIVE_INFINITY
-    ), R.value > 0 && y.value >= R.value && Y());
-  }
-  function ke(t) {
-    y.value = ee(t, 0, R.value || Number.POSITIVE_INFINITY);
-  }
-  async function Ce(t) {
-    y.value = ee(t, 0, R.value || Number.POSITIVE_INFINITY), await z();
-  }
-  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);
+    ), R.value > 0 && m.value >= R.value && X());
+  }
+  function Ut(r) {
+    m.value = et(r, 0, R.value || Number.POSITIVE_INFINITY);
+  }
+  async function Ot(r) {
+    m.value = et(r, 0, R.value || Number.POSITIVE_INFINITY), await D();
+  }
+  async function Lt(r) {
+    const l = d.get(r.id);
+    if (l)
+      return l;
+    const s = y.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;
+  }
+  async function Vt(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);
       }
-      const u = await Pe(t.url);
-      return u ? new $(u) : Z(t.segmentType, t.url);
+      const l = await Dt(r.url);
+      return l ? new V(l) : tt(r.segmentType, r.url);
     }
-    if (t.segmentType === "text")
-      return await Ae(t);
-    t.segmentType === "effect" || t.segmentType;
+    if (r.segmentType === "text")
+      return await $t(r);
+    r.segmentType === "effect" || r.segmentType;
   }
-  async function Ae(t) {
-    const u = st(t.texts);
-    if (!u)
+  async function $t(r) {
+    const l = pe(r.texts);
+    if (!l)
       return;
-    const [a] = t.texts;
-    if (!a)
+    const [s] = r.texts;
+    if (!s)
       return;
-    const f = await ut(u, ct(a)), M = G.from(f);
-    return new $(M);
+    const f = await ye(l, me(s)), S = G.from(f);
+    return new V(S);
   }
-  async function Pe(t) {
-    const u = t.startsWith("data:"), a = /^https?:\/\//.test(t);
-    if (!u && !a)
+  async function Dt(r) {
+    const l = r.startsWith("data:"), s = /^https?:\/\//.test(r);
+    if (!l && !s)
       try {
-        await c.add(t);
-        const f = await c.get(t);
+        await c.add(r);
+        const f = await c.get(r);
         if (f instanceof HTMLImageElement)
           return G.from(f);
       } catch {
       }
-    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 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)
+        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);
       });
-      return S ? (h.set(t.id, S), S.sprite) : void 0;
+      return x ? (p.set(r.id, x), x.sprite) : void 0;
     }
     if (f) {
-      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;
+      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 (S)
-        return console.info("[renderer] video source: mp4clip", t.url), h.set(t.id, S), S.sprite;
+      if (x)
+        return console.info("[renderer] video source: mp4clip", r.url), p.set(r.id, x), x.sprite;
     }
-    if (M) {
-      const S = await q(t.url).catch((x) => {
-        console.warn("[renderer] failed to load video via <video>", t.url, x);
+    if (S) {
+      const x = await B(r.url).catch((T) => {
+        console.warn("[renderer] failed to load video via <video>", r.url, T);
       });
-      if (S)
-        return console.info("[renderer] video source: element", t.url), h.set(t.id, S), S.sprite;
+      if (x)
+        return console.info("[renderer] video source: element", r.url), p.set(r.id, x), x.sprite;
     }
   }
-  function X(t) {
-    if (!(t instanceof Error))
+  function J(r) {
+    if (!(r instanceof Error))
       return !1;
-    const u = t.message || "";
-    return u.includes("stream is done") || u.includes("not emit ready") || u.includes("tick video timeout");
+    const l = r.message || "";
+    return l.includes("stream is done") || l.includes("not emit ready") || l.includes("tick video timeout");
   }
-  async function J(t, u) {
-    const a = h.get(t.id);
-    if (a)
+  async function H(r, l) {
+    const s = p.get(r.id);
+    if (s)
       try {
-        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)
+        const f = r.fromTime ?? 0, S = Math.max(0, l - r.startTime + f), x = Math.floor(S * 1e3);
+        if (s.kind === "frozen") {
+          const k = W(r.url);
+          if (!k)
             return;
-          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;
+          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;
         }
-        if (a.kind === "mp4clip")
+        if (s.kind === "mp4clip")
           try {
-            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();
+            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 && b.audio && b.audio.length > 0) {
-              const C = a.clip.meta?.audioSampleRate ?? 48e3;
-              I.playMp4AudioFrames(t.id, b.audio, C);
+            if (g.value && k.audio && k.audio.length > 0) {
+              const C = s.clip.meta?.audioSampleRate ?? 48e3;
+              P.playMp4AudioFrames(r.id, k.audio, C);
             }
             return;
-          } 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);
+          } 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);
               });
-              if (P)
-                return h.set(t.id, P), await J(t, u);
+              if (I)
+                return p.set(r.id, I), await H(r, l);
             }
-            C && !w.has(C) && (w.add(C), console.warn("[renderer] MP4Clip tick failed", t.url, b));
+            C && !w.has(C) && (w.add(C), console.warn("[renderer] MP4Clip tick failed", r.url, k));
             return;
           }
-        const x = M / 1e3;
-        if (!Number.isFinite(x) || a.kind !== "element")
+        const T = S / 1e3;
+        if (!Number.isFinite(T) || s.kind !== "element")
           return;
-        await $e(a, {
-          targetSec: x,
-          playbackRate: t.playRate ?? 1,
-          volume: t.volume ?? 1
+        await Bt(s, {
+          targetSec: T,
+          playbackRate: r.playRate ?? 1,
+          volume: r.volume ?? 1
         });
       } catch (f) {
         console.warn("[renderer] update video frame failed", f);
       }
   }
-  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(() => {
+  async function Nt(r, l, s) {
+    const f = M !== "element", S = M !== "mp4clip";
+    if (h.has(l)) {
+      if (!S)
+        throw new Error(`[renderer] MP4Clip unsupported for ${r}`);
+      return await B(r, s).catch(() => {
       });
     }
     if (f) {
-      const S = await ue(t, a).catch((x) => {
-        if (X(x) && p.add(u), !M)
-          throw x;
+      const x = await pt(r, s).catch((T) => {
+        if (J(T) && h.add(l), !S)
+          throw T;
       });
-      if (S)
-        return S;
+      if (x)
+        return x;
     }
-    if (M)
-      return await q(t, a).catch(() => {
+    if (S)
+      return await B(r, s).catch(() => {
       });
   }
-  function Fe(t) {
-    return t.segmentType === "frames" && t.type === "video" && typeof t.url == "string" && le(t.url);
+  function Gt(r) {
+    return r.segmentType === "frames" && r.type === "video" && typeof r.url == "string" && yt(r.url);
   }
-  function Oe(t, u) {
-    const a = te(t);
-    if (a <= 0)
+  function Kt(r, l) {
+    const s = it(r);
+    if (s <= 0)
       return 0;
-    if (u < a)
-      return u;
-    const f = Math.max(1e3 / Math.max(t.fps || 30, 1), 1);
-    return Math.max(a - f, 0);
+    if (l < s)
+      return l;
+    const f = Math.max(1e3 / Math.max(r.fps || 30, 1), 1);
+    return Math.max(s - f, 0);
   }
-  async function ae(t) {
-    const u = o.resourceDir ?? dt;
+  async function dt(r) {
+    const l = e.resourceDir ?? we;
     try {
-      const a = _(t);
-      if (!a)
+      const s = W(r);
+      if (!s)
         return;
-      const f = We(`${u}/${a}`, "r");
+      const f = te(`${l}/${s}`, "r");
       if (await f.exists())
         return f;
     } catch {
       return;
     }
   }
-  function se(t) {
-    return !(!t || t.startsWith("data:") || t.startsWith("blob:"));
+  function ft(r) {
+    return !(!r || r.startsWith("data:") || r.startsWith("blob:"));
   }
-  function Ve() {
-    for (const [t, u] of h) {
-      if (u.kind === "mp4clip") {
-        u.clip.destroy(), h.set(t, {
+  function qt() {
+    for (const [r, l] of p) {
+      if (l.kind === "mp4clip") {
+        l.clip.destroy(), p.set(r, {
           kind: "frozen",
-          canvas: u.canvas,
-          texture: u.texture,
-          sprite: u.sprite,
-          meta: u.meta
+          canvas: l.canvas,
+          texture: l.texture,
+          sprite: l.sprite,
+          meta: l.meta
         });
         continue;
       }
-      u.kind === "element" && u.video.pause();
+      l.kind === "element" && l.video.pause();
     }
   }
-  function ce(t) {
-    if (t.kind === "mp4clip") {
-      t.clip.destroy();
+  function ht(r) {
+    if (r.kind === "mp4clip") {
+      r.clip.destroy();
       return;
     }
-    if (t.kind === "frozen")
+    if (r.kind === "frozen")
       return;
-    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 = () => {
+    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();
-      }, b = () => {
+      }, k = () => {
         C();
-        const P = t.error ? `${t.error.code}` : "unknown";
-        M(new Error(`Media error (${P}) while waiting for ${u}`));
+        const I = r.error ? `${r.error.code}` : "unknown";
+        S(new Error(`Media error (${I}) while waiting for ${l}`));
       }, C = () => {
-        window.clearTimeout(S), t.removeEventListener(u, x), t.removeEventListener("error", b);
+        window.clearTimeout(x), r.removeEventListener(l, T), r.removeEventListener("error", k);
       };
-      t.addEventListener(u, x, { once: !0 }), t.addEventListener("error", b, { once: !0 });
+      r.addEventListener(l, T, { once: !0 }), r.addEventListener("error", k, { once: !0 });
     });
   }
-  async function ue(t, u) {
-    let a;
-    se(t) && (a = await ae(t), a || (await c.add(t).catch(() => {
-    }), a = await ae(t)));
+  async function pt(r, l) {
+    let s;
+    ft(r) && (s = await dt(r), s || (await c.add(r).catch(() => {
+    }), s = await dt(r)));
     let f;
     try {
-      if (a)
-        f = new B(a);
+      if (s)
+        f = new K(s);
       else {
-        const P = await fetch(t);
-        if (P.body)
-          f = new B(P.body);
+        const I = await fetch(r);
+        if (I.body)
+          f = new K(I.body);
         else {
-          const F = await P.arrayBuffer(), N = new ReadableStream({
-            start(V) {
-              V.enqueue(new Uint8Array(F)), V.close();
+          const U = await I.arrayBuffer(), N = new ReadableStream({
+            start(L) {
+              L.enqueue(new Uint8Array(U)), L.close();
             }
           });
-          f = new B(N);
+          f = new K(N);
         }
       }
       await f.ready;
-      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;
+      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;
     }
   }
-  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 mt(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 le(t) {
-    const u = de(t);
-    return !(u === "image" || u === "audio");
+  function yt(r) {
+    const l = mt(r);
+    return !(l === "image" || l === "audio");
   }
-  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();
+  async function B(r, l) {
+    const s = document.createElement("video");
+    s.crossOrigin = "anonymous", s.muted = !1, s.playsInline = !0, s.preload = "metadata", s.src = r, s.load();
     try {
-      await H(a, "loadedmetadata", 15e3);
+      await Q(s, "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;
+      s.pause();
+      const I = v.get(s);
+      throw I && (URL.revokeObjectURL(I), v.delete(s)), s.removeAttribute("src"), s.load(), C;
     }
-    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) {
+    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(() => {
+    }) : 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) {
       try {
-        a.currentTime = x;
+        s.currentTime = T;
       } catch {
       }
-      await H(a, "seeked", 250).catch(() => {
+      await Q(s, "seeked", 250).catch(() => {
       });
     }
-    if (a.readyState < 2 && (await H(a, "canplay", 250).catch(() => {
-    }), a.readyState < 2))
+    if (s.readyState < 2 && (await Q(s, "canplay", 250).catch(() => {
+    }), s.readyState < 2))
       return;
-    const F = f.getContext("2d");
-    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;
+    const U = f.getContext("2d");
+    U && (U.drawImage(s, 0, 0, f.width, f.height), wt(S));
+  }
+  function jt(r) {
+    return new Promise((l) => {
+      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.src = r;
     });
   }
-  function fe(t) {
-    const u = t.source;
-    if ("update" in u && typeof u.update == "function") {
-      u.update();
+  function wt(r) {
+    const l = r.source;
+    if ("update" in l && typeof l.update == "function") {
+      l.update();
       return;
     }
-    typeof t.update == "function" && t.update();
+    typeof r.update == "function" && r.update();
   }
-  function ze() {
-    Y(), k += 1, D.stop(), j(), d.destroy({ children: !0 }), l.clear(), m.clear(), s.clear(), o.app || n.destroy(), I.destroy();
+  function _t() {
+    X(), b += 1, z.stop(), _(), a.destroy({ children: !0 }), d.clear(), y.clear(), u.clear(), e.app || n.destroy(), P.destroy();
   }
-  return o.autoPlay && ie(), {
+  return e.autoPlay && ct(), {
     app: n,
-    layer: d,
-    currentTime: y,
+    layer: a,
+    currentTime: m,
     duration: R,
     isPlaying: g,
-    play: ie,
-    pause: Y,
-    tick: ne,
-    seek: ke,
-    renderAt: Ce,
-    destroy: ze
+    play: ct,
+    pause: X,
+    tick: lt,
+    seek: Ut,
+    renderAt: Ot,
+    destroy: _t
   };
 }
-function ft(o) {
-  let e = !1, r = !1, i = null, n = null;
+function Me(e) {
+  let t = !1, o = !1, i = null, n = null;
   return async () => {
-    i || (i = new Promise((s) => {
-      n = s;
+    i || (i = new Promise((u) => {
+      n = u;
     }));
     const c = i;
-    if (r)
-      return e = !0, c;
-    r = !0;
+    if (o)
+      return t = !0, c;
+    o = !0;
     do
-      e = !1, await o();
-    while (e);
-    return r = !1, n?.(), i = null, n = null, c;
+      t = !1, await e();
+    while (t);
+    return o = !1, n?.(), i = null, n = null, c;
   };
 }
-function pt(o) {
-  return typeof o == "object" && o !== null && "createReader" in o && "getSize" in o;
+function ge(e) {
+  return typeof e == "object" && e !== null && "createReader" in e && "getSize" in e;
 }
-function ht(o) {
-  return typeof ReadableStream < "u" && o instanceof ReadableStream;
+function Se(e) {
+  return typeof ReadableStream < "u" && e instanceof ReadableStream;
 }
-function mt(o) {
-  return typeof o == "string" || o instanceof Blob || pt(o) || ht(o) ? { source: o } : o;
+function xe(e) {
+  return typeof e == "string" || e instanceof Blob || ge(e) || Se(e) ? { source: e } : e;
 }
-async function we(o) {
-  if (typeof o == "string") {
-    const e = await fetch(o);
-    if (!e.body)
+async function xt(e) {
+  if (typeof e == "string") {
+    const t = await fetch(e);
+    if (!t.body)
       throw new Error("concatVideos: unable to read video stream from url");
-    return e.body;
+    return t.body;
   }
-  return o instanceof Blob ? o.stream() : o;
+  return e instanceof Blob ? e.stream() : e;
 }
-function yt(o, e) {
-  let r = !1;
+function Te(e, t) {
+  let o = !1;
   const i = () => {
-    r || (r = !0, e());
-  }, n = o.getReader();
+    o || (o = !0, t());
+  }, n = e.getReader();
   return new ReadableStream({
-    async pull(d) {
-      const { done: c, value: s } = await n.read();
+    async pull(a) {
+      const { done: c, value: u } = await n.read();
       if (c) {
-        i(), d.close();
+        i(), a.close();
         return;
       }
-      d.enqueue(s);
+      a.enqueue(u);
     },
-    async cancel(d) {
+    async cancel(a) {
       try {
-        await n.cancel(d);
+        await n.cancel(a);
       } finally {
         i();
       }
     }
   });
 }
-async function Tt(o, e = {}) {
-  if (o.length === 0)
+async function Ne(e, t = {}) {
+  if (e.length === 0)
     throw new Error("concatVideos: expected at least one source");
   const {
-    onProgress: r,
+    onProgress: o,
     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,
+    ...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({
+    ...a,
     width: w,
-    height: T
+    height: M
   });
-  r && h.on("OutputProgress", r);
+  o && p.on("OutputProgress", o);
   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);
+  const m = async (A) => {
+    const E = A.meta.duration;
+    if (!Number.isFinite(E) || E <= 0)
+      throw A.destroy(), new Error("concatVideos: invalid clip duration");
+    const b = new nt(A);
     try {
-      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;
+      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;
     } finally {
-      k.destroy();
+      b.destroy();
     }
   };
   try {
-    await y(p);
-    for (const E of l) {
-      const A = await we(E.source), k = new B(A);
-      await k.ready, await y(k);
+    await m(h);
+    for (const A of d) {
+      const E = await xt(A.source), b = new K(E);
+      await b.ready, await m(b);
     }
-  } catch (E) {
-    throw h.destroy(), E;
+  } catch (A) {
+    throw p.destroy(), A;
   }
-  const g = v, R = h.output({ maxTime: g }), I = () => {
-    h.destroy();
+  const g = v, R = p.output({ maxTime: g }), P = () => {
+    p.destroy();
   };
   return {
-    stream: yt(R, I),
+    stream: Te(R, P),
     width: w,
-    height: T,
+    height: M,
     durationMs: Math.round(g / 1e3),
-    destroy: I
+    destroy: P
   };
 }
-class oe {
+class at {
   ready;
   meta;
   protocol;
@@ -1101,27 +1101,27 @@ class oe {
   renderer;
   app;
   destroyed = !1;
-  constructor(e, r = {}) {
-    this.protocol = e, this.options = r;
-    const i = r.width ?? e.width, n = r.height ?? e.height, d = te(e);
+  constructor(t, o = {}) {
+    this.protocol = t, this.options = o;
+    const i = o.width ?? t.width, n = o.height ?? t.height, a = it(t);
     this.meta = {
       width: i,
       height: n,
-      duration: Math.max(0, Math.round(d * 1e3))
+      duration: Math.max(0, Math.round(a * 1e3))
     }, this.ready = this.init();
   }
   async init() {
-    const e = this.options.width ?? this.protocol.width, r = this.options.height ?? this.protocol.height;
-    if (!e || !r)
+    const t = this.options.width ?? this.protocol.width, o = this.options.height ?? this.protocol.height;
+    if (!t || !o)
       throw new Error("ProtocolVideoClip: output width/height is required");
-    const i = new Se();
+    const i = new kt();
     await i.init({
-      width: e,
-      height: r,
+      width: t,
+      height: o,
       backgroundAlpha: 0,
       ...this.options.appOptions
     }), i.ticker.stop(), this.app = i;
-    const n = this.options.rendererOptions ?? {}, d = await lt({
+    const n = this.options.rendererOptions ?? {}, a = await ve({
       protocol: this.protocol,
       app: i,
       ...n,
@@ -1130,120 +1130,285 @@ class oe {
       manualRender: !0,
       videoSourceMode: n.videoSourceMode ?? "mp4clip"
     });
-    this.renderer = d;
-    const c = d.duration.value;
+    this.renderer = a;
+    const c = a.duration.value;
     return this.meta = {
       width: i.renderer.width,
       height: i.renderer.height,
       duration: Math.max(0, Math.round(c * 1e3))
     }, this.meta;
   }
-  async tick(e) {
-    const r = [];
+  async tick(t) {
+    const o = [];
     if (this.destroyed)
-      return { audio: r, state: "done" };
+      return { audio: o, state: "done" };
     if (await this.ready, !this.renderer)
-      return { audio: r, state: "done" };
+      return { audio: o, state: "done" };
     const i = this.meta.duration;
-    if (e >= i)
-      return { audio: r, state: "done" };
-    const n = Math.max(0, Math.min(e, i));
+    if (t >= i)
+      return { audio: o, state: "done" };
+    const n = Math.max(0, Math.min(t, i));
     return await this.renderer.renderAt(n / 1e3), {
       video: new VideoFrame(this.renderer.app.canvas, {
-        timestamp: e
+        timestamp: t
       }),
-      audio: r,
+      audio: o,
       state: "success"
     };
   }
   async clone() {
-    const e = new oe(this.protocol, this.options);
-    return await e.ready, e;
+    const t = new at(this.protocol, this.options);
+    return await t.ready, t;
   }
   destroy() {
     this.destroyed || (this.destroyed = !0, this.renderer?.destroy(), this.app?.destroy(!0));
   }
 }
-function wt(o, e) {
-  let r = !1;
+const It = 12e3;
+function be(e, t, o) {
+  return new Promise((i, n) => {
+    const a = globalThis.setTimeout(() => {
+      n(new Error(`composeProtocol: ${o} timed out (${t}ms)`));
+    }, t);
+    e.then((c) => {
+      globalThis.clearTimeout(a), i(c);
+    }).catch((c) => {
+      globalThis.clearTimeout(a), n(c);
+    });
+  });
+}
+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);
+      return this.clipMeta = {
+        width: i.width,
+        height: i.height,
+        duration: Math.max(0, Math.min(n, a))
+      }, this.meta;
+    });
+  }
+  ready;
+  clipMeta = {
+    width: 0,
+    height: 0,
+    duration: 0
+  };
+  get meta() {
+    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)
+      return {
+        audio: [],
+        state: "done"
+      };
+    const n = this.config.fromUs + o, a = await this.sourceClip.tick(n);
+    ke(a.video);
+    const c = this.resolveGain(i);
+    return {
+      audio: Ce(a.audio ?? [], c),
+      state: a.state
+    };
+  }
+  async clone() {
+    const t = await this.sourceClip.clone(), o = new st(t, this.config);
+    return await o.ready, o;
+  }
+  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;
+  }
+}
+function ke(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 j(e) {
+  return Number.isFinite(e) ? Math.max(0, Math.round(e * 1e3)) : 0;
+}
+function rt(e) {
+  return typeof e != "number" || !Number.isFinite(e) ? 1 : Math.max(0, Math.min(1, e));
+}
+function Re(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));
+  return {
+    fromUs: j(e.fromTime ?? 0),
+    segmentDurationUs: j(t),
+    playRate: Re(e.playRate),
+    baseVolume: rt(e.volume),
+    fadeInUs: j(o),
+    fadeOutUs: j(i)
+  };
+}
+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);
+  try {
+    const n = await fetch(e, { signal: o.signal });
+    if (!n.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;
+  } finally {
+    globalThis.clearTimeout(i);
+  }
+}
+async function Ft(e, t) {
+  const o = Ae(t), i = new st(e, o), n = new nt(i);
+  try {
+    await be(n.ready, It, "prepare audio sprite");
+  } catch (a) {
+    throw n.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);
+}
+async function Fe(e) {
+  const t = await Pt(e.url), o = new K(t, { audio: !0 });
+  return await Ft(o, 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)
+    return [];
+  const o = await Promise.allSettled(t), i = [];
+  for (const n of o) {
+    if (n.status === "fulfilled") {
+      i.push(n.value);
+      continue;
+    }
+    console.warn("[compose] skip audio sprite due to load failure", n.reason);
+  }
+  return i;
+}
+function ot(e) {
+  for (const t of e)
+    t.destroy();
+}
+function Oe(e, t) {
+  let o = !1;
   const i = () => {
-    r || (r = !0, e());
-  }, n = o.getReader();
+    o || (o = !0, t());
+  }, n = e.getReader();
   return new ReadableStream({
-    async pull(d) {
-      const { done: c, value: s } = await n.read();
+    async pull(a) {
+      const { done: c, value: u } = await n.read();
       if (c) {
-        i(), d.close();
+        i(), a.close();
         return;
       }
-      d.enqueue(s);
+      a.enqueue(u);
     },
-    async cancel(d) {
+    async cancel(a) {
       try {
-        await n.cancel(d);
+        await n.cancel(a);
       } finally {
         i();
       }
     }
   });
 }
-async function bt(o, e = {}) {
+async function Ge(e, t = {}) {
   const {
-    width: r,
+    width: o,
     height: i,
     fps: n,
-    onProgress: d,
+    onProgress: a,
     clipOptions: c,
-    audioSprites: s,
-    ...l
-  } = e, m = r ?? o.width, p = i ?? o.height;
-  if (!m || !p)
+    audioSprites: u,
+    ...d
+  } = t, y = o ?? e.width, h = i ?? e.height;
+  if (!y || !h)
     throw new Error("composeProtocol: output width/height is required");
-  const w = n ?? o.fps, T = typeof s == "function", h = l.audio ?? (T ? void 0 : !1), v = new ve({
-    ...l,
-    audio: h,
-    width: m,
-    height: p,
+  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
   });
-  d && v.on("OutputProgress", d);
-  let y, g;
+  a && v.on("OutputProgress", a);
+  let m, g;
   try {
-    if (y = new oe(o, {
-      width: m,
-      height: p,
+    m = new at(e, {
+      width: y,
+      height: h,
       fps: w,
       ...c,
       rendererOptions: {
         warmUpResources: !1,
         ...c?.rendererOptions
       }
-    }), 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 (A) {
-    throw v.destroy(), A;
+    }), 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 = y?.meta.duration ?? 0;
+  const R = m?.meta.duration ?? 0;
   if (!R)
-    throw new Error("composeProtocol: protocol has no duration");
-  const I = v.output({ maxTime: R }), E = () => {
-    g?.destroy(), y?.destroy(), v.destroy();
+    throw ot(M), g?.destroy(), m?.destroy(), v.destroy(), new Error("composeProtocol: protocol has no duration");
+  const P = v.output({ maxTime: R });
+  let A = !1;
+  const E = () => {
+    A || (A = !0, ot(M), g?.destroy(), m?.destroy(), v.destroy());
   };
   return {
-    stream: wt(I, E),
-    width: m,
-    height: p,
+    stream: Oe(P, E),
+    width: y,
+    height: h,
     durationMs: Math.round(R / 1e3),
     destroy: E
   };
 }
 export {
-  oe as ProtocolVideoClip,
-  bt as composeProtocol,
-  Tt as concatVideos,
-  lt as createRenderer
+  at as ProtocolVideoClip,
+  Ge as composeProtocol,
+  Ne as concatVideos,
+  ve as createRenderer
 };
 //# sourceMappingURL=index.js.map