@twick/live-player 0.15.16 → 0.15.19

package/dist/index.mjs

@@ -277,6 +277,7 @@ function Player({
   const playerRef = useRef(null);
   const wrapperRef = useRef(null);
   const lastRect = useRef(null);
+  const lastLoggedTimeRef = useRef(null);
   const onClickHandler = controls ? () => setPlaying((prev) => !prev) : void 0;
   useEffect(() => {
     setPlaying(playing);
@@ -290,6 +291,12 @@ function Player({
   useEffect(() => {
     setForcedVolume(volume);
   }, [volume]);
+  const variablesJson = JSON.stringify(variables);
+  useEffect(() => {
+    if (playerRef.current) {
+      playerRef.current.setAttribute("variables", variablesJson);
+    }
+  }, [variablesJson]);
   const onTimeUpdateRef = useRef(onTimeUpdate);
   const onDurationChangeRef = useRef(onDurationChange);
   useEffect(() => {
@@ -300,8 +307,13 @@ function Player({
   }, [onDurationChange]);
   const handleTimeUpdate = useCallback((event) => {
     const e = event;
-    setCurrentTime(e.detail);
-    onTimeUpdateRef.current(e.detail);
+    const t = e.detail;
+    const last = lastLoggedTimeRef.current;
+    if (last === null || Math.abs(t - last) > 0.05) {
+      lastLoggedTimeRef.current = t;
+    }
+    setCurrentTime(t);
+    onTimeUpdateRef.current(t);
   }, []);
   const handleDurationUpdate = useCallback((event) => {
     const e = event;
@@ -372,7 +384,7 @@ function Player({
         document.removeEventListener("keydown", handleKeyDown);
       };
     };
-    import("./internal-KYB5ZQ5E-Be1ZlZZg.mjs").then(() => {
+    import("./internal-LKI2GAXH-C1j65akX.mjs").then(() => {
       requestAnimationFrame(() => {
         if (playerRef.current) {
           playerRef.current.setProject(project);
@@ -419,15 +431,14 @@ function Player({
           "twick-player",
           {
             ref: playerRef,
-            playing: String(playingState),
-            onClick: onClickHandler,
-            variables: JSON.stringify(variables),
-            looping: looping ? "true" : "false",
-            width,
-            height,
             quality,
             fps,
-            volume: volumeState
+            width,
+            height,
+            volume: volumeState,
+            playing: playingState,
+            looping,
+            onClick: onClickHandler
           }
         ),
         /* @__PURE__ */ jsx(
@@ -2404,7 +2415,7 @@ function hi(r, t) {
   const e = new A5(t);
   return new Z(r.x * e.scaleX + r.y * e.skewY, r.x * e.skewX + r.y * e.scaleY);
 }
-var uL = class i2 {
+var uL = class r2 {
   constructor(t, e = 0, n = 0, s = 0) {
     if (this.x = 0, this.y = 0, this.width = 0, this.height = 0, t != null) {
       if (typeof t == "number") {
@@ -2422,23 +2433,23 @@ var uL = class i2 {
       this.x = t.x, this.y = t.y, this.width = t.width, this.height = t.height;
     }
   }
-  static createSignal(t, e = i2.lerp) {
-    return new Zo(["x", "y", "width", "height"], (n) => new i2(n), t, e).toSignal();
+  static createSignal(t, e = r2.lerp) {
+    return new Zo(["x", "y", "width", "height"], (n) => new r2(n), t, e).toSignal();
   }
   static lerp(t, e, n) {
     let s, a, o, l;
-    return typeof n == "number" ? s = a = o = l = n : n instanceof Z ? (s = o = n.x, a = l = n.y) : (s = n.x, a = n.y, o = n.width, l = n.height), new i2(Ft(t.x, e.x, s), Ft(t.y, e.y, a), Ft(t.width, e.width, o), Ft(t.height, e.height, l));
+    return typeof n == "number" ? s = a = o = l = n : n instanceof Z ? (s = o = n.x, a = l = n.y) : (s = n.x, a = n.y, o = n.width, l = n.height), new r2(Ft(t.x, e.x, s), Ft(t.y, e.y, a), Ft(t.width, e.width, o), Ft(t.height, e.height, l));
   }
   static arcLerp(t, e, n, s = false, a) {
-    return a ?? (a = (t.position.sub(e.position).ctg + t.size.sub(e.size).ctg) / 2), i2.lerp(t, e, new Z(eL(n, s, a)));
+    return a ?? (a = (t.position.sub(e.position).ctg + t.size.sub(e.size).ctg) / 2), r2.lerp(t, e, new Z(eL(n, s, a)));
   }
   static fromSizeCentered(t) {
-    return new i2(-t.width / 2, -t.height / 2, t.width, t.height);
+    return new r2(-t.width / 2, -t.height / 2, t.width, t.height);
   }
   static fromPoints(...t) {
     let e = 1 / 0, n = 1 / 0, s = -1 / 0, a = -1 / 0;
     for (const o of t) o.x > s && (s = o.x), o.x < e && (e = o.x), o.y > a && (a = o.y), o.y < n && (n = o.y);
-    return new i2(e, n, s - e, a - n);
+    return new r2(e, n, s - e, a - n);
   }
   static fromBBoxes(...t) {
     let e = 1 / 0, n = 1 / 0, s = -1 / 0, a = -1 / 0;
@@ -2448,10 +2459,10 @@ var uL = class i2 {
       const u = o.y + o.height;
       u > a && (a = u), o.y < n && (n = o.y);
     }
-    return new i2(e, n, s - e, a - n);
+    return new r2(e, n, s - e, a - n);
   }
   lerp(t, e) {
-    return i2.lerp(this, t, e);
+    return r2.lerp(this, t, e);
   }
   get position() {
     return new Z(this.x, this.y);
@@ -2505,16 +2516,16 @@ var uL = class i2 {
     return [this.topLeft, this.topRight, this.bottomRight, this.bottomLeft];
   }
   get pixelPerfect() {
-    return new i2(Math.floor(this.x), Math.floor(this.y), Math.ceil(this.width + 1), Math.ceil(this.height + 1));
+    return new r2(Math.floor(this.x), Math.floor(this.y), Math.ceil(this.width + 1), Math.ceil(this.height + 1));
   }
   transform(t) {
-    return new i2(Q1(this.position, t), hi(this.size, t));
+    return new r2(Q1(this.position, t), hi(this.size, t));
   }
   transformCorners(t) {
     return this.corners.map((e) => Q1(e, t));
   }
   expand(t) {
-    const e = new oL(t), n = new i2(this);
+    const e = new oL(t), n = new r2(this);
     return n.left -= e.left, n.top -= e.top, n.right += e.right, n.bottom += e.bottom, n;
   }
   addSpacing(t) {
@@ -2527,15 +2538,15 @@ var uL = class i2 {
     return this.left < t.right && this.right > t.left && this.top < t.bottom && this.bottom > t.top;
   }
   intersection(t) {
-    const e = new i2();
+    const e = new r2();
     return this.intersects(t) && (e.left = Math.max(this.left, t.left), e.top = Math.max(this.top, t.top), e.right = Math.min(this.right, t.right), e.bottom = Math.min(this.bottom, t.bottom)), e;
   }
   union(t) {
-    const e = new i2();
+    const e = new r2();
     return e.left = Math.min(this.left, t.left), e.top = Math.min(this.top, t.top), e.right = Math.max(this.right, t.right), e.bottom = Math.max(this.bottom, t.bottom), e;
   }
   toSymbol() {
-    return i2.symbol;
+    return r2.symbol;
   }
   toString() {
     return `BBox(${this.x}, ${this.y}, ${this.width}, ${this.height})`;
@@ -2646,7 +2657,7 @@ function MM(r) {
   const t = { ...rs, ...r.settings, shared: { ...rs.shared, ...(n = r.settings) == null ? void 0 : n.shared }, rendering: { ...rs.rendering, ...(s = r.settings) == null ? void 0 : s.rendering }, preview: { ...rs.preview, ...(a = r.settings) == null ? void 0 : a.preview } }, e = { ...t, shared: { ...t.shared, background: new T2(t.shared.background), size: new Z(t.shared.size) } };
   return { ...r, name: r.name ?? "project", settings: e, plugins: [], logger: new EH(), versions: HM("0.10.4") };
 }
-var r2 = ((r) => (r[r.Playing = 0] = "Playing", r[r.Rendering = 1] = "Rendering", r[r.Paused = 2] = "Paused", r[r.Presenting = 3] = "Presenting", r))(r2 || {});
+var $1 = ((r) => (r[r.Playing = 0] = "Playing", r[r.Rendering = 1] = "Rendering", r[r.Paused = 2] = "Paused", r[r.Presenting = 3] = "Presenting", r))($1 || {});
 function wM(r) {
   return r && (typeof r == "object" || typeof r == "function") && "toPromise" in r;
 }
@@ -4424,15 +4435,15 @@ class D1 extends pi {
       for (; l < u || l == u && a.len == 0; ) {
         if (a.done) break t;
         let T = Math.min(a.len, u - l);
-        $1(s, T, -1);
+        Y1(s, T, -1);
         let f = a.ins == -1 ? -1 : a.off == 0 ? a.ins : 0;
-        $1(e, T, f), f > 0 && Ji(n, e, a.text), a.forward(T), l += T;
+        Y1(e, T, f), f > 0 && Ji(n, e, a.text), a.forward(T), l += T;
       }
       let h = t[o++];
       for (; l < h; ) {
         if (a.done) break t;
         let T = Math.min(a.len, h - l);
-        $1(e, T, -1), $1(s, T, a.ins == -1 ? -1 : a.off == 0 ? a.ins : 0), a.forward(T), l += T;
+        Y1(e, T, -1), Y1(s, T, a.ins == -1 ? -1 : a.off == 0 ? a.ins : 0), a.forward(T), l += T;
       }
     }
     return { changes: new D1(e, n), filtered: pi.create(s) };
@@ -4449,7 +4460,7 @@ class D1 extends pi {
     let s = [], a = [], o = 0, l = null;
     function u(T = false) {
       if (!T && !s.length) return;
-      o < e && $1(s, e - o, -1);
+      o < e && Y1(s, e - o, -1);
       let f = new D1(s, a);
       l = l ? l.compose(f.map(l)) : f, s = [], a = [], o = 0;
     }
@@ -4463,7 +4474,7 @@ class D1 extends pi {
         if (f > d || f < 0 || d > e) throw new RangeError(`Invalid change range ${f} to ${d} (in doc of length ${e})`);
         let m = p ? typeof p == "string" ? Ie.of(p.split(n || Xu)) : p : Ie.empty, y = m.length;
         if (f == d && y == 0) return;
-        f < o && u(), f > o && $1(s, f - o, -1), $1(s, d - f, y), Ji(a, s, m), o = d;
+        f < o && u(), f > o && Y1(s, f - o, -1), Y1(s, d - f, y), Ji(a, s, m), o = d;
       }
     }
     return h(t), u(!l), l;
@@ -4492,7 +4503,7 @@ class D1 extends pi {
     return new D1(t, e);
   }
 }
-function $1(r, t, e, n = false) {
+function Y1(r, t, e, n = false) {
   if (t == 0 && e <= 0) return;
   let s = r.length - 2;
   s >= 0 && e <= 0 && e == r[s + 1] ? r[s] += t : s >= 0 && t == 0 && r[s] == 0 ? r[s + 1] += e : n ? (r[s] += t, r[s + 1] += e) : r.push(t, e);
@@ -4524,12 +4535,12 @@ function Yu(r, t, e, n = false) {
     if (o.done && l.len || l.done && o.len) throw new Error("Mismatched change set lengths");
     if (o.ins == -1 && l.ins == -1) {
       let h = Math.min(o.len, l.len);
-      $1(s, h, -1), o.forward(h), l.forward(h);
+      Y1(s, h, -1), o.forward(h), l.forward(h);
     } else if (l.ins >= 0 && (o.ins < 0 || u == o.i || o.off == 0 && (l.len < o.len || l.len == o.len && !e))) {
       let h = l.len;
-      for ($1(s, l.ins, -1); h; ) {
+      for (Y1(s, l.ins, -1); h; ) {
         let T = Math.min(o.len, h);
-        o.ins >= 0 && u < o.i && o.len <= T && ($1(s, 0, o.ins), a && Ji(a, s, o.text), u = o.i), o.forward(T), h -= T;
+        o.ins >= 0 && u < o.i && o.len <= T && (Y1(s, 0, o.ins), a && Ji(a, s, o.text), u = o.i), o.forward(T), h -= T;
       }
       l.next();
     } else if (o.ins >= 0) {
@@ -4539,7 +4550,7 @@ function Yu(r, t, e, n = false) {
         h += f, T -= f, l.forward(f);
       } else if (l.ins == 0 && l.len < T) T -= l.len, l.next();
       else break;
-      $1(s, h, u < o.i ? o.ins : 0), a && u < o.i && Ji(a, s, o.text), u = o.i, o.forward(o.len - T);
+      Y1(s, h, u < o.i ? o.ins : 0), a && u < o.i && Ji(a, s, o.text), u = o.i, o.forward(o.len - T);
     } else {
       if (o.done && l.done) return a ? D1.createSet(s, a) : pi.create(s);
       throw new Error("Mismatched change set lengths");
@@ -4550,16 +4561,16 @@ function bL(r, t, e = false) {
   let n = [], s = e ? [] : null, a = new M5(r), o = new M5(t);
   for (let l = false; ; ) {
     if (a.done && o.done) return s ? D1.createSet(n, s) : pi.create(n);
-    if (a.ins == 0) $1(n, a.len, 0, l), a.next();
-    else if (o.len == 0 && !o.done) $1(n, 0, o.ins, l), s && Ji(s, n, o.text), o.next();
+    if (a.ins == 0) Y1(n, a.len, 0, l), a.next();
+    else if (o.len == 0 && !o.done) Y1(n, 0, o.ins, l), s && Ji(s, n, o.text), o.next();
     else {
       if (a.done || o.done) throw new Error("Mismatched change set lengths");
       {
         let u = Math.min(a.len2, o.len), h = n.length;
         if (a.ins == -1) {
           let T = o.ins == -1 ? -1 : o.off ? 0 : o.ins;
-          $1(n, u, T, l), s && T && Ji(s, n, o.text);
-        } else o.ins == -1 ? ($1(n, a.off ? 0 : a.len, u, l), s && Ji(s, n, a.textBit(u))) : ($1(n, a.off ? 0 : a.len, o.off ? 0 : o.ins, l), s && !o.off && Ji(s, n, o.text));
+          Y1(n, u, T, l), s && T && Ji(s, n, o.text);
+        } else o.ins == -1 ? (Y1(n, a.off ? 0 : a.len, u, l), s && Ji(s, n, a.textBit(u))) : (Y1(n, a.off ? 0 : a.len, o.off ? 0 : o.ins, l), s && !o.off && Ji(s, n, o.text));
         l = (a.ins > u || o.ins >= 0 && o.len > u) && (l || n.length > h), a.forward2(u), o.forward(u);
       }
     }
@@ -4969,12 +4980,12 @@ class _1 {
 }
 _1.reconfigure = _1.define();
 _1.appendConfig = _1.define();
-class Y1 {
+class J1 {
   constructor(t, e, n, s, a, o) {
-    this.startState = t, this.changes = e, this.selection = n, this.effects = s, this.annotations = a, this.scrollIntoView = o, this._doc = null, this._state = null, n && SL(n, e.newLength), a.some((l) => l.type == Y1.time) || (this.annotations = a.concat(Y1.time.of(Date.now())));
+    this.startState = t, this.changes = e, this.selection = n, this.effects = s, this.annotations = a, this.scrollIntoView = o, this._doc = null, this._state = null, n && SL(n, e.newLength), a.some((l) => l.type == J1.time) || (this.annotations = a.concat(J1.time.of(Date.now())));
   }
   static create(t, e, n, s, a, o) {
-    return new Y1(t, e, n, s, a, o);
+    return new J1(t, e, n, s, a, o);
   }
   get newDoc() {
     return this._doc || (this._doc = this.changes.apply(this.startState.doc));
@@ -4995,14 +5006,14 @@ class Y1 {
     return this.startState.config != this.state.config;
   }
   isUserEvent(t) {
-    let e = this.annotation(Y1.userEvent);
+    let e = this.annotation(J1.userEvent);
     return !!(e && (e == t || e.length > t.length && e.slice(0, t.length) == t && e[t.length] == "."));
   }
 }
-Y1.time = Gn.define();
-Y1.userEvent = Gn.define();
-Y1.addToHistory = Gn.define();
-Y1.remote = Gn.define();
+J1.time = Gn.define();
+J1.userEvent = Gn.define();
+J1.addToHistory = Gn.define();
+J1.remote = Gn.define();
 function dw(r, t) {
   let e = [];
   for (let n = 0, s = 0; ; ) {
@@ -5020,7 +5031,7 @@ function IL(r, t, e) {
 }
 function ic(r, t, e) {
   let n = t.selection, s = rn(t.annotations);
-  return t.userEvent && (s = s.concat(Y1.userEvent.of(t.userEvent))), { changes: t.changes instanceof D1 ? t.changes : D1.of(t.changes || [], e, r.facet(ML)), selection: n && (n instanceof Rt ? n : Rt.single(n.anchor, n.head)), effects: rn(t.effects), annotations: s, scrollIntoView: !!t.scrollIntoView };
+  return t.userEvent && (s = s.concat(J1.userEvent.of(t.userEvent))), { changes: t.changes instanceof D1 ? t.changes : D1.of(t.changes || [], e, r.facet(ML)), selection: n && (n instanceof Rt ? n : Rt.single(n.anchor, n.head)), effects: rn(t.effects), annotations: s, scrollIntoView: !!t.scrollIntoView };
 }
 function VL(r, t, e) {
   let n = ic(r, t.length ? t[0] : {}, r.doc.length);
@@ -5030,7 +5041,7 @@ function VL(r, t, e) {
     let o = !!t[a].sequential;
     n = IL(n, ic(r, t[a], o ? n.changes.newLength : r.doc.length), o);
   }
-  let s = Y1.create(r, n.changes, n.selection, n.effects, n.annotations, n.scrollIntoView);
+  let s = J1.create(r, n.changes, n.selection, n.effects, n.annotations, n.scrollIntoView);
   return gw(e ? pw(s) : s);
 }
 function pw(r) {
@@ -5050,12 +5061,12 @@ function pw(r) {
       let o = r.changes.filter(e);
       s = o.changes, a = o.filtered.mapDesc(o.changes).invertedDesc;
     }
-    r = Y1.create(t, s, r.selection && r.selection.map(a), _1.mapEffects(r.effects, a), r.annotations, r.scrollIntoView);
+    r = J1.create(t, s, r.selection && r.selection.map(a), _1.mapEffects(r.effects, a), r.annotations, r.scrollIntoView);
   }
   let n = t.facet(CL);
   for (let s = n.length - 1; s >= 0; s--) {
     let a = n[s](r);
-    a instanceof Y1 ? r = a : Array.isArray(a) && a.length == 1 && a[0] instanceof Y1 ? r = a[0] : r = VL(t, rn(a), false);
+    a instanceof J1 ? r = a : Array.isArray(a) && a.length == 1 && a[0] instanceof J1 ? r = a[0] : r = VL(t, rn(a), false);
   }
   return r;
 }
@@ -5065,7 +5076,7 @@ function gw(r) {
     let a = e[s](r);
     a && Object.keys(a).length && (n = IL(n, ic(t, a, r.changes.newLength), true));
   }
-  return n == r ? r : Y1.create(t, r.changes, r.selection, n.effects, n.annotations, n.scrollIntoView);
+  return n == r ? r : J1.create(t, r.changes, r.selection, n.effects, n.annotations, n.scrollIntoView);
 }
 const mw = [];
 function rn(r) {
@@ -5778,7 +5789,7 @@ class $o {
 var U2 = function(r) {
   return r[r.Text = 0] = "Text", r[r.WidgetBefore = 1] = "WidgetBefore", r[r.WidgetAfter = 2] = "WidgetAfter", r[r.WidgetRange = 3] = "WidgetRange", r;
 }(U2 || (U2 = {}));
-class J1 extends Jr {
+class t2 extends Jr {
   constructor(t, e, n, s) {
     super(), this.startSide = t, this.endSide = e, this.widget = n, this.spec = s;
   }
@@ -5811,8 +5822,8 @@ class J1 extends Jr {
     return this.widget ? this.widget.estimatedHeight > -1 : false;
   }
 }
-J1.none = Me.empty;
-class J5 extends J1 {
+t2.none = Me.empty;
+class J5 extends t2 {
   constructor(t) {
     let { start: e, end: n } = RL(t);
     super(e ? -1 : 5e8, n ? 1 : -6e8, null, t), this.tagName = t.tagName || "span", this.attrs = t.class && t.attributes ? Jh(t.attributes, { class: t.class }) : t.class ? { class: t.class } : t.attributes || Pa;
@@ -5826,7 +5837,7 @@ class J5 extends J1 {
   }
 }
 J5.prototype.point = false;
-class t0 extends J1 {
+class t0 extends t2 {
   constructor(t) {
     super(-2e8, -2e8, null, t);
   }
@@ -5840,7 +5851,7 @@ class t0 extends J1 {
 }
 t0.prototype.mapMode = S2.TrackBefore;
 t0.prototype.point = true;
-class t4 extends J1 {
+class t4 extends t2 {
   constructor(t, e, n, s, a, o) {
     super(e, n, a, t), this.block = s, this.isReplace = o, this.mapMode = s ? e <= 0 ? S2.TrackBefore : S2.TrackAfter : S2.TrackDel;
   }
@@ -6345,7 +6356,7 @@ class yn {
       let u = [];
       return o && u.push(Yo.of((h) => {
         let T = h.plugin(l);
-        return T ? o(T) : J1.none;
+        return T ? o(T) : t2.none;
       })), a && u.push(a(l)), u;
     });
   }
@@ -7190,7 +7201,7 @@ const r9 = new class extends $o {
 }();
 class Td {
   constructor(t) {
-    this.view = t, this.decorations = [], this.blockWrappers = [], this.dynamicDecorationMap = [false], this.domChanged = null, this.hasComposition = null, this.editContextFormatting = J1.none, this.lastCompositionAfterCursor = false, this.minWidth = 0, this.minWidthFrom = 0, this.minWidthTo = 0, this.impreciseAnchor = null, this.impreciseHead = null, this.forceSelection = false, this.lastUpdate = Date.now(), this.updateDeco(), this.tile = new t7(t, t.contentDOM), this.updateInner([new B2(0, 0, 0, t.state.doc.length)], null);
+    this.view = t, this.decorations = [], this.blockWrappers = [], this.dynamicDecorationMap = [false], this.domChanged = null, this.hasComposition = null, this.editContextFormatting = t2.none, this.lastCompositionAfterCursor = false, this.minWidth = 0, this.minWidthFrom = 0, this.minWidthTo = 0, this.impreciseAnchor = null, this.impreciseHead = null, this.forceSelection = false, this.lastUpdate = Date.now(), this.updateDeco(), this.tile = new t7(t, t.contentDOM), this.updateInner([new B2(0, 0, 0, t.state.doc.length)], null);
   }
   update(t) {
     var e;
@@ -7408,12 +7419,12 @@ class Td {
       let a = s == e.viewports.length ? null : e.viewports[s], o = a ? a.from - 1 : this.view.state.doc.length;
       if (o > n) {
         let l = (e.lineBlockAt(o).bottom - e.lineBlockAt(n).top) / this.view.scaleY;
-        t.push(J1.replace({ widget: new n9(l), block: true, inclusive: true, isBlockGap: true }).range(n, o));
+        t.push(t2.replace({ widget: new n9(l), block: true, inclusive: true, isBlockGap: true }).range(n, o));
       }
       if (!a) break;
       n = a.to + 1;
     }
-    return J1.set(t);
+    return t2.set(t);
   }
   updateDeco() {
     let t = 1, e = this.view.state.facet(Yo).map((a) => (this.dynamicDecorationMap[t++] = typeof a == "function") ? a(this.view) : a), n = false, s = this.view.state.facet(sT).map((a, o) => {
@@ -8458,7 +8469,7 @@ function ja(r, t) {
   return r == t ? r : (r.constructor != t.constructor && (xn = true), t);
 }
 a2.prototype.size = 1;
-const zC = J1.replace({});
+const zC = t2.replace({});
 class _x extends a2 {
   constructor(t, e, n) {
     super(t, e), this.deco = n, this.spaceAbove = 0;
@@ -8762,7 +8773,7 @@ class a9 {
     return true;
   }
   draw(t, e) {
-    return J1.replace({ widget: new JC(this.displaySize * (e ? t.scaleY : t.scaleX), e) }).range(this.from, this.to);
+    return t2.replace({ widget: new JC(this.displaySize * (e ? t.scaleY : t.scaleX), e) }).range(this.from, this.to);
   }
 }
 class JC extends $o {
@@ -8786,7 +8797,7 @@ class Ed {
     let e = t.facet(nT).some((n) => typeof n != "function" && n.class == "cm-lineWrapping");
     this.heightOracle = new jC(e), this.stateDeco = Hd(t), this.heightMap = a2.empty().applyChanges(this.stateDeco, Ie.empty, this.heightOracle.setDoc(t.doc), [new B2(0, 0, 0, t.doc.length)]);
     for (let n = 0; n < 2 && (this.viewport = this.getViewport(0, null), !!this.updateForViewport()); n++) ;
-    this.updateViewportLines(), this.lineGaps = this.ensureLineGaps([]), this.lineGapDeco = J1.set(this.lineGaps.map((n) => n.draw(this, false))), this.computeVisibleRanges();
+    this.updateViewportLines(), this.lineGaps = this.ensureLineGaps([]), this.lineGapDeco = t2.set(this.lineGaps.map((n) => n.draw(this, false))), this.computeVisibleRanges();
   }
   updateForViewport() {
     let t = [this.viewport], { main: e } = this.state.selection;
@@ -8939,7 +8950,7 @@ class Ed {
     return this.heightOracle.lineWrapping ? t.height * a : s.total * this.heightOracle.charWidth * a;
   }
   updateLineGaps(t) {
-    a9.same(t, this.lineGaps) || (this.lineGaps = t, this.lineGapDeco = J1.set(t.map((e) => e.draw(this, this.heightOracle.lineWrapping))));
+    a9.same(t, this.lineGaps) || (this.lineGaps = t, this.lineGapDeco = t2.set(t.map((e) => e.draw(this, this.heightOracle.lineWrapping))));
   }
   computeVisibleRanges(t) {
     let e = this.stateDeco;
@@ -9301,11 +9312,11 @@ class aD {
           let u = this.toEditorPos(a.rangeStart), h = this.toEditorPos(a.rangeEnd);
           if (u < h) {
             let T = `text-decoration: underline ${/^[a-z]/.test(o) ? o + " " : o == "Dashed" ? "dashed " : o == "Squiggle" ? "wavy " : ""}${/thin/i.test(l) ? 1 : 2}px`;
-            s.push(J1.mark({ attributes: { style: T } }).range(u, h));
+            s.push(t2.mark({ attributes: { style: T } }).range(u, h));
           }
         }
       }
-      t.dispatch({ effects: rx.of(J1.set(s)) });
+      t.dispatch({ effects: rx.of(t2.set(s)) });
     }, this.handlers.compositionstart = () => {
       t.inputState.composing < 0 && (t.inputState.composing = 0, t.inputState.compositionFirstChange = true);
     }, this.handlers.compositionend = () => {
@@ -9413,7 +9424,7 @@ class be {
     });
   }
   dispatch(...t) {
-    let e = t.length == 1 && t[0] instanceof Y1 ? t : t.length == 1 && Array.isArray(t[0]) ? t[0] : [this.state.update(...t)];
+    let e = t.length == 1 && t[0] instanceof J1 ? t : t.length == 1 && Array.isArray(t[0]) ? t[0] : [this.state.update(...t)];
     this.dispatchTransactions(e, this);
   }
   update(t) {
@@ -16406,7 +16417,7 @@ function Ue() {
     return h && h.__esModule ? h : { default: h };
   };
   Object.defineProperty(Is, "__esModule", { value: true });
-  var n = jt, s = e(Ne), a = e(t2()), o = e(Le), l = zn, u;
+  var n = jt, s = e(Ne), a = e(e2()), o = e(Le), l = zn, u;
   return function(h) {
     var T = 7.2, f = 72, d = { em: function(W) {
       return W;
@@ -16744,7 +16755,7 @@ var AV = EV(Ne), HV = function() {
 }();
 b7.default = HV;
 var Zp;
-function t2() {
+function e2() {
   if (Zp) return Os;
   Zp = 1;
   var r = _ && _.__values || function(h) {
@@ -17319,7 +17330,7 @@ var Hi = {};
     return T && T.__esModule ? T : { default: T };
   };
   Object.defineProperty(r, "__esModule", { value: true }), r.TagsFactory = r.AllTags = r.NoTags = r.AbstractTags = r.TagInfo = r.Label = void 0;
-  var s = n(t2()), a = /* @__PURE__ */ function() {
+  var s = n(e2()), a = /* @__PURE__ */ function() {
     function T(f, d) {
       f === void 0 && (f = "???"), d === void 0 && (d = ""), this.tag = f, this.id = d;
     }
@@ -18621,7 +18632,7 @@ var Cn = _ && _.__assign || function() {
   return r && r.__esModule ? r : { default: r };
 };
 Object.defineProperty(p2, "__esModule", { value: true });
-var HT = SP(Nt), _t = E7(Ne), S1 = E7(Le), A7 = E7(t2()), MT = q1, c1 = E7(Ue()), $n = jt, $x = Hi, Yx = G3, zc = zn, EP = H1, Vt = {}, AP = 1.2 / 0.85, HP = { fontfamily: 1, fontsize: 1, fontweight: 1, fontstyle: 1, color: 1, background: 1, id: 1, class: 1, href: 1, style: 1 };
+var HT = SP(Nt), _t = E7(Ne), S1 = E7(Le), A7 = E7(e2()), MT = q1, h1 = E7(Ue()), $n = jt, $x = Hi, Yx = G3, zc = zn, EP = H1, Vt = {}, AP = 1.2 / 0.85, HP = { fontfamily: 1, fontsize: 1, fontweight: 1, fontstyle: 1, color: 1, background: 1, id: 1, class: 1, href: 1, style: 1 };
 Vt.Open = function(r, t) {
   r.Push(r.itemFactory.create("open"));
 };
@@ -18743,7 +18754,7 @@ Vt.MoveRoot = function(r, t, e) {
   n = parseInt(n, 10) / 15 + "em", n.substr(0, 1) !== "-" && (n = "+" + n), r.stack.global[e] = n;
 };
 Vt.Accent = function(r, t, e, n) {
-  var s = r.ParseArg(t), a = Cn(Cn({}, c1.default.getFontDef(r)), { accent: true, mathaccent: true }), o = _t.default.createEntity(e), l = r.create("token", "mo", a, o), u = l;
+  var s = r.ParseArg(t), a = Cn(Cn({}, h1.default.getFontDef(r)), { accent: true, mathaccent: true }), o = _t.default.createEntity(e), l = r.create("token", "mo", a, o), u = l;
   _t.default.setAttribute(u, "stretchy", !!n);
   var h = _t.default.isEmbellished(s) ? _t.default.getCoreMO(s) : s;
   (_t.default.isType(h, "mo") || _t.default.getProperty(h, "movablelimits")) && _t.default.setProperties(h, { movablelimits: false });
@@ -18754,23 +18765,23 @@ Vt.Accent = function(r, t, e, n) {
 };
 Vt.UnderOver = function(r, t, e, n) {
   var s = _t.default.createEntity(e), a = r.create("token", "mo", { stretchy: true, accent: true }, s), o = t.charAt(1) === "o" ? "over" : "under", l = r.ParseArg(t);
-  r.Push(c1.default.underOver(r, l, a, o, n));
+  r.Push(h1.default.underOver(r, l, a, o, n));
 };
 Vt.Overset = function(r, t) {
   var e = r.ParseArg(t), n = r.ParseArg(t);
-  c1.default.checkMovableLimits(n), e.isKind("mo") && _t.default.setAttribute(e, "accent", false);
+  h1.default.checkMovableLimits(n), e.isKind("mo") && _t.default.setAttribute(e, "accent", false);
   var s = r.create("node", "mover", [n, e]);
   r.Push(s);
 };
 Vt.Underset = function(r, t) {
   var e = r.ParseArg(t), n = r.ParseArg(t);
-  c1.default.checkMovableLimits(n), e.isKind("mo") && _t.default.setAttribute(e, "accent", false);
+  h1.default.checkMovableLimits(n), e.isKind("mo") && _t.default.setAttribute(e, "accent", false);
   var s = r.create("node", "munder", [n, e], { accentunder: false });
   r.Push(s);
 };
 Vt.Overunderset = function(r, t) {
   var e = r.ParseArg(t), n = r.ParseArg(t), s = r.ParseArg(t);
-  c1.default.checkMovableLimits(s), e.isKind("mo") && _t.default.setAttribute(e, "accent", false), n.isKind("mo") && _t.default.setAttribute(n, "accent", false);
+  h1.default.checkMovableLimits(s), e.isKind("mo") && _t.default.setAttribute(e, "accent", false), n.isKind("mo") && _t.default.setAttribute(n, "accent", false);
   var a = r.create("node", "munderover", [s, n, e], { accent: false, accentunder: false });
   r.Push(a);
 };
@@ -18795,7 +18806,7 @@ Vt.MmlToken = function(r, t) {
     var u = n.match(/^([a-z]+)\s*=\s*('[^']*'|"[^"]*"|[^ ,]*)\s*,?\s*/i);
     if (!u) throw new S1.default("InvalidMathMLAttr", "Invalid MathML attribute: %1", n);
     if (!l.attributes.hasDefault(u[1]) && !HP[u[1]]) throw new S1.default("UnknownAttrForElement", "%1 is not a recognized attribute for %2", u[1], e);
-    var h = c1.default.MmlFilterAttribute(r, u[1], u[2].replace(/^(['"])(.*)\1$/, "$2"));
+    var h = h1.default.MmlFilterAttribute(r, u[1], u[2].replace(/^(['"])(.*)\1$/, "$2"));
     h && (h.toLowerCase() === "true" ? h = true : h.toLowerCase() === "false" && (h = false), a[u[1]] = h, o.push(u[1])), n = n.substr(u[0].length);
   }
   o.length && (a["mjx-keep-attrs"] = o.join(" "));
@@ -18813,7 +18824,7 @@ Vt.Phantom = function(r, t, e, n) {
   r.Push(a);
 };
 Vt.Smash = function(r, t) {
-  var e = c1.default.trimSpaces(r.GetBrackets(t, "")), n = r.create("node", "mpadded", [r.ParseArg(t)]);
+  var e = h1.default.trimSpaces(r.GetBrackets(t, "")), n = r.create("node", "mpadded", [r.ParseArg(t)]);
   switch (e) {
     case "b":
       _t.default.setAttribute(n, "depth", 0);
@@ -18874,14 +18885,14 @@ Vt.BuildRel = function(r, t) {
   r.Push(a);
 };
 Vt.HBox = function(r, t, e, n) {
-  r.PushAll(c1.default.internalMath(r, r.GetArgument(t), e, n));
+  r.PushAll(h1.default.internalMath(r, r.GetArgument(t), e, n));
 };
 Vt.FBox = function(r, t) {
-  var e = c1.default.internalMath(r, r.GetArgument(t)), n = r.create("node", "menclose", e, { notation: "box" });
+  var e = h1.default.internalMath(r, r.GetArgument(t)), n = r.create("node", "menclose", e, { notation: "box" });
   r.Push(n);
 };
 Vt.FrameBox = function(r, t) {
-  var e = r.GetBrackets(t), n = r.GetBrackets(t) || "c", s = c1.default.internalMath(r, r.GetArgument(t));
+  var e = r.GetBrackets(t), n = r.GetBrackets(t) || "c", s = h1.default.internalMath(r, r.GetArgument(t));
   e && (s = [r.create("node", "mpadded", s, { width: e, "data-align": (0, EP.lookup)(n, { l: "left", r: "right" }, "center") })]);
   var a = r.create("node", "TeXAtom", [r.create("node", "menclose", s, { notation: "box" })], { texClass: $n.TEXCLASS.ORD });
   r.Push(a);
@@ -18918,7 +18929,7 @@ Vt.Entry = function(r, t) {
     }
     var p = a.substr(r.i, u - r.i);
     if (!p.match(/^\s*\\text[^a-zA-Z]/) || l !== p.replace(/\s+$/, "").length - 1) {
-      var m = c1.default.internalMath(r, c1.default.trimSpaces(p), 0);
+      var m = h1.default.internalMath(r, h1.default.trimSpaces(p), 0);
       r.PushAll(m), r.i = u;
     }
   }
@@ -18930,7 +18941,7 @@ Vt.CrLaTeX = function(r, t, e) {
   e === void 0 && (e = false);
   var n;
   if (!e && (r.string.charAt(r.i) === "*" && r.i++, r.string.charAt(r.i) === "[")) {
-    var s = r.GetBrackets(t, ""), a = AT(c1.default.matchDimen(s), 2), o = a[0], l = a[1];
+    var s = r.GetBrackets(t, ""), a = AT(h1.default.matchDimen(s), 2), o = a[0], l = a[1];
     if (s && !o) throw new S1.default("BracketMustBeDimension", "Bracket argument to %1 must be a dimension", r.currentCS);
     n = o + l;
   }
@@ -18965,7 +18976,7 @@ Vt.BeginEnd = function(r, t) {
     }
     r.stack.env.closing = e;
   }
-  c1.default.checkMaxMacros(r, false), r.parse("environment", [r, e]);
+  h1.default.checkMaxMacros(r, false), r.parse("environment", [r, e]);
 };
 Vt.Array = function(r, t, e, n, s, a, o, l, u) {
   s || (s = r.GetArgument("\\begin{" + t.getName() + "}"));
@@ -18976,13 +18987,13 @@ Vt.Array = function(r, t, e, n, s, a, o, l, u) {
 };
 Vt.AlignedArray = function(r, t) {
   var e = r.GetBrackets("\\begin{" + t.getName() + "}"), n = Vt.Array(r, t);
-  return c1.default.setArrayAlign(n, e);
+  return h1.default.setArrayAlign(n, e);
 };
 Vt.Equation = function(r, t, e) {
-  return r.Push(t), c1.default.checkEqnEnv(r), r.itemFactory.create("equation", e).setProperty("name", t.getName());
+  return r.Push(t), h1.default.checkEqnEnv(r), r.itemFactory.create("equation", e).setProperty("name", t.getName());
 };
 Vt.EqnArray = function(r, t, e, n, s, a) {
-  r.Push(t), n && c1.default.checkEqnEnv(r), s = s.replace(/[^clr]/g, "").split("").join(" "), s = s.replace(/l/g, "left").replace(/r/g, "right").replace(/c/g, "center");
+  r.Push(t), n && h1.default.checkEqnEnv(r), s = s.replace(/[^clr]/g, "").split("").join(" "), s = s.replace(/l/g, "left").replace(/r/g, "right").replace(/c/g, "center");
   var o = r.itemFactory.create("eqnarray", t.getName(), e, n, r.stack.global);
   return o.arraydef = { displaystyle: true, columnalign: s, columnspacing: a || "1em", rowspacing: "3pt", side: r.options.tagSide, minlabelspacing: r.options.tagIndent }, o;
 };
@@ -19002,7 +19013,7 @@ Vt.HandleRef = function(r, t, e) {
   s || (r.tags.refUpdate || (r.tags.redo = true), s = new $x.Label());
   var a = s.tag;
   e && (a = r.tags.formatTag(a));
-  var o = r.create("node", "mrow", c1.default.internalMath(r, a), { href: r.tags.formatUrl(s.id, r.options.baseURL), class: "MathJax_ref" });
+  var o = r.create("node", "mrow", h1.default.internalMath(r, a), { href: r.tags.formatUrl(s.id, r.options.baseURL), class: "MathJax_ref" });
   r.Push(o);
 };
 Vt.Macro = function(r, t, e, n, s) {
@@ -19013,9 +19024,9 @@ Vt.Macro = function(r, t, e, n, s) {
       a.push(o ?? s);
     }
     for (var l = a.length; l < n; l++) a.push(r.GetArgument(t));
-    e = c1.default.substituteArgs(r, a, e);
+    e = h1.default.substituteArgs(r, a, e);
   }
-  r.string = c1.default.addArgs(r, e, r.string.slice(r.i)), r.i = 0, c1.default.checkMaxMacros(r);
+  r.string = h1.default.addArgs(r, e, r.string.slice(r.i)), r.i = 0, h1.default.checkMaxMacros(r);
 };
 Vt.MathChoice = function(r, t) {
   var e = r.ParseArg(t), n = r.ParseArg(t), s = r.ParseArg(t), a = r.ParseArg(t);
@@ -19262,7 +19273,7 @@ var XP = _ && _.__extends || /* @__PURE__ */ function() {
   return r && r.__esModule ? r : { default: r };
 };
 Object.defineProperty(vT, "__esModule", { value: true });
-var s_ = vT.TeX = void 0, ig = r0, rg = H1, ng = x7, D4 = A0(LT), sg = A0(Ne), YP = A0(t2()), JP = A0(Le), tk = A0(S7), Vs = Hi, ek = he, ik = function(r) {
+var s_ = vT.TeX = void 0, ig = r0, rg = H1, ng = x7, D4 = A0(LT), sg = A0(Ne), YP = A0(e2()), JP = A0(Le), tk = A0(S7), Vs = Hi, ek = he, ik = function(r) {
   XP(t, r);
   function t(e) {
     e === void 0 && (e = {});
@@ -19313,7 +19324,7 @@ var DT = {}, rk = {};
     return o && o.__esModule ? o : { default: o };
   };
   Object.defineProperty(r, "__esModule", { value: true }), r.ActionConfiguration = r.ActionMethods = void 0;
-  var e = he, n = t(t2()), s = Gt, a = t(p2);
+  var e = he, n = t(e2()), s = Gt, a = t(p2);
   r.ActionMethods = {}, r.ActionMethods.Macro = a.default.Macro, r.ActionMethods.Toggle = function(o, l) {
     for (var u = [], h; (h = o.GetArgument(l)) !== "\\endtoggle"; ) u.push(new n.default(h, o.stack.env, o.configuration).mml());
     o.Push(o.create("node", "maction", u, { actiontype: "toggle" }));
@@ -19442,7 +19453,7 @@ var Yn = {};
     return y && y.__esModule ? y : { default: y };
   };
   Object.defineProperty(r, "__esModule", { value: true }), r.NEW_OPS = r.AmsMethods = void 0;
-  var s = n(Ue()), a = n(h3), o = n(Ne), l = q1, u = n(t2()), h = n(Le), T = s3, f = n(p2), d = jt;
+  var s = n(Ue()), a = n(h3), o = n(Ne), l = q1, u = n(e2()), h = n(Le), T = s3, f = n(p2), d = jt;
   r.AmsMethods = {}, r.AmsMethods.AmsEqnArray = function(y, c, Q, g, v, L, x) {
     var b = y.GetBrackets("\\begin{" + c.getName() + "}"), S = f.default.EqnArray(y, c, Q, g, v, L, x);
     return s.default.setArrayAlign(S, b);
@@ -19604,7 +19615,7 @@ var IT = {}, VT = {}, T_ = _ && _.__importDefault || function(r) {
   return r && r.__esModule ? r : { default: r };
 };
 Object.defineProperty(VT, "__esModule", { value: true });
-var Rs = T_(t2()), Qk = sr, dk = jt, O4 = T_(Ne), Qi = {};
+var Rs = T_(e2()), Qk = sr, dk = jt, O4 = T_(Ne), Qi = {};
 Qi.CD = function(r, t) {
   r.Push(t);
   var e = r.itemFactory.create("array"), n = r.configuration.options.amscd;
@@ -20150,7 +20161,7 @@ var NT = {}, Bk = _ && _.__createBinding || (Object.create ? function(r, t, e, n
   return r && r.__esModule ? r : { default: r };
 };
 Object.defineProperty(NT, "__esModule", { value: true });
-var a3 = UT(Le), F9 = UT(t2()), Kc = UT(Ue()), di = Nk(D7), z3 = {};
+var a3 = UT(Le), F9 = UT(e2()), Kc = UT(Ue()), di = Nk(D7), z3 = {};
 z3.Prooftree = function(r, t) {
   r.Push(t);
   var e = r.itemFactory.create("proofTree").setProperties({ name: t.getName(), line: "solid", currentLine: "solid", rootAtTop: false });
@@ -20308,7 +20319,7 @@ var zk = {}, jT = {};
     return l && l.__esModule ? l : { default: l };
   };
   Object.defineProperty(r, "__esModule", { value: true }), r.EmpheqUtil = void 0;
-  var a = s(Ue()), o = s(t2());
+  var a = s(Ue()), o = s(e2());
   r.EmpheqUtil = { environment: function(l, u, h, T) {
     var f = T[0], d = l.itemFactory.create(f + "-begin").setProperties({ name: u, end: f });
     l.Push(h.apply(void 0, e([l, d], t(T.slice(1)), false)));
@@ -20480,7 +20491,7 @@ var k5 = {}, Wk = _ && _.__values || function(r) {
 };
 Object.defineProperty(k5, "__esModule", { value: true });
 k5.CenternotConfiguration = k5.filterCenterOver = void 0;
-var qk = he, Tg = GT(t2()), fg = GT(Ne), Zk = Gt, Kk = GT(p2);
+var qk = he, Tg = GT(e2()), fg = GT(Ne), Zk = Gt, Kk = GT(p2);
 new Zk.CommandMap("centernot", { centerOver: "CenterOver", centernot: ["Macro", "\\centerOver{#1}{{⧸}}", 1] }, { CenterOver: function(r, t) {
   var e = "{" + r.GetArgument(t) + "}", n = r.ParseArg(t), s = new Tg.default(e, r.stack.env, r.configuration).mml(), a = r.create("node", "TeXAtom", [new Tg.default(e, r.stack.env, r.configuration).mml(), r.create("node", "mpadded", [r.create("node", "mpadded", [n], { width: 0, lspace: "-.5width" }), r.create("node", "mphantom", [s])], { width: 0, lspace: "-.5width" })]);
   r.configuration.addNode("centerOver", s), r.Push(a);
@@ -20806,61 +20817,61 @@ var uR = _ && _.__createBinding || (Object.create ? function(r, t, e, n) {
   return r && r.__esModule ? r : { default: r };
 };
 Object.defineProperty(H0, "__esModule", { value: true });
-var TR = V7(Le), fR = hR(Gt), QR = V7(p2), Kr = V7(Ue()), h1 = V7(t6), C2 = {};
+var TR = V7(Le), fR = hR(Gt), QR = V7(p2), Kr = V7(Ue()), T1 = V7(t6), C2 = {};
 C2.NewCommand = function(r, t) {
-  var e = h1.default.GetCsNameArgument(r, t), n = h1.default.GetArgCount(r, t), s = r.GetBrackets(t), a = r.GetArgument(t);
-  h1.default.addMacro(r, e, C2.Macro, [a, n, s]);
+  var e = T1.default.GetCsNameArgument(r, t), n = T1.default.GetArgCount(r, t), s = r.GetBrackets(t), a = r.GetArgument(t);
+  T1.default.addMacro(r, e, C2.Macro, [a, n, s]);
 };
 C2.NewEnvironment = function(r, t) {
-  var e = Kr.default.trimSpaces(r.GetArgument(t)), n = h1.default.GetArgCount(r, t), s = r.GetBrackets(t), a = r.GetArgument(t), o = r.GetArgument(t);
-  h1.default.addEnvironment(r, e, C2.BeginEnv, [true, a, o, n, s]);
+  var e = Kr.default.trimSpaces(r.GetArgument(t)), n = T1.default.GetArgCount(r, t), s = r.GetBrackets(t), a = r.GetArgument(t), o = r.GetArgument(t);
+  T1.default.addEnvironment(r, e, C2.BeginEnv, [true, a, o, n, s]);
 };
 C2.MacroDef = function(r, t) {
-  var e = h1.default.GetCSname(r, t), n = h1.default.GetTemplate(r, t, "\\" + e), s = r.GetArgument(t);
-  n instanceof Array ? h1.default.addMacro(r, e, C2.MacroWithTemplate, [s].concat(n)) : h1.default.addMacro(r, e, C2.Macro, [s, n]);
+  var e = T1.default.GetCSname(r, t), n = T1.default.GetTemplate(r, t, "\\" + e), s = r.GetArgument(t);
+  n instanceof Array ? T1.default.addMacro(r, e, C2.MacroWithTemplate, [s].concat(n)) : T1.default.addMacro(r, e, C2.Macro, [s, n]);
 };
 C2.Let = function(r, t) {
-  var e = h1.default.GetCSname(r, t), n = r.GetNext();
+  var e = T1.default.GetCSname(r, t), n = r.GetNext();
   n === "=" && (r.i++, n = r.GetNext());
   var s = r.configuration.handlers;
   if (n === "\\") {
-    t = h1.default.GetCSname(r, t);
+    t = T1.default.GetCSname(r, t);
     var a = s.get("delimiter").lookup("\\" + t);
     if (a) {
-      h1.default.addDelimiter(r, "\\" + e, a.char, a.attributes);
+      T1.default.addDelimiter(r, "\\" + e, a.char, a.attributes);
       return;
     }
     var o = s.get("macro").applicable(t);
     if (!o) return;
     if (o instanceof fR.MacroMap) {
       var l = o.lookup(t);
-      h1.default.addMacro(r, e, l.func, l.args, l.symbol);
+      T1.default.addMacro(r, e, l.func, l.args, l.symbol);
       return;
     }
     a = o.lookup(t);
-    var u = h1.default.disassembleSymbol(e, a), h = function(f, d) {
+    var u = T1.default.disassembleSymbol(e, a), h = function(f, d) {
       for (var p = [], m = 2; m < arguments.length; m++) p[m - 2] = arguments[m];
-      var y = h1.default.assembleSymbol(p);
+      var y = T1.default.assembleSymbol(p);
       return o.parser(f, y);
     };
-    h1.default.addMacro(r, e, h, u);
+    T1.default.addMacro(r, e, h, u);
     return;
   }
   r.i++;
   var T = s.get("delimiter").lookup(n);
   if (T) {
-    h1.default.addDelimiter(r, "\\" + e, T.char, T.attributes);
+    T1.default.addDelimiter(r, "\\" + e, T.char, T.attributes);
     return;
   }
-  h1.default.addMacro(r, e, C2.Macro, [n]);
+  T1.default.addMacro(r, e, C2.Macro, [n]);
 };
 C2.MacroWithTemplate = function(r, t, e, n) {
   for (var s = [], a = 4; a < arguments.length; a++) s[a - 4] = arguments[a];
   var o = parseInt(n, 10);
   if (o) {
     var l = [];
-    if (r.GetNext(), s[0] && !h1.default.MatchParam(r, s[0])) throw new TR.default("MismatchUseDef", "Use of %1 doesn't match its definition", t);
-    for (var u = 0; u < o; u++) l.push(h1.default.GetParameter(r, t, s[u + 1]));
+    if (r.GetNext(), s[0] && !T1.default.MatchParam(r, s[0])) throw new TR.default("MismatchUseDef", "Use of %1 doesn't match its definition", t);
+    for (var u = 0; u < o; u++) l.push(T1.default.GetParameter(r, t, s[u + 1]));
     e = Kr.default.substituteArgs(r, l, e);
   }
   r.string = Kr.default.addArgs(r, e, r.string.slice(r.i)), r.i = 0, Kr.default.checkMaxMacros(r);
@@ -21169,7 +21180,7 @@ function P_() {
     return T && T.__esModule ? T : { default: T };
   };
   Object.defineProperty(x6, "__esModule", { value: true }), x6.MathtoolsUtil = void 0;
-  var e = Nt, n = t(Ue()), s = t(t2()), a = t(Le), o = s3, l = H1, u = k_(), h = R_();
+  var e = Nt, n = t(Ue()), s = t(e2()), a = t(Le), o = s3, l = H1, u = k_(), h = R_();
   return x6.MathtoolsUtil = { setDisplayLevel: function(T, f) {
     if (f) {
       var d = r((0, l.lookup)(f, { "\\displaystyle": [true, 0], "\\textstyle": [false, 0], "\\scriptstyle": [false, 1], "\\scriptscriptstyle": [false, 2] }, [null, null]), 2), p = d[0], m = d[1];
@@ -21241,7 +21252,7 @@ function k_() {
       return Q && Q.__esModule ? Q : { default: Q };
     };
     Object.defineProperty(r, "__esModule", { value: true }), r.MathtoolsMethods = void 0;
-    var a = s(Ue()), o = Yn, l = s(p2), u = s(t2()), h = s(Le), T = s(Ne), f = jt, d = G3, p = H1, m = s(t6), y = s(H0), c = P_();
+    var a = s(Ue()), o = Yn, l = s(p2), u = s(e2()), h = s(Le), T = s(Ne), f = jt, d = G3, p = H1, m = s(t6), y = s(H0), c = P_();
     r.MathtoolsMethods = { MtMatrix: function(Q, g, v, L) {
       var x = Q.GetBrackets("\\begin{".concat(g.getName(), "}"), "c");
       return r.MathtoolsMethods.Array(Q, g, v, L, x);
@@ -22387,7 +22398,7 @@ var tf = {}, U7 = {}, hB = _ && _.__extends || /* @__PURE__ */ function() {
 };
 Object.defineProperty(U7, "__esModule", { value: true });
 U7.AutoOpen = void 0;
-var Ag = n3, TB = ef(Ue()), fB = ef(Ne), QB = ef(t2()), dB = function(r) {
+var Ag = n3, TB = ef(Ue()), fB = ef(Ne), QB = ef(e2()), dB = function(r) {
   hB(t, r);
   function t() {
     var e = r !== null && r.apply(this, arguments) || this;
@@ -22436,7 +22447,7 @@ var rf = {}, pB = _ && _.__read || function(r, t) {
   return r && r.__esModule ? r : { default: r };
 };
 Object.defineProperty(rf, "__esModule", { value: true });
-var nf = C0(p2), P1 = C0(t2()), On = C0(Le), sf = jt, p5 = C0(Ue()), eh = C0(Ne), gB = Xn, Ce = {}, F_ = { "(": ")", "[": "]", "{": "}", "|": "|" }, N_ = /^(b|B)i(g{1,2})$/;
+var nf = C0(p2), P1 = C0(e2()), On = C0(Le), sf = jt, p5 = C0(Ue()), eh = C0(Ne), gB = Xn, Ce = {}, F_ = { "(": ")", "[": "]", "{": "}", "|": "|" }, N_ = /^(b|B)i(g{1,2})$/;
 Ce.Quantity = function(r, t, e, n, s, a, o) {
   e === void 0 && (e = "("), n === void 0 && (n = ")"), s === void 0 && (s = false), a === void 0 && (a = ""), o === void 0 && (o = "");
   var l = s ? r.GetStar() : false, u = r.GetNext(), h = r.i, T = null;
@@ -22862,7 +22873,7 @@ var of = {}, e6 = {}, W_ = _ && _.__importDefault || function(r) {
 };
 Object.defineProperty(e6, "__esModule", { value: true });
 e6.TextMacrosMethods = void 0;
-var wB = W_(t2()), CB = fr, V4 = W_(p2);
+var wB = W_(e2()), CB = fr, V4 = W_(p2);
 e6.TextMacrosMethods = { Comment: function(r, t) {
   for (; r.i < r.string.length && r.string.charAt(r.i) !== `
 `; ) r.i++;
@@ -22976,7 +22987,7 @@ var D0 = {}, DB = _ && _.__extends || /* @__PURE__ */ function() {
 };
 Object.defineProperty(D0, "__esModule", { value: true });
 D0.TextParser = void 0;
-var VB = j7(t2()), Cg = j7(Le), PB = j7(Ue()), kB = jt, Dg = j7(Ne), Og = Nt, RB = function(r) {
+var VB = j7(e2()), Cg = j7(Le), PB = j7(Ue()), kB = jt, Dg = j7(Ne), Og = Nt, RB = function(r) {
   DB(t, r);
   function t(e, n, s, a) {
     var o = r.call(this, e, n, s) || this;
@@ -49861,9 +49872,9 @@ k([dt(false), ot()], E1.prototype, "smoothCorners", 2);
 k([dt(0.6), ot()], E1.prototype, "cornerSharpness", 2);
 k([vt()], E1.prototype, "profile", 1);
 E1 = k([k1("Rect")], E1);
-var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to use a concrete value and not a function:\n\n```ts wrong\nvideo.playbackRate(() => 7);\n```\n\n```ts correct\nvideo.playbackRate(7);\n```\n\nIf you're using a signal, extract its value before passing it to the property:\n\n```ts wrong\nvideo.playbackRate(mySignal);\n```\n\n```ts correct\nvideo.playbackRate(mySignal());\n```\n", T1 = class extends E1 {
+var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to use a concrete value and not a function:\n\n```ts wrong\nvideo.playbackRate(() => 7);\n```\n\n```ts correct\nvideo.playbackRate(7);\n```\n\nIf you're using a signal, extract its value before passing it to the property:\n\n```ts wrong\nvideo.playbackRate(mySignal);\n```\n\n```ts correct\nvideo.playbackRate(mySignal());\n```\n", c1 = class extends E1 {
   constructor(r) {
-    super(r), this.lastTime = -1, this.isSchedulingPlay = false, this.awaitCanPlay() || this.scheduleSeek(this.time()), r.play && this.play(), this.volume = r.volume ?? 1, this.awaitCanPlay() || this.setVolume(this.volume);
+    super(r), this.lastTime = -1, this.isSchedulingPlay = false, this.trimStart = 0, this.awaitCanPlay() || setTimeout(() => this.scheduleSeek(this.time()), 0), r.play && this.play(), this.volume = r.volume ?? 1, this.clipStart = r.clipStart, this.trimStart = r.trimStart ?? 0, this.awaitCanPlay() || this.setVolume(this.volume);
   }
   isPlaying() {
     return this.playing();
@@ -49895,18 +49906,34 @@ var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to
   completion() {
     return this.clampTime(this.time()) / this.getDuration();
   }
-  setCurrentTime(r) {
+  syncToCurrentTime(r, t) {
+    let e;
+    r !== void 0 && this.clipStart !== void 0 ? e = this.trimStart + (r - this.clipStart) * this.playbackRate() : e = r ?? this.time();
+    const n = this.setCurrentTime(e, { skipCollectPromise: (t == null ? void 0 : t.waitForSeek) ?? true });
+    if (t != null && t.waitForSeek) return n;
+  }
+  setCurrentTime(r, t) {
     try {
-      const t = this.mediaElement();
-      if (t.readyState < 2) return;
-      t.currentTime = r, this.lastTime = r, t.seeking && n1.collectPromise(new Promise((e) => {
-        const n = () => {
-          e(), t.removeEventListener("seeked", n);
+      const e = this.mediaElement(), n = this.key ?? "media";
+      if (e.readyState < 2) return this.lastTime = r, this.time(r), new Promise((a) => {
+        this.waitForCanPlay(e, () => {
+          e.currentTime = r, this.lastTime = r, this.time(r);
+          const o = () => {
+            e.removeEventListener("seeked", o), a();
+          };
+          e.seeking ? e.addEventListener("seeked", o) : a();
+        });
+      });
+      e.currentTime = r, this.lastTime = r, this.time(r);
+      const s = e.seeking ? new Promise((a) => {
+        const o = () => {
+          a(), e.removeEventListener("seeked", o);
         };
-        t.addEventListener("seeked", n);
-      }));
+        e.addEventListener("seeked", o);
+      }) : Promise.resolve();
+      return e.seeking && !(t != null && t.skipCollectPromise) && n1.collectPromise(s), s;
     } catch {
-      this.lastTime = r;
+      return this.lastTime = r, this.time(r), Promise.resolve();
     }
   }
   setVolume(r) {
@@ -49925,14 +49952,14 @@ var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to
   }
   amplify(r, t) {
     const e = `${this.src()}/${this.key}`;
-    if (T1.amplificationPool[e]) {
-      T1.amplificationPool[e].gainNode.gain.value = t;
+    if (c1.amplificationPool[e]) {
+      c1.amplificationPool[e].gainNode.gain.value = t;
       return;
     }
     const n = new AudioContext(), s = n.createMediaElementSource(r), a = n.createGain();
-    if (a.gain.value = t, s.connect(a), a.connect(n.destination), T1.amplificationPool[e] = { audioContext: n, sourceNode: s, gainNode: a }, typeof window > "u" || n.state !== "suspended") return;
+    if (a.gain.value = t, s.connect(a), a.connect(n.destination), c1.amplificationPool[e] = { audioContext: n, sourceNode: s, gainNode: a }, typeof window > "u" || n.state !== "suspended") return;
     const o = () => {
-      T1.amplificationPool[e].audioContext.resume(), window.removeEventListener("click", o);
+      c1.amplificationPool[e].audioContext.resume(), window.removeEventListener("click", o);
     };
     window.addEventListener("click", o);
   }
@@ -49971,7 +49998,7 @@ var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to
     r.addEventListener("canplay", e), r.addEventListener("canplaythrough", e), r.addEventListener("error", n);
   }
   waitForCanPlayNecessary(r) {
-    return r.readyState >= 2 ? false : this.awaitCanPlay() || this.view().playbackState() === r2.Rendering;
+    return r.readyState >= 2 ? false : this.awaitCanPlay() || this.view().playbackState() === $1.Rendering;
   }
   play() {
     this.playing(true), this.schedulePlay();
@@ -50013,7 +50040,7 @@ var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to
           const t = r.play();
           t !== void 0 && t.then(() => {
           }).catch((e) => {
-            e.name !== "AbortError" && console.warn("Error in simple play:", e), this.view().playbackState() !== r2.Rendering && this.playing(false);
+            e.name !== "AbortError" && console.warn("Error in simple play:", e), this.view().playbackState() !== $1.Rendering && this.playing(false);
           });
         }
       } catch {
@@ -50027,7 +50054,7 @@ var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to
       const s = r.play();
       s !== void 0 && s.then(() => {
       }).catch((a) => {
-        a.name !== "AbortError" && console.warn("Error playing media:", a), this.view().playbackState() !== r2.Rendering && this.playing(false);
+        a.name !== "AbortError" && console.warn("Error playing media:", a), this.view().playbackState() !== $1.Rendering && this.playing(false);
       });
     }
     const e = t(), n = r.currentTime;
@@ -50049,8 +50076,8 @@ var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to
     super.collectAsyncResources(), this.seekedMedia(), this.setVolume(this.volume);
   }
   autoPlayBasedOnTwick() {
-    const r = this.view().playbackState(), t = r === r2.Playing || r === r2.Presenting || r === r2.Rendering;
-    t && !this.playing() ? (r === r2.Rendering && this.playing(true), this.play()) : !t && this.playing() && this.pause();
+    const r = this.view().playbackState(), t = r === $1.Playing || r === $1.Presenting || r === $1.Rendering;
+    t && !this.playing() ? (r === $1.Rendering && this.playing(true), this.play()) : !t && this.playing() && this.pause();
   }
   getErrorReason(r) {
     let t;
@@ -50076,18 +50103,18 @@ var HK = "\nThe `playbackRate` of a `Video` cannot be reactive.\n\nMake sure to
     return typeof navigator > "u" ? false : /iPad|iPhone|iPod/.test(navigator.userAgent) || navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1;
   }
 };
-T1.amplificationPool = {};
-k([dt(""), ot()], T1.prototype, "src", 2);
-k([dt(false), ot()], T1.prototype, "loop", 2);
-k([dt(1), ot()], T1.prototype, "playbackRate", 2);
-k([dt(0), ot()], T1.prototype, "time", 2);
-k([dt(false), ot()], T1.prototype, "playing", 2);
-k([dt(true), ot()], T1.prototype, "awaitCanPlay", 2);
-k([dt(false), ot()], T1.prototype, "allowVolumeAmplificationInPreview", 2);
-k([vt()], T1.prototype, "completion", 1);
-k([vt()], T1.prototype, "amplify", 1);
-T1 = k([k1("Media")], T1);
-var w2 = class extends T1 {
+c1.amplificationPool = {};
+k([dt(""), ot()], c1.prototype, "src", 2);
+k([dt(false), ot()], c1.prototype, "loop", 2);
+k([dt(1), ot()], c1.prototype, "playbackRate", 2);
+k([dt(0), ot()], c1.prototype, "time", 2);
+k([dt(false), ot()], c1.prototype, "playing", 2);
+k([dt(true), ot()], c1.prototype, "awaitCanPlay", 2);
+k([dt(false), ot()], c1.prototype, "allowVolumeAmplificationInPreview", 2);
+k([vt()], c1.prototype, "completion", 1);
+k([vt()], c1.prototype, "amplify", 1);
+c1 = k([k1("Media")], c1);
+var w2 = class extends c1 {
   constructor(r) {
     super(r);
   }
@@ -50138,7 +50165,7 @@ var w2 = class extends T1 {
   async draw(r) {
     this.autoPlayBasedOnTwick();
     const t = this.view().playbackState();
-    t === r2.Playing || t === r2.Presenting ? this.fastSeekedAudio() : this.seekedAudio(), r.save(), r.restore(), await this.drawChildren(r);
+    t === $1.Playing || t === $1.Presenting ? this.fastSeekedAudio() : this.seekedAudio(), r.save(), r.restore(), await this.drawChildren(r);
   }
 };
 w2.pool = {};
@@ -50250,7 +50277,7 @@ var o3 = class extends E1 {
     return this;
   }
 };
-k([dt(r2.Paused), ot()], o3.prototype, "playbackState", 2);
+k([dt($1.Paused), ot()], o3.prototype, "playbackState", 2);
 k([dt(0), ot()], o3.prototype, "globalTime", 2);
 k([dt(0), ot()], o3.prototype, "fps", 2);
 k([ot()], o3.prototype, "assetHash", 2);
@@ -51955,7 +51982,7 @@ async function eX(r, t, e, n) {
   }
   return a.getNextFrame();
 }
-var v1 = class extends T1 {
+var v1 = class extends c1 {
   constructor(r) {
     super(r), this.detectedFileType = "unknown", this.fileTypeWasDetected = false, this.lastFrame = null;
   }
@@ -52056,10 +52083,8 @@ var v1 = class extends T1 {
     return r.playbackRate = this.playbackRate(), r.paused || r.pause(), this.lastTime === t || this.setCurrentTime(t), r;
   }
   fastSeekedVideo() {
-    const r = this.video(), t = this.clampTime(this.time());
-    if (r.playbackRate = this.playbackRate(), this.lastTime === t) return r;
-    const e = this.playing() && t < r.duration && r.playbackRate > 0;
-    return e ? r.paused && n1.collectPromise(r.play()) : r.paused || r.pause(), Math.abs(r.currentTime - t) > 1 ? this.setCurrentTime(t) : e || (r.currentTime = t), r;
+    const r = this.video(), t = this.clampTime(this.time()), e = this.playing() && t < r.duration && r.playbackRate > 0, n = t < 0.5 && r.currentTime > 1 && Math.abs(r.currentTime - this.lastTime) < 0.5, s = Math.abs(r.currentTime - t) > 1;
+    return r.playbackRate = this.playbackRate(), this.lastTime === t || (e ? r.paused && n1.collectPromise(r.play()) : r.paused || r.pause(), n || (s ? this.setCurrentTime(t) : e || this.setCurrentTime(t))), r;
   }
   async webcodecSeekedVideo() {
     const r = this.video(), t = this.clampTime(this.time());
@@ -52077,7 +52102,7 @@ var v1 = class extends T1 {
   }
   async seekFunction() {
     const r = this.view().playbackState();
-    return r === r2.Playing || r === r2.Presenting ? this.fastSeekedVideo() : r === r2.Paused ? this.seekedVideo() : this.decoder() === "slow" ? this.seekedVideo() : this.decoder() === "ffmpeg" ? this.ffmpegSeekedVideo() : this.decoder() === "web" ? this.webcodecSeekedVideo() : (this.fileTypeWasDetected || this.detectFileType(), this.detectedFileType === "webm" ? this.ffmpegSeekedVideo() : this.detectedFileType === "hls" ? this.seekedVideo() : this.webcodecSeekedVideo());
+    return r === $1.Playing || r === $1.Presenting ? this.fastSeekedVideo() : r === $1.Paused ? this.seekedVideo() : this.decoder() === "slow" ? this.seekedVideo() : this.decoder() === "ffmpeg" ? this.ffmpegSeekedVideo() : this.decoder() === "web" ? this.webcodecSeekedVideo() : (this.fileTypeWasDetected || this.detectFileType(), this.detectedFileType === "webm" ? this.ffmpegSeekedVideo() : this.detectedFileType === "hls" ? this.seekedVideo() : this.webcodecSeekedVideo());
   }
   async draw(r) {
     this.autoPlayBasedOnTwick(), this.drawShape(r);
@@ -52164,7 +52189,7 @@ var iX = class extends zM {
     return (r = this.getView()) == null || r.playbackState(this.playback.state).globalTime(this.playback.time), super.next();
   }
   async draw(r) {
-    r.save(), this.renderLifecycle.dispatch([e5.BeforeRender, r]), r.save(), this.renderLifecycle.dispatch([e5.BeginRender, r]), this.getView().playbackState(this.playback.state).globalTime(this.playback.time).fps(this.playback.fps), await this.getView().render(r), this.renderLifecycle.dispatch([e5.FinishRender, r]), r.restore(), this.renderLifecycle.dispatch([e5.AfterRender, r]), r.restore();
+    r.save(), this.renderLifecycle.dispatch([e5.BeforeRender, r]), r.save(), this.renderLifecycle.dispatch([e5.BeginRender, r]), this.getView().playbackState(this.playback.state).globalTime(this.playback.time).fps(this.playback.fps), this.playback.state === $1.Paused && await this.syncAllMediaToCurrentTime(true), await this.getView().render(r), this.renderLifecycle.dispatch([e5.FinishRender, r]), r.restore(), this.renderLifecycle.dispatch([e5.AfterRender, r]), r.restore();
   }
   reset(r) {
     for (const t of this.registeredNodes.keys()) try {
@@ -52215,7 +52240,7 @@ var iX = class extends zM {
     for (const r of this.registeredNodes.values()) !r.parent() && r !== this.view && (yield r);
   }
   getMediaAssets() {
-    const t = this.playback.state === r2.Rendering, e = Array.from(this.registeredNodes.values()).filter((l) => l instanceof v1), n = Array.from(this.registeredNodes.values()).filter((l) => l instanceof w2);
+    const t = this.playback.state === $1.Rendering, e = Array.from(this.registeredNodes.values()).filter((l) => l instanceof v1), n = Array.from(this.registeredNodes.values()).filter((l) => l instanceof w2);
     t && (e.forEach((l) => {
       const u = l.src();
       u && u !== "undefined" && !l.isPlaying() && l.playing(true);
@@ -52226,12 +52251,26 @@ var iX = class extends zM {
     const s = e.filter((l) => l.isPlaying()), a = n.filter((l) => l.isPlaying()), o = [];
     return o.push(...s.map((l) => ({ key: l.key, type: "video", src: l.src(), decoder: l.decoder(), playbackRate: typeof l.playbackRate == "function" ? l.playbackRate() : l.playbackRate, volume: l.getVolume(), currentTime: l.getCurrentTime(), duration: l.getDuration() }))), o.push(...a.map((l) => ({ key: l.key, type: "audio", src: l.src(), playbackRate: typeof l.playbackRate == "function" ? l.playbackRate() : l.playbackRate, volume: l.getVolume(), currentTime: l.getCurrentTime(), duration: l.getDuration() }))), o;
   }
+  async syncAllMediaToCurrentTime(r) {
+    const t = this.playback.time, n = Array.from(this.registeredNodes.values()).filter((s) => s instanceof c1).map((s) => {
+      try {
+        return s.syncToCurrentTime(t, { waitForSeek: r });
+      } catch (a) {
+        this.logger.warn({ message: `syncAllMediaToCurrentTime: skipped node ${s.key ?? "unknown"}`, object: a });
+        return;
+      }
+    });
+    if (r) {
+      const s = n.filter((a) => a !== void 0);
+      await Promise.all(s);
+    }
+  }
   stopAllMedia() {
-    const r = Array.from(this.registeredNodes.values()).filter((t) => t instanceof T1).filter((t) => t.isPlaying());
+    const r = Array.from(this.registeredNodes.values()).filter((t) => t instanceof c1).filter((t) => t.isPlaying());
     for (const t of r) t.dispose();
   }
   adjustVolume(r) {
-    const t = Array.from(this.registeredNodes.values()).filter((e) => e instanceof T1);
+    const t = Array.from(this.registeredNodes.values()).filter((e) => e instanceof c1);
     for (const e of t) e.setVolume(e.getVolume() * r);
   }
   recreateView() {
@@ -52244,13 +52283,16 @@ var iX = class extends zM {
 function rX(r, t) {
   return { klass: iX, name: r, config: t, stack: new Error().stack, plugins: ["@twick/2d/editor"] };
 }
-const rE = "#000000", nE = { x: 0, y: 0 }, er = "easeInOut", t5 = { VIDEO: "video", AUDIO: "audio", CAPTION: "caption", SCENE: "scene", ELEMENT: "element" }, Qv = { highlight_bg: { rect: { alignItems: "center", gap: 2 }, word: { lineWidth: 0.35, stroke: "#000000", fontWeight: 700, shadowOffset: [-3, 3], shadowColor: "#000000", fill: "#ffffff", fontFamily: "Bangers", bgColor: "#444444", bgOffsetWidth: 30, bgOffsetHeight: 8, fontSize: 46 } }, word_by_word: { rect: { alignItems: "center", justifyContent: "center", gap: 8 }, word: { lineWidth: 0.35, stroke: "#000000", fontWeight: 700, strokeFirst: true, shadowOffset: [-2, 2], shadowColor: "#000000", shadowBlur: 5, fontFamily: "Bangers", fill: "#FFFFFF", bgOffsetWidth: 20, bgOffsetHeight: 10, fontSize: 46 } }, word_by_word_with_bg: { rect: { alignItems: "center", gap: 8, padding: [10, 20], radius: 10 }, word: { lineWidth: 0.35, stroke: "#000000", fontWeight: 700, strokeFirst: true, shadowOffset: [-2, 2], shadowColor: "#000000", shadowBlur: 5, fontFamily: "Bangers", fill: "#FFFFFF", bgOffsetWidth: 20, bgOffsetHeight: 10, fontSize: 46 } } }, nX = { text: "#000000", bgColor: "#444444" }, sX = { family: "Poppins", size: 48, weight: 400 }, aX = "#FFFFFF00", dv = { VIDEO: "video", IMAGE: "image" }, Vu = { CONTAIN: "contain", COVER: "cover", FILL: "fill" }, e2 = { SATURATED: "saturated", BRIGHT: "bright", VIBRANT: "vibrant", RETRO: "retro", BLACK_WHITE: "blackWhite", COOL: "cool", WARM: "warm", CINEMATIC: "cinematic", SOFT_GLOW: "softGlow", MOODY: "moody", DREAMY: "dreamy", INVERTED: "inverted", VINTAGE: "vintage", DRAMATIC: "dramatic", FADED: "faded" }, pv = { PLAYER_UPDATE: "twick:playerUpdate" };
+const rE = "#000000", nE = { x: 0, y: 0 }, er = "easeInOut", t5 = { VIDEO: "video", AUDIO: "audio", CAPTION: "caption", SCENE: "scene", ELEMENT: "element" }, Qv = { highlight_bg: { rect: { alignItems: "center", gap: 2 }, word: { lineWidth: 0.35, stroke: "#000000", fontWeight: 700, shadowOffset: [-3, 3], shadowColor: "#000000", fill: "#ffffff", fontFamily: "Bangers", bgColor: "#444444", bgOffsetWidth: 30, bgOffsetHeight: 8, fontSize: 46 } }, word_by_word: { rect: { alignItems: "center", justifyContent: "center", gap: 8 }, word: { lineWidth: 0.35, stroke: "#000000", fontWeight: 700, strokeFirst: true, shadowOffset: [-2, 2], shadowColor: "#000000", shadowBlur: 5, fontFamily: "Bangers", fill: "#FFFFFF", bgOffsetWidth: 20, bgOffsetHeight: 10, fontSize: 46 } }, word_by_word_with_bg: { rect: { alignItems: "center", gap: 8, padding: [10, 20], radius: 10 }, word: { lineWidth: 0.35, stroke: "#000000", fontWeight: 700, strokeFirst: true, shadowOffset: [-2, 2], shadowColor: "#000000", shadowBlur: 5, fontFamily: "Bangers", fill: "#FFFFFF", bgOffsetWidth: 20, bgOffsetHeight: 10, fontSize: 46 } } }, nX = { text: "#000000", bgColor: "#444444" }, sX = { family: "Poppins", size: 48, weight: 400 }, aX = "#FFFFFF00", dv = { VIDEO: "video", IMAGE: "image" }, Vu = { CONTAIN: "contain", COVER: "cover", FILL: "fill" }, i2 = { SATURATED: "saturated", BRIGHT: "bright", VIBRANT: "vibrant", RETRO: "retro", BLACK_WHITE: "blackWhite", COOL: "cool", WARM: "warm", CINEMATIC: "cinematic", SOFT_GLOW: "softGlow", MOODY: "moody", DREAMY: "dreamy", INVERTED: "inverted", VINTAGE: "vintage", DRAMATIC: "dramatic", FADED: "faded" }, pv = { PLAYER_UPDATE: "twick:playerUpdate" };
 function k0(r, t) {
   console.log(`[Visualizer] ${r}`, t || "");
 }
 const oX = { name: "audio", *create({ containerRef: r, element: t, view: e }) {
+  var l, u;
   const n = Je();
-  yield* Kt(t == null ? void 0 : t.s), yield r().add(Xe(w2, { ref: n, play: true, ...t.props }, t.id)), yield* Kt(Math.max(0, t.e - t.s)), yield n().play(false), yield n().remove();
+  yield* Kt(t == null ? void 0 : t.s);
+  const s = ((l = t.props) == null ? void 0 : l.time) ?? 0, a = ((u = t.props) == null ? void 0 : u.playbackRate) ?? 1, o = (s + (e.globalTime() - t.s)) * a;
+  yield r().add(Xe(w2, { ref: n, play: true, ...t.props, time: o, clipStart: t.s, trimStart: s }, t.id)), yield* Kt(Math.max(0, t.e - t.s)), yield n().play(false), yield n().remove();
 } };
 function lX({ t: r, s: t, e }) {
   const n = r.split(" "), s = e - t, a = n.join("").length;
@@ -52510,49 +52552,49 @@ const CX = { name: "circle", *create({ containerRef: r, element: t, view: e }) {
   yield* Kt(t == null ? void 0 : t.s), yield r().add(Xe(gr, { ref: n, ...t.props }, t.id)), yield* xe(Bn({ elementRef: n, element: t, view: e }), Kt(Math.max(0, t.e - t.s))), yield n().remove();
 } }, aE = (r, t) => {
   switch (t) {
-    case e2.SATURATED:
+    case i2.SATURATED:
       r().filters.saturate(1.4), r().filters.contrast(1.1);
       break;
-    case e2.BRIGHT:
+    case i2.BRIGHT:
       r().filters.brightness(1.3), r().filters.contrast(1.05);
       break;
-    case e2.VIBRANT:
+    case i2.VIBRANT:
       r().filters.saturate(1.6), r().filters.brightness(1.15), r().filters.contrast(1.1);
       break;
-    case e2.RETRO:
+    case i2.RETRO:
       r().filters.sepia(0.8), r().filters.contrast(1.3), r().filters.brightness(0.85), r().filters.saturate(0.8);
       break;
-    case e2.BLACK_WHITE:
+    case i2.BLACK_WHITE:
       r().filters.grayscale(1), r().filters.contrast(1.25), r().filters.brightness(1.05);
       break;
-    case e2.COOL:
+    case i2.COOL:
       r().filters.hue(15), r().filters.brightness(1.1), r().filters.saturate(1.3), r().filters.contrast(1.05);
       break;
-    case e2.WARM:
+    case i2.WARM:
       r().filters.hue(-15), r().filters.brightness(1.15), r().filters.saturate(1.3), r().filters.contrast(1.05);
       break;
-    case e2.CINEMATIC:
+    case i2.CINEMATIC:
       r().filters.contrast(1.4), r().filters.brightness(0.95), r().filters.saturate(0.85), r().filters.sepia(0.2);
       break;
-    case e2.SOFT_GLOW:
+    case i2.SOFT_GLOW:
       r().filters.brightness(1.2), r().filters.contrast(0.95), r().filters.blur(1.2), r().filters.saturate(1.1);
       break;
-    case e2.MOODY:
+    case i2.MOODY:
       r().filters.brightness(1.05), r().filters.contrast(1.4), r().filters.saturate(0.65), r().filters.sepia(0.2);
       break;
-    case e2.DREAMY:
+    case i2.DREAMY:
       r().filters.brightness(1.3), r().filters.blur(2), r().filters.saturate(1.4), r().filters.contrast(0.95);
       break;
-    case e2.INVERTED:
+    case i2.INVERTED:
       r().filters.invert(1), r().filters.hue(180);
       break;
-    case e2.VINTAGE:
+    case i2.VINTAGE:
       r().filters.sepia(0.4), r().filters.saturate(1.4), r().filters.contrast(1.2), r().filters.brightness(1.1);
       break;
-    case e2.DRAMATIC:
+    case i2.DRAMATIC:
       r().filters.contrast(1.5), r().filters.brightness(0.9), r().filters.saturate(1.2);
       break;
-    case e2.FADED:
+    case i2.FADED:
       r().filters.opacity(0.9), r().filters.brightness(1.2), r().filters.saturate(0.8), r().filters.contrast(0.9);
       break;
   }
@@ -52565,10 +52607,10 @@ const CX = { name: "circle", *create({ containerRef: r, element: t, view: e }) {
   const n = Je();
   yield* Kt(t == null ? void 0 : t.s), k0(`RectElement: ${JSON.stringify(t)}`), yield r().add(Xe(E1, { ref: n, ...t.props }, t.id)), yield* xe(Bn({ elementRef: n, element: t, view: e }), Kt(Math.max(0, t.e - t.s))), yield n().remove();
 } }, lE = { name: "video", *create({ containerRef: r, element: t, view: e }) {
-  var a;
+  var u, h, T;
   yield* Kt(t == null ? void 0 : t.s);
-  const n = Je(), s = Je();
-  yield r().add(Xe(E1, { ref: n, ...t.frame, children: Xe(v1, { ref: s, play: true, ...t.props }, `child-${t.id}`) }, t.id)), n() && (yield R0({ elementRef: s, containerSize: n().size(), elementSize: s().size(), objectFit: t.objectFit }), (a = t == null ? void 0 : t.props) != null && a.mediaFilter && aE(s, t.props.mediaFilter), yield* xe(Bn({ elementRef: s, containerRef: n, element: t, view: e }), sE({ containerRef: n, elementRef: s, element: t }), Kt(Math.max(0, t.e - t.s))), yield s().play(false), yield s().remove(), yield n().remove());
+  const n = Je(), s = Je(), a = ((u = t.props) == null ? void 0 : u.time) ?? 0, o = ((h = t.props) == null ? void 0 : h.playbackRate) ?? 1, l = (a + (e.globalTime() - t.s)) * o;
+  yield r().add(Xe(E1, { ref: n, ...t.frame, children: Xe(v1, { ref: s, play: true, ...t.props, time: l, clipStart: t.s, trimStart: a }, `child-${t.id}`) }, t.id)), n() && (yield R0({ elementRef: s, containerSize: n().size(), elementSize: s().size(), objectFit: t.objectFit }), (T = t == null ? void 0 : t.props) != null && T.mediaFilter && aE(s, t.props.mediaFilter), yield* xe(Bn({ elementRef: s, containerRef: n, element: t, view: e }), sE({ containerRef: n, elementRef: s, element: t }), Kt(Math.max(0, t.e - t.s))), yield s().play(false), yield s().remove(), yield n().remove());
 } }, OX = { name: "scene", *create({ containerRef: r, element: t, view: e }) {
   yield* Kt(t == null ? void 0 : t.s);
   const n = Je();
@@ -52798,8 +52840,12 @@ const LivePlayer = ({
     var _a3;
     if (isFirstRender.current && ((_a3 = playerRef.current) == null ? void 0 : _a3.htmlElement)) {
       setProjectData(projectData);
+      const el2 = playerRef.current.htmlElement;
+      requestAnimationFrame(() => {
+        el2.dispatchEvent(new CustomEvent("seekto", { detail: seekTime }));
+      });
     }
-  }, [projectData, setProjectData]);
+  }, [projectData, setProjectData, seekTime]);
   useEffect(() => {
     var _a3;
     if ((_a3 = playerRef.current) == null ? void 0 : _a3.player) {