@linker-design-plus/timeline-track 2.0.0 → 2.0.2

package/dist/index.es.js

@@ -42,7 +42,7 @@ const ks = {
   scrollbarBorder: "#555555",
   scrollbarThumb: "#444444"
 };
-function We(r) {
+function Ve(r) {
   return r ? {
     ...hi,
     ...r
@@ -52,7 +52,7 @@ const vt = {
   mode: "auto-first-added-video",
   width: 16,
   height: 9
-}, xl = [
+}, El = [
   {
     key: "default",
     label: "默认",
@@ -92,7 +92,7 @@ function Ht(r) {
     height: typeof (r == null ? void 0 : r.height) == "number" && r.height > 0 ? r.height : vt.height
   };
 }
-const El = {
+const Al = {
   DEFAULT: 1,
   // 默认层级
   ACTIVE: 2
@@ -108,12 +108,12 @@ const El = {
   // 动画持续时间（毫秒）
   EASING: "easeOutCubic"
   // 缓动函数
-}, Al = {
+}, Ll = {
   DEFAULT_HEIGHT: 40,
   // 默认时间刻度高度
   MIN_HEIGHT: 20,
   MAX_HEIGHT: 80
-}, at = 15, Ve = 6, At = {
+}, at = 15, We = 6, At = {
   VIDEO: 64,
   // 视频轨道高度
   AUDIO: 48
@@ -309,7 +309,7 @@ const zt = typeof global < "u" ? global : typeof window < "u" ? window : typeof
   _injectGlobal(r) {
     typeof zt.Konva < "u" && console.error("Several Konva instances detected. It is not recommended to use multiple Konva instances in the same environment."), zt.Konva = r;
   }
-}, Q = (r) => {
+}, tt = (r) => {
   E[r.prototype.getClassName()] = r;
 };
 E._injectGlobal(E);
@@ -924,7 +924,7 @@ const Fs = typeof requestAnimationFrame < "u" && requestAnimationFrame || functi
     }
   }
 };
-function Ws(r) {
+function Vs(r) {
   const t = [], e = r.length, i = C;
   for (let n = 0; n < e; n++) {
     let s = r[n];
@@ -932,7 +932,7 @@ function Ws(r) {
   }
   return t;
 }
-const Gi = ",", Vs = "(", Ys = ")", Xs = "([", Us = "])", $s = ";", qs = "()", Ks = "=", Oi = [
+const Gi = ",", Ws = "(", Ys = ")", Xs = "([", Us = "])", $s = ";", qs = "()", Ks = "=", Oi = [
   "arc",
   "arcTo",
   "beginPath",
@@ -1018,7 +1018,7 @@ class Xe {
   getTrace(t, e) {
     let i = this.traceArr, n = i.length, s = "", a, o, l, h;
     for (a = 0; a < n; a++)
-      o = i[a], l = o.method, l ? (h = o.args, s += l, t ? s += qs : C._isArray(h[0]) ? s += Xs + h.join(Gi) + Us : (e && (h = h.map((c) => typeof c == "number" ? Math.floor(c) : c)), s += Vs + h.join(Gi) + Ys)) : (s += o.property, t || (s += Ks + o.val)), s += $s;
+      o = i[a], l = o.method, l ? (h = o.args, s += l, t ? s += qs : C._isArray(h[0]) ? s += Xs + h.join(Gi) + Us : (e && (h = h.map((c) => typeof c == "number" ? Math.floor(c) : c)), s += Ws + h.join(Gi) + Ys)) : (s += o.property, t || (s += Ks + o.val)), s += $s;
     return s;
   }
   clearTrace() {
@@ -1179,7 +1179,7 @@ class Xe {
     const a = function(o) {
       let l = t[o], h;
       t[o] = function() {
-        return s = Ws(Array.prototype.slice.call(arguments, 0)), h = l.apply(t, arguments), t._trace({
+        return s = Vs(Array.prototype.slice.call(arguments, 0)), h = l.apply(t, arguments), t._trace({
           method: o,
           args: s
         }), h;
@@ -1465,7 +1465,7 @@ function xi() {
       return C._isNumber(r) || r === "auto" || C.warn(Mt(r) + ' is a not valid value for "' + t + '" attribute. The value should be a number or "auto".'), r;
     };
 }
-function Wt() {
+function Vt() {
   if (E.isUnminified)
     return function(r, t) {
       return C._isString(r) || C.warn(Mt(r) + ' is a not valid value for "' + t + '" attribute. The value should be a string.'), r;
@@ -1625,7 +1625,7 @@ function nr(r) {
   return () => {
   };
 }
-const ze = "absoluteOpacity", Hi = "allEventListeners", Tt = "absoluteTransform", zi = "absoluteScale", Gt = "canvas", sr = "Change", rr = "children", ar = "konva", ci = "listening", or = "mouseenter", lr = "mouseleave", hr = "pointerenter", cr = "pointerleave", dr = "touchenter", ur = "touchleave", Ni = "set", Fi = "Shape", Ne = " ", Wi = "stage", Pt = "transform", fr = "Stage", di = "visible", gr = [
+const ze = "absoluteOpacity", Hi = "allEventListeners", Tt = "absoluteTransform", zi = "absoluteScale", Gt = "canvas", sr = "Change", rr = "children", ar = "konva", ci = "listening", or = "mouseenter", lr = "mouseleave", hr = "pointerenter", cr = "pointerleave", dr = "touchenter", ur = "touchleave", Ni = "set", Fi = "Shape", Ne = " ", Vi = "stage", Pt = "transform", fr = "Stage", di = "visible", gr = [
   "xChange.konva",
   "yChange.konva",
   "scaleXChange.konva",
@@ -1826,7 +1826,7 @@ class _ {
     return this.isDragging() && this.stopDrag(), Y._dragElements.delete(this._id), this._remove(), this;
   }
   _clearCaches() {
-    this._clearSelfAndDescendantCache(Tt), this._clearSelfAndDescendantCache(ze), this._clearSelfAndDescendantCache(zi), this._clearSelfAndDescendantCache(Wi), this._clearSelfAndDescendantCache(di), this._clearSelfAndDescendantCache(ci);
+    this._clearSelfAndDescendantCache(Tt), this._clearSelfAndDescendantCache(ze), this._clearSelfAndDescendantCache(zi), this._clearSelfAndDescendantCache(Vi), this._clearSelfAndDescendantCache(di), this._clearSelfAndDescendantCache(ci);
   }
   _remove() {
     this._clearCaches();
@@ -2090,7 +2090,7 @@ class _ {
     return t ? t.getLayer() : null;
   }
   getStage() {
-    return this._getCache(Wi, this._getStage);
+    return this._getCache(Vi, this._getStage);
   }
   _getStage() {
     const t = this.getParent();
@@ -2433,39 +2433,39 @@ _.prototype.on.call(_.prototype, "listeningChange.konva", function() {
 _.prototype.on.call(_.prototype, "opacityChange.konva", function() {
   this._clearSelfAndDescendantCache(ze);
 });
-const q = m.addGetterSetter;
-q(_, "zIndex");
-q(_, "absolutePosition");
-q(_, "position");
-q(_, "x", 0, x());
-q(_, "y", 0, x());
-q(_, "globalCompositeOperation", "source-over", Wt());
-q(_, "opacity", 1, x());
-q(_, "name", "", Wt());
-q(_, "id", "", Wt());
-q(_, "rotation", 0, x());
+const K = m.addGetterSetter;
+K(_, "zIndex");
+K(_, "absolutePosition");
+K(_, "position");
+K(_, "x", 0, x());
+K(_, "y", 0, x());
+K(_, "globalCompositeOperation", "source-over", Vt());
+K(_, "opacity", 1, x());
+K(_, "name", "", Vt());
+K(_, "id", "", Vt());
+K(_, "rotation", 0, x());
 m.addComponentsGetterSetter(_, "scale", ["x", "y"]);
-q(_, "scaleX", 1, x());
-q(_, "scaleY", 1, x());
+K(_, "scaleX", 1, x());
+K(_, "scaleY", 1, x());
 m.addComponentsGetterSetter(_, "skew", ["x", "y"]);
-q(_, "skewX", 0, x());
-q(_, "skewY", 0, x());
+K(_, "skewX", 0, x());
+K(_, "skewY", 0, x());
 m.addComponentsGetterSetter(_, "offset", ["x", "y"]);
-q(_, "offsetX", 0, x());
-q(_, "offsetY", 0, x());
-q(_, "dragDistance", void 0, x());
-q(_, "width", 0, x());
-q(_, "height", 0, x());
-q(_, "listening", !0, ft());
-q(_, "preventDefault", !0, ft());
-q(_, "filters", void 0, function(r) {
+K(_, "offsetX", 0, x());
+K(_, "offsetY", 0, x());
+K(_, "dragDistance", void 0, x());
+K(_, "width", 0, x());
+K(_, "height", 0, x());
+K(_, "listening", !0, ft());
+K(_, "preventDefault", !0, ft());
+K(_, "filters", void 0, function(r) {
   return this._filterUpToDate = !1, r;
 });
-q(_, "visible", !0, ft());
-q(_, "transformsEnabled", "all", Wt());
-q(_, "size");
-q(_, "dragBoundFunc");
-q(_, "draggable", !1, ft());
+K(_, "visible", !0, ft());
+K(_, "transformsEnabled", "all", Vt());
+K(_, "size");
+K(_, "dragBoundFunc");
+K(_, "draggable", !1, ft());
 m.backCompat(_, {
   rotateDeg: "rotate",
   setRotationDeg: "setRotation",
@@ -2692,13 +2692,13 @@ function pe(r, t) {
   const i = e.getStage();
   i && i.content, ve.delete(r), Dn && e._fire("lostpointercapture", Ei(new PointerEvent("lostpointercapture")));
 }
-const mr = "Stage", yr = "string", Vi = "px", Sr = "mouseout", Bn = "mouseleave", Hn = "mouseover", zn = "mouseenter", Nn = "mousemove", Fn = "mousedown", Wn = "mouseup", le = "pointermove", he = "pointerdown", Zt = "pointerup", ce = "pointercancel", Cr = "lostpointercapture", Ee = "pointerout", de = "pointerleave", Ae = "pointerover", Le = "pointerenter", ui = "contextmenu", Vn = "touchstart", Yn = "touchend", Xn = "touchmove", Un = "touchcancel", fi = "wheel", Tr = 5, vr = [
+const mr = "Stage", yr = "string", Wi = "px", Sr = "mouseout", Bn = "mouseleave", Hn = "mouseover", zn = "mouseenter", Nn = "mousemove", Fn = "mousedown", Vn = "mouseup", le = "pointermove", he = "pointerdown", Zt = "pointerup", ce = "pointercancel", Cr = "lostpointercapture", Ee = "pointerout", de = "pointerleave", Ae = "pointerover", Le = "pointerenter", ui = "contextmenu", Wn = "touchstart", Yn = "touchend", Xn = "touchmove", Un = "touchcancel", fi = "wheel", Tr = 5, vr = [
   [zn, "_pointerenter"],
   [Fn, "_pointerdown"],
   [Nn, "_pointermove"],
-  [Wn, "_pointerup"],
+  [Vn, "_pointerup"],
   [Bn, "_pointerleave"],
-  [Vn, "_pointerdown"],
+  [Wn, "_pointerdown"],
   [Xn, "_pointermove"],
   [Yn, "_pointerup"],
   [Un, "_pointercancel"],
@@ -2719,7 +2719,7 @@ const mr = "Stage", yr = "string", Vi = "px", Sr = "mouseout", Bn = "mouseleave"
     [Le]: zn,
     [le]: Nn,
     [he]: Fn,
-    [Zt]: Wn,
+    [Zt]: Vn,
     [ce]: "mousecancel",
     pointerclick: "click",
     pointerdblclick: "dblclick"
@@ -2730,7 +2730,7 @@ const mr = "Stage", yr = "string", Vi = "px", Sr = "mouseout", Bn = "mouseleave"
     [Ae]: "touchover",
     [Le]: "touchenter",
     [le]: Xn,
-    [he]: Vn,
+    [he]: Wn,
     [Zt]: Yn,
     [ce]: Un,
     pointerclick: "tap",
@@ -2855,7 +2855,7 @@ class $e extends ht {
   }
   _resizeDOM() {
     const t = this.width(), e = this.height();
-    this.content && (this.content.style.width = t + Vi, this.content.style.height = e + Vi), this.bufferCanvas.setSize(t, e), this.bufferHitCanvas.setSize(t, e), this.children.forEach((i) => {
+    this.content && (this.content.style.width = t + Wi, this.content.style.height = e + Wi), this.bufferCanvas.setSize(t, e), this.bufferHitCanvas.setSize(t, e), this.children.forEach((i) => {
       i.setSize({ width: t, height: e }), i.draw();
     });
   }
@@ -3127,7 +3127,7 @@ class $e extends ht {
   }
 }
 $e.prototype.nodeType = mr;
-Q($e);
+tt($e);
 m.addGetterSetter($e, "container");
 E.isBrowser && document.addEventListener("visibilitychange", () => {
   me.forEach((r) => {
@@ -3403,7 +3403,7 @@ k.prototype._fillFuncHit = _r;
 k.prototype._strokeFuncHit = Pr;
 k.prototype._centroid = !1;
 k.prototype.nodeType = "Shape";
-Q(k);
+tt(k);
 k.prototype.eventListeners = {};
 k.prototype.on.call(k.prototype, "shadowColorChange.konva shadowBlurChange.konva shadowOffsetChange.konva shadowOpacityChange.konva shadowEnabledChange.konva", xr);
 k.prototype.on.call(k.prototype, "shadowColorChange.konva shadowOpacityChange.konva shadowEnabledChange.konva", Er);
@@ -3424,7 +3424,7 @@ m.addGetterSetter(k, "sceneFunc");
 m.addGetterSetter(k, "hitFunc");
 m.addGetterSetter(k, "dash");
 m.addGetterSetter(k, "dashOffset", 0, x());
-m.addGetterSetter(k, "shadowColor", void 0, Wt());
+m.addGetterSetter(k, "shadowColor", void 0, Vt());
 m.addGetterSetter(k, "shadowBlur", 0, x());
 m.addGetterSetter(k, "shadowOpacity", 1, x());
 m.addComponentsGetterSetter(k, "shadowOffset", ["x", "y"]);
@@ -3489,7 +3489,7 @@ m.addComponentsGetterSetter(k, "fillRadialGradientEndPoint", [
 m.addGetterSetter(k, "fillRadialGradientEndPointX", 0);
 m.addGetterSetter(k, "fillRadialGradientEndPointY", 0);
 m.addGetterSetter(k, "fillPatternRotation", 0);
-m.addGetterSetter(k, "fillRule", void 0, Wt());
+m.addGetterSetter(k, "fillRule", void 0, Vt());
 m.backCompat(k, {
   dashArray: "dash",
   getDashArray: "getDash",
@@ -3508,7 +3508,7 @@ const Rr = "beforeDraw", Ir = "draw", Jn = [
   { x: 1, y: 1 },
   { x: -1, y: 1 }
 ], Dr = Jn.length;
-class Vt extends ht {
+class Wt extends ht {
   constructor(t) {
     super(t), this.canvas = new Et(), this.hitCanvas = new Pi({
       pixelRatio: 1
@@ -3685,18 +3685,18 @@ class Vt extends ht {
     return C.releaseCanvas(this.getNativeCanvasElement(), this.getHitCanvas()._canvas), super.destroy();
   }
 }
-Vt.prototype.nodeType = "Layer";
-Q(Vt);
-m.addGetterSetter(Vt, "imageSmoothingEnabled", !0);
-m.addGetterSetter(Vt, "clearBeforeDraw", !0);
-m.addGetterSetter(Vt, "hitGraphEnabled", !0, ft());
-class Ai extends Vt {
+Wt.prototype.nodeType = "Layer";
+tt(Wt);
+m.addGetterSetter(Wt, "imageSmoothingEnabled", !0);
+m.addGetterSetter(Wt, "clearBeforeDraw", !0);
+m.addGetterSetter(Wt, "hitGraphEnabled", !0, ft());
+class Ai extends Wt {
   constructor(t) {
     super(t), this.listening(!1), C.warn('Konva.Fast layer is deprecated. Please use "new Konva.Layer({ listening: false })" instead.');
   }
 }
 Ai.prototype.nodeType = "FastLayer";
-Q(Ai);
+tt(Ai);
 class Jt extends ht {
   _validateAdd(t) {
     const e = t.getType();
@@ -3704,7 +3704,7 @@ class Jt extends ht {
   }
 }
 Jt.prototype.nodeType = "Group";
-Q(Jt);
+tt(Jt);
 const Je = function() {
   return zt.performance && zt.performance.now ? function() {
     return zt.performance.now();
@@ -3846,7 +3846,7 @@ class Hr {
     return (/* @__PURE__ */ new Date()).getTime();
   }
 }
-class j {
+class Z {
   constructor(t) {
     const e = this, i = t.node, n = i._id, s = t.easing || Se.Linear, a = !!t.yoyo;
     let o, l;
@@ -3856,7 +3856,7 @@ class j {
       e.tween.onEnterFrame();
     }, h), this.tween = new Hr(l, function(c) {
       e._tweenFunc(c);
-    }, s, 0, 1, o * 1e3, a), this._addListeners(), j.attrs[n] || (j.attrs[n] = {}), j.attrs[n][this._id] || (j.attrs[n][this._id] = {}), j.tweens[n] || (j.tweens[n] = {});
+    }, s, 0, 1, o * 1e3, a), this._addListeners(), Z.attrs[n] || (Z.attrs[n] = {}), Z.attrs[n][this._id] || (Z.attrs[n][this._id] = {}), Z.tweens[n] || (Z.tweens[n] = {});
     for (l in t)
       Gr[l] === void 0 && this._addAttr(l, t[l]);
     this.reset(), this.onFinish = t.onFinish, this.onReset = t.onReset, this.onUpdate = t.onUpdate;
@@ -3864,8 +3864,8 @@ class j {
   _addAttr(t, e) {
     const i = this.node, n = i._id;
     let s, a, o, l, h;
-    const c = j.tweens[n][t];
-    c && delete j.attrs[n][c][t];
+    const c = Z.tweens[n][t];
+    c && delete Z.attrs[n][c][t];
     let d = i.getAttr(t);
     if (C._isArray(e))
       if (s = [], a = Math.max(e.length, d.length), t === "points" && e.length !== d.length && (e.length > d.length ? (l = d, d = C._prepareArrayForTween(d, e, i.closed())) : (o = e, e = C._prepareArrayForTween(e, d, i.closed()))), t.indexOf("fill") === 0)
@@ -3890,16 +3890,16 @@ class j {
       b: h.b - d.b,
       a: h.a - d.a
     }) : s = e - d;
-    j.attrs[n][this._id][t] = {
+    Z.attrs[n][this._id][t] = {
       start: d,
       diff: s,
       end: e,
       trueEnd: o,
       trueStart: l
-    }, j.tweens[n][t] = this._id;
+    }, Z.tweens[n][t] = this._id;
   }
   _tweenFunc(t) {
-    const e = this.node, i = j.attrs[e._id][this._id];
+    const e = this.node, i = Z.attrs[e._id][this._id];
     let n, s, a, o, l, h, c, d;
     for (n in i) {
       if (s = i[n], a = s.start, o = s.diff, d = s.end, C._isArray(a))
@@ -3921,10 +3921,10 @@ class j {
     }, this.tween.onPause = () => {
       this.anim.stop();
     }, this.tween.onFinish = () => {
-      const t = this.node, e = j.attrs[t._id][this._id];
+      const t = this.node, e = Z.attrs[t._id][this._id];
       e.points && e.points.trueEnd && t.setAttr("points", e.points.trueEnd), this.onFinish && this.onFinish.call(this);
     }, this.tween.onReset = () => {
-      const t = this.node, e = j.attrs[t._id][this._id];
+      const t = this.node, e = Z.attrs[t._id][this._id];
       e.points && e.points.trueStart && t.points(e.points.trueStart), this.onReset && this.onReset();
     }, this.tween.onUpdate = () => {
       this.onUpdate && this.onUpdate.call(this);
@@ -3949,20 +3949,20 @@ class j {
     return this.tween.finish(), this;
   }
   destroy() {
-    const t = this.node._id, e = this._id, i = j.tweens[t];
+    const t = this.node._id, e = this._id, i = Z.tweens[t];
     this.pause(), this.anim && this.anim.stop();
     for (const n in i)
-      delete j.tweens[t][n];
-    delete j.attrs[t][e], j.tweens[t] && (Object.keys(j.tweens[t]).length === 0 && delete j.tweens[t], Object.keys(j.attrs[t]).length === 0 && delete j.attrs[t]);
+      delete Z.tweens[t][n];
+    delete Z.attrs[t][e], Z.tweens[t] && (Object.keys(Z.tweens[t]).length === 0 && delete Z.tweens[t], Object.keys(Z.attrs[t]).length === 0 && delete Z.attrs[t]);
   }
 }
-j.attrs = {};
-j.tweens = {};
+Z.attrs = {};
+Z.tweens = {};
 _.prototype.to = function(r) {
   const t = r.onFinish;
   r.node = this, r.onFinish = function() {
     this.destroy(), t && t();
-  }, new j(r).play();
+  }, new Z(r).play();
 };
 const Se = {
   BackEaseIn(r, t, e, i) {
@@ -4024,14 +4024,14 @@ const Se = {
   Container: ht,
   Stage: $e,
   stages: me,
-  Layer: Vt,
+  Layer: Wt,
   FastLayer: Ai,
   Group: Jt,
   DD: Y,
   Shape: k,
   shapes: ye,
   Animation: dt,
-  Tween: j,
+  Tween: Z,
   Easings: Se,
   Context: Xe,
   Canvas: _i
@@ -4071,7 +4071,7 @@ wt.prototype._attrsAffectingSize = [
   "angle",
   "clockwise"
 ];
-Q(wt);
+tt(wt);
 m.addGetterSetter(wt, "innerRadius", 0, x());
 m.addGetterSetter(wt, "outerRadius", 0, x());
 m.addGetterSetter(wt, "angle", 0, x());
@@ -4194,7 +4194,7 @@ class kt extends k {
 }
 kt.prototype.className = "Line";
 kt.prototype._attrsAffectingSize = ["points", "bezier", "tension"];
-Q(kt);
+tt(kt);
 m.addGetterSetter(kt, "closed", !1);
 m.addGetterSetter(kt, "bezier", !1);
 m.addGetterSetter(kt, "tension", 0, x());
@@ -4892,12 +4892,12 @@ const Nr = [
     0.0123412297999872,
     0.0123412297999872
   ]
-], Wr = [[1], [1, 1], [1, 2, 1], [1, 3, 3, 1]], ji = (r, t, e) => {
+], Vr = [[1], [1, 1], [1, 2, 1], [1, 3, 3, 1]], ji = (r, t, e) => {
   let i, n;
   const a = e / 2;
   i = 0;
   for (let o = 0; o < 20; o++)
-    n = a * Nr[20][o] + a, i += Fr[20][o] * Vr(r, t, n);
+    n = a * Nr[20][o] + a, i += Fr[20][o] * Wr(r, t, n);
   return a * i;
 }, Zi = (r, t, e) => {
   e === void 0 && (e = 1);
@@ -4907,7 +4907,7 @@ const Nr = [
   const c = l / (2 * o), d = h / o, u = e + c, p = d - c * c, g = u * u + p > 0 ? Math.sqrt(u * u + p) : 0, y = c * c + p > 0 ? Math.sqrt(c * c + p) : 0, T = c + Math.sqrt(c * c + p) !== 0 ? p * Math.log(Math.abs((u + g) / (c + y))) : 0;
   return Math.sqrt(o) / 2 * (u * g - c * y + T);
 };
-function Vr(r, t, e) {
+function Wr(r, t, e) {
   const i = pi(1, e, r), n = pi(1, e, t), s = i * i + n * n;
   return Math.sqrt(s);
 }
@@ -4919,7 +4919,7 @@ const pi = (r, t, e) => {
   if (r === 0) {
     s = 0;
     for (let a = 0; a <= i; a++)
-      s += Wr[i][a] * Math.pow(1 - t, i - a) * Math.pow(t, a) * e[a];
+      s += Vr[i][a] * Math.pow(1 - t, i - a) * Math.pow(t, a) * e[a];
     return s;
   } else {
     n = new Array(i);
@@ -4942,14 +4942,14 @@ const pi = (r, t, e) => {
   }
   return n;
 };
-class Z extends k {
+class J extends k {
   constructor(t) {
     super(t), this.dataArray = [], this.pathLength = 0, this._readDataAttribute(), this.on("dataChange.konva", function() {
       this._readDataAttribute();
     });
   }
   _readDataAttribute() {
-    this.dataArray = Z.parsePathData(this.data()), this.pathLength = Z.getPathLength(this.dataArray);
+    this.dataArray = J.parsePathData(this.data()), this.pathLength = J.getPathLength(this.dataArray);
   }
   _sceneFunc(t) {
     const e = this.dataArray;
@@ -4989,17 +4989,17 @@ class Z extends k {
         let u = Math.PI / 180;
         if (Math.abs(h - d) < u && (u = Math.abs(h - d)), c < 0)
           for (let p = h - u; p > d; p -= u) {
-            const g = Z.getPointOnEllipticalArc(l.points[0], l.points[1], l.points[2], l.points[3], p, 0);
+            const g = J.getPointOnEllipticalArc(l.points[0], l.points[1], l.points[2], l.points[3], p, 0);
             t.push(g.x, g.y);
           }
         else
           for (let p = h + u; p < d; p += u) {
-            const g = Z.getPointOnEllipticalArc(l.points[0], l.points[1], l.points[2], l.points[3], p, 0);
+            const g = J.getPointOnEllipticalArc(l.points[0], l.points[1], l.points[2], l.points[3], p, 0);
             t.push(g.x, g.y);
           }
       } else if (l.command === "C")
         for (let h = 0; h <= 1; h += 0.01) {
-          const c = Z.getPointOnCubicBezier(h, l.start.x, l.start.y, l.points[0], l.points[1], l.points[2], l.points[3], l.points[4], l.points[5]);
+          const c = J.getPointOnCubicBezier(h, l.start.x, l.start.y, l.points[0], l.points[1], l.points[2], l.points[3], l.points[4], l.points[5]);
           t.push(c.x, c.y);
         }
       else
@@ -5019,7 +5019,7 @@ class Z extends k {
     return this.pathLength;
   }
   getPointAtLength(t) {
-    return Z.getPointAtLengthOfDataArray(t, this.dataArray);
+    return J.getPointAtLengthOfDataArray(t, this.dataArray);
   }
   static getLineLength(t, e, i, n) {
     return Math.sqrt((i - t) * (i - t) + (n - e) * (n - e));
@@ -5052,15 +5052,15 @@ class Z extends k {
     const a = e[n], o = a.points;
     switch (a.command) {
       case "L":
-        return Z.getPointOnLine(t, a.start.x, a.start.y, o[0], o[1]);
+        return J.getPointOnLine(t, a.start.x, a.start.y, o[0], o[1]);
       case "C":
-        return Z.getPointOnCubicBezier(Ji(t, Z.getPathLength(e), (y) => ji([a.start.x, o[0], o[2], o[4]], [a.start.y, o[1], o[3], o[5]], y)), a.start.x, a.start.y, o[0], o[1], o[2], o[3], o[4], o[5]);
+        return J.getPointOnCubicBezier(Ji(t, J.getPathLength(e), (y) => ji([a.start.x, o[0], o[2], o[4]], [a.start.y, o[1], o[3], o[5]], y)), a.start.x, a.start.y, o[0], o[1], o[2], o[3], o[4], o[5]);
       case "Q":
-        return Z.getPointOnQuadraticBezier(Ji(t, Z.getPathLength(e), (y) => Zi([a.start.x, o[0], o[2]], [a.start.y, o[1], o[3]], y)), a.start.x, a.start.y, o[0], o[1], o[2], o[3]);
+        return J.getPointOnQuadraticBezier(Ji(t, J.getPathLength(e), (y) => Zi([a.start.x, o[0], o[2]], [a.start.y, o[1], o[3]], y)), a.start.x, a.start.y, o[0], o[1], o[2], o[3]);
       case "A":
         const l = o[0], h = o[1], c = o[2], d = o[3], u = o[5], p = o[6];
         let g = o[4];
-        return g += u * t / a.pathLength, Z.getPointOnEllipticalArc(l, h, c, d, g, p);
+        return g += u * t / a.pathLength, J.getPointOnEllipticalArc(l, h, c, d, g, p);
     }
     return null;
   }
@@ -5194,7 +5194,7 @@ class Z extends k {
       for (; g.length > 0 && !isNaN(g[0]); ) {
         let T = "", S = [];
         const v = o, b = l;
-        let w, L, P, I, A, D, z, W, B, V;
+        let w, L, P, I, A, D, z, V, B, W;
         switch (p) {
           case "l":
             o += g.shift(), l += g.shift(), T = "L", S.push(o, l);
@@ -5253,10 +5253,10 @@ class Z extends k {
             L = o, P = l, w = s[s.length - 1], w.command === "Q" && (L = o + (o - w.points[0]), P = l + (l - w.points[1])), o += g.shift(), l += g.shift(), T = "Q", S.push(L, P, o, l);
             break;
           case "A":
-            I = g.shift(), A = g.shift(), D = g.shift(), z = g.shift(), W = g.shift(), B = o, V = l, o = g.shift(), l = g.shift(), T = "A", S = this.convertEndpointToCenterParameterization(B, V, o, l, z, W, I, A, D);
+            I = g.shift(), A = g.shift(), D = g.shift(), z = g.shift(), V = g.shift(), B = o, W = l, o = g.shift(), l = g.shift(), T = "A", S = this.convertEndpointToCenterParameterization(B, W, o, l, z, V, I, A, D);
             break;
           case "a":
-            I = g.shift(), A = g.shift(), D = g.shift(), z = g.shift(), W = g.shift(), B = o, V = l, o += g.shift(), l += g.shift(), T = "A", S = this.convertEndpointToCenterParameterization(B, V, o, l, z, W, I, A, D);
+            I = g.shift(), A = g.shift(), D = g.shift(), z = g.shift(), V = g.shift(), B = o, W = l, o += g.shift(), l += g.shift(), T = "A", S = this.convertEndpointToCenterParameterization(B, W, o, l, z, V, I, A, D);
             break;
         }
         s.push({
@@ -5280,7 +5280,7 @@ class Z extends k {
   }
   static calcLength(t, e, i, n) {
     let s, a, o, l;
-    const h = Z;
+    const h = J;
     switch (i) {
       case "L":
         return h.getLineLength(t, e, n[0], n[1]);
@@ -5309,19 +5309,19 @@ class Z extends k {
     s === a && (g *= -1), isNaN(g) && (g = 0);
     const y = g * o * u / l, T = g * -l * d / o, S = (t + i) / 2 + Math.cos(c) * y - Math.sin(c) * T, v = (e + n) / 2 + Math.sin(c) * y + Math.cos(c) * T, b = function(z) {
       return Math.sqrt(z[0] * z[0] + z[1] * z[1]);
-    }, w = function(z, W) {
-      return (z[0] * W[0] + z[1] * W[1]) / (b(z) * b(W));
-    }, L = function(z, W) {
-      return (z[0] * W[1] < z[1] * W[0] ? -1 : 1) * Math.acos(w(z, W));
+    }, w = function(z, V) {
+      return (z[0] * V[0] + z[1] * V[1]) / (b(z) * b(V));
+    }, L = function(z, V) {
+      return (z[0] * V[1] < z[1] * V[0] ? -1 : 1) * Math.acos(w(z, V));
     }, P = L([1, 0], [(d - y) / o, (u - T) / l]), I = [(d - y) / o, (u - T) / l], A = [(-1 * d - y) / o, (-1 * u - T) / l];
     let D = L(I, A);
     return w(I, A) <= -1 && (D = Math.PI), w(I, A) >= 1 && (D = 0), a === 0 && D > 0 && (D = D - 2 * Math.PI), a === 1 && D < 0 && (D = D + 2 * Math.PI), [S, v, o, l, P, D, c, a];
   }
 }
-Z.prototype.className = "Path";
-Z.prototype._attrsAffectingSize = ["data"];
-Q(Z);
-m.addGetterSetter(Z, "data");
+J.prototype.className = "Path";
+J.prototype._attrsAffectingSize = ["data"];
+tt(J);
+m.addGetterSetter(J, "data");
 class Yt extends kt {
   _sceneFunc(t) {
     super._sceneFunc(t);
@@ -5339,7 +5339,7 @@ class Yt extends kt {
         n[n.length - 1],
         i[o - 2],
         i[o - 1]
-      ], p = Z.calcLength(n[n.length - 4], n[n.length - 3], "C", u), g = Z.getPointOnQuadraticBezier(Math.min(1, 1 - a / p), u[0], u[1], u[2], u[3], u[4], u[5]);
+      ], p = J.calcLength(n[n.length - 4], n[n.length - 3], "C", u), g = J.getPointOnQuadraticBezier(Math.min(1, 1 - a / p), u[0], u[1], u[2], u[3], u[4], u[5]);
       l = i[o - 2] - g.x, h = i[o - 1] - g.y;
     } else
       l = i[o - 2] - i[o - 4], h = i[o - 1] - i[o - 3];
@@ -5361,7 +5361,7 @@ class Yt extends kt {
   }
 }
 Yt.prototype.className = "Arrow";
-Q(Yt);
+tt(Yt);
 m.addGetterSetter(Yt, "pointerLength", 10, x());
 m.addGetterSetter(Yt, "pointerWidth", 10, x());
 m.addGetterSetter(Yt, "pointerAtBeginning", !1);
@@ -5386,7 +5386,7 @@ class Qt extends k {
 Qt.prototype._centroid = !0;
 Qt.prototype.className = "Circle";
 Qt.prototype._attrsAffectingSize = ["radius"];
-Q(Qt);
+tt(Qt);
 m.addGetterSetter(Qt, "radius", 0, x());
 class Rt extends k {
   _sceneFunc(t) {
@@ -5409,7 +5409,7 @@ class Rt extends k {
 Rt.prototype.className = "Ellipse";
 Rt.prototype._centroid = !0;
 Rt.prototype._attrsAffectingSize = ["radiusX", "radiusY"];
-Q(Rt);
+tt(Rt);
 m.addComponentsGetterSetter(Rt, "radius", ["x", "y"]);
 m.addGetterSetter(Rt, "radiusX", 0, x());
 m.addGetterSetter(Rt, "radiusY", 0, x());
@@ -5478,7 +5478,7 @@ let gt = class Qn extends k {
 };
 gt.prototype.className = "Image";
 gt.prototype._attrsAffectingSize = ["image"];
-Q(gt);
+tt(gt);
 m.addGetterSetter(gt, "cornerRadius", 0, Ue(4));
 m.addGetterSetter(gt, "image");
 m.addComponentsGetterSetter(gt, "crop", ["x", "y", "width", "height"]);
@@ -5555,7 +5555,7 @@ class Li extends Jt {
   }
 }
 Li.prototype.className = "Label";
-Q(Li);
+tt(Li);
 class Xt extends k {
   _sceneFunc(t) {
     const e = this.width(), i = this.height(), n = this.pointerDirection(), s = this.pointerWidth(), a = this.pointerHeight(), o = this.cornerRadius();
@@ -5573,7 +5573,7 @@ class Xt extends k {
   }
 }
 Xt.prototype.className = "Tag";
-Q(Xt);
+tt(Xt);
 m.addGetterSetter(Xt, "pointerDirection", Xr);
 m.addGetterSetter(Xt, "pointerWidth", 0, x());
 m.addGetterSetter(Xt, "pointerHeight", 0, x());
@@ -5585,7 +5585,7 @@ class be extends k {
   }
 }
 be.prototype.className = "Rect";
-Q(be);
+tt(be);
 m.addGetterSetter(be, "cornerRadius", 0, Ue(4));
 class It extends k {
   _sceneFunc(t) {
@@ -5636,7 +5636,7 @@ class It extends k {
 It.prototype.className = "RegularPolygon";
 It.prototype._centroid = !0;
 It.prototype._attrsAffectingSize = ["radius"];
-Q(It);
+tt(It);
 m.addGetterSetter(It, "radius", 0, x());
 m.addGetterSetter(It, "sides", 0, x());
 m.addGetterSetter(It, "cornerRadius", 0, Ue(4));
@@ -5661,7 +5661,7 @@ class Ut extends k {
 Ut.prototype.className = "Ring";
 Ut.prototype._centroid = !0;
 Ut.prototype._attrsAffectingSize = ["innerRadius", "outerRadius"];
-Q(Ut);
+tt(Ut);
 m.addGetterSetter(Ut, "innerRadius", 0, x());
 m.addGetterSetter(Ut, "outerRadius", 0, x());
 class St extends k {
@@ -5722,7 +5722,7 @@ class St extends k {
   }
 }
 St.prototype.className = "Sprite";
-Q(St);
+tt(St);
 m.addGetterSetter(St, "animation");
 m.addGetterSetter(St, "animations");
 m.addGetterSetter(St, "frameOffsets");
@@ -5760,7 +5760,7 @@ class Dt extends k {
 Dt.prototype.className = "Star";
 Dt.prototype._centroid = !0;
 Dt.prototype._attrsAffectingSize = ["innerRadius", "outerRadius"];
-Q(Dt);
+tt(Dt);
 m.addGetterSetter(Dt, "numPoints", 5, x());
 m.addGetterSetter(Dt, "innerRadius", 0, x());
 m.addGetterSetter(Dt, "outerRadius", 0, x());
@@ -5810,7 +5810,7 @@ function oa(r) {
 function la(r) {
   return r = r || {}, !r.fillLinearGradientColorStops && !r.fillRadialGradientColorStops && !r.fillPatternImage && (r.fill = r.fill || "black"), r;
 }
-class J extends k {
+class Q extends k {
   constructor(t) {
     super(la(t)), this._partialTextX = 0, this._partialTextY = 0;
     for (let e = 0; e < sa; e++)
@@ -5833,32 +5833,32 @@ class J extends k {
     }
     for (c === nn && t.setAttr("direction", c), t.setAttr("font", this._getContextFont()), t.setAttr("textBaseline", I), t.setAttr("textAlign", is), h === en ? d = (this.getHeight() - s * l - a * 2) / 2 : h === Qr && (d = this.getHeight() - s * l - a * 2), t.translate(a, d + a), L = 0; L < s; L++) {
       let A = 0, D = 0;
-      const z = n[L], W = z.text, B = z.width, V = z.lastInParagraph;
+      const z = n[L], V = z.text, B = z.width, W = z.lastInParagraph;
       if (t.save(), u === ea ? A += p - B - a * 2 : u === $r && (A += (p - B - a * 2) / 2), b) {
         t.save(), t.beginPath();
-        const H = v ?? (E.legacyTextRendering ? Math.round(o / 2) : Math.round(o / 4)), M = A, K = P + D + H;
-        t.moveTo(M, K);
-        const G = u === se && !V ? p - a * 2 : B;
-        t.lineTo(M + Math.round(G), K), t.lineWidth = o / 15;
-        const $ = this._getLinearGradient();
-        t.strokeStyle = $ || T, t.stroke(), t.restore();
+        const H = v ?? (E.legacyTextRendering ? Math.round(o / 2) : Math.round(o / 4)), M = A, j = P + D + H;
+        t.moveTo(M, j);
+        const G = u === se && !W ? p - a * 2 : B;
+        t.lineTo(M + Math.round(G), j), t.lineWidth = o / 15;
+        const q = this._getLinearGradient();
+        t.strokeStyle = q || T, t.stroke(), t.restore();
       }
       const N = A;
       if (c !== nn && (g !== 0 || u === se || y)) {
-        const H = W.split(" ").length - 1, M = xt(W);
-        for (let K = 0; K < M.length; K++) {
-          const G = M[K];
-          if (G === " " && !V && u === se && (A += (p - a * 2 - B) / H), this._partialTextX = A, this._partialTextY = P + D, this._partialText = G, y) {
+        const H = V.split(" ").length - 1, M = xt(V);
+        for (let j = 0; j < M.length; j++) {
+          const G = M[j];
+          if (G === " " && !W && u === se && (A += (p - a * 2 - B) / H), this._partialTextX = A, this._partialTextY = P + D, this._partialText = G, y) {
             t.save();
-            const it = n.slice(0, L).reduce((tt, ot) => tt + xt(ot.text).length, 0), U = K + it;
+            const nt = n.slice(0, L).reduce((et, ot) => et + xt(ot.text).length, 0), U = j + nt;
             y({
               char: G,
               index: U,
               x: A,
               y: P + D,
               lineIndex: L,
-              column: K,
-              isLastInLine: V,
+              column: j,
+              isLastInLine: W,
               width: this.measureSize(G).width,
               context: t
             });
@@ -5866,13 +5866,13 @@ class J extends k {
           t.fillStrokeShape(this), y && t.restore(), A += this.measureSize(G).width + g;
         }
       } else
-        g !== 0 && t.setAttr("letterSpacing", `${g}px`), this._partialTextX = A, this._partialTextY = P + D, this._partialText = W, t.fillStrokeShape(this);
+        g !== 0 && t.setAttr("letterSpacing", `${g}px`), this._partialTextX = A, this._partialTextY = P + D, this._partialText = V, t.fillStrokeShape(this);
       if (w) {
         t.save(), t.beginPath();
         const H = E.legacyTextRendering ? 0 : -Math.round(o / 4), M = N;
         t.moveTo(M, P + D + H);
-        const K = u === se && !V ? p - a * 2 : B;
-        t.lineTo(M + Math.round(K), P + D + H), t.lineWidth = o / 15;
+        const j = u === se && !W ? p - a * 2 : B;
+        t.lineTo(M + Math.round(j), P + D + H), t.lineWidth = o / 15;
         const G = this._getLinearGradient();
         t.strokeStyle = G || T, t.stroke(), t.restore();
       }
@@ -5947,18 +5947,18 @@ class J extends k {
         for (; w.length > 0; ) {
           let P = 0, I = xt(w).length, A = "", D = 0;
           for (; P < I; ) {
-            const z = P + I >>> 1, W = xt(w), B = W.slice(0, z + 1).join(""), V = this._getTextWidth(B);
-            (T && l && u + n > d ? V + S : V) <= c ? (P = z + 1, A = B, D = V) : I = z;
+            const z = P + I >>> 1, V = xt(w), B = V.slice(0, z + 1).join(""), W = this._getTextWidth(B);
+            (T && l && u + n > d ? W + S : W) <= c ? (P = z + 1, A = B, D = W) : I = z;
           }
           if (A) {
             if (y) {
-              const B = xt(w), V = xt(A), N = B[V.length], H = N === Re || N === tn;
+              const B = xt(w), W = xt(A), N = B[W.length], H = N === Re || N === tn;
               let M;
               if (H && D <= c)
-                M = V.length;
+                M = W.length;
               else {
-                const K = V.lastIndexOf(Re), G = V.lastIndexOf(tn);
-                M = Math.max(K, G) + 1;
+                const j = W.lastIndexOf(Re), G = W.lastIndexOf(tn);
+                M = Math.max(j, G) + 1;
               }
               M > 0 && (P = M, A = B.slice(0, P).join(""), D = this._getTextWidth(A));
             }
@@ -5996,10 +5996,10 @@ class J extends k {
     return t && e ? !0 : super._useBufferCanvas();
   }
 }
-J.prototype._fillFunc = aa;
-J.prototype._strokeFunc = oa;
-J.prototype.className = Zr;
-J.prototype._attrsAffectingSize = [
+Q.prototype._fillFunc = aa;
+Q.prototype._strokeFunc = oa;
+Q.prototype.className = Zr;
+Q.prototype._attrsAffectingSize = [
   "text",
   "fontSize",
   "padding",
@@ -6007,25 +6007,25 @@ J.prototype._attrsAffectingSize = [
   "lineHeight",
   "letterSpacing"
 ];
-Q(J);
-m.overWriteSetter(J, "width", xi());
-m.overWriteSetter(J, "height", xi());
-m.addGetterSetter(J, "direction", es);
-m.addGetterSetter(J, "fontFamily", "Arial");
-m.addGetterSetter(J, "fontSize", 12, x());
-m.addGetterSetter(J, "fontStyle", ns);
-m.addGetterSetter(J, "fontVariant", ns);
-m.addGetterSetter(J, "padding", 0, x());
-m.addGetterSetter(J, "align", is);
-m.addGetterSetter(J, "verticalAlign", Jr);
-m.addGetterSetter(J, "lineHeight", 1, x());
-m.addGetterSetter(J, "wrap", ia);
-m.addGetterSetter(J, "ellipsis", !1, ft());
-m.addGetterSetter(J, "letterSpacing", 0, x());
-m.addGetterSetter(J, "text", "", Wt());
-m.addGetterSetter(J, "textDecoration", "");
-m.addGetterSetter(J, "underlineOffset", void 0, x());
-m.addGetterSetter(J, "charRenderFunc", void 0);
+tt(Q);
+m.overWriteSetter(Q, "width", xi());
+m.overWriteSetter(Q, "height", xi());
+m.addGetterSetter(Q, "direction", es);
+m.addGetterSetter(Q, "fontFamily", "Arial");
+m.addGetterSetter(Q, "fontSize", 12, x());
+m.addGetterSetter(Q, "fontStyle", ns);
+m.addGetterSetter(Q, "fontVariant", ns);
+m.addGetterSetter(Q, "padding", 0, x());
+m.addGetterSetter(Q, "align", is);
+m.addGetterSetter(Q, "verticalAlign", Jr);
+m.addGetterSetter(Q, "lineHeight", 1, x());
+m.addGetterSetter(Q, "wrap", ia);
+m.addGetterSetter(Q, "ellipsis", !1, ft());
+m.addGetterSetter(Q, "letterSpacing", 0, x());
+m.addGetterSetter(Q, "text", "", Vt());
+m.addGetterSetter(Q, "textDecoration", "");
+m.addGetterSetter(Q, "underlineOffset", void 0, x());
+m.addGetterSetter(Q, "charRenderFunc", void 0);
 const ha = "", rs = "normal";
 function as(r) {
   r.fillText(this.partialText, 0, 0);
@@ -6033,23 +6033,23 @@ function as(r) {
 function os(r) {
   r.strokeText(this.partialText, 0, 0);
 }
-class nt extends k {
+class st extends k {
   constructor(t) {
     super(t), this.dummyCanvas = C.createCanvasElement(), this.dataArray = [], this._readDataAttribute(), this.on("dataChange.konva", function() {
       this._readDataAttribute(), this._setTextData();
     }), this.on("textChange.konva alignChange.konva letterSpacingChange.konva kerningFuncChange.konva fontSizeChange.konva fontFamilyChange.konva", this._setTextData), this._setTextData();
   }
   _getTextPathLength() {
-    return Z.getPathLength(this.dataArray);
+    return J.getPathLength(this.dataArray);
   }
   _getPointAtLength(t) {
     if (!this.attrs.data)
       return null;
     const e = this.pathLength;
-    return t > e ? null : Z.getPointAtLengthOfDataArray(t, this.dataArray);
+    return t > e ? null : J.getPointAtLengthOfDataArray(t, this.dataArray);
   }
   _readDataAttribute() {
-    this.dataArray = Z.parsePathData(this.attrs.data), this.pathLength = this._getTextPathLength();
+    this.dataArray = J.parsePathData(this.attrs.data), this.pathLength = this._getTextPathLength();
   }
   _sceneFunc(t) {
     t.setAttr("font", this._getContextFont()), t.setAttr("textBaseline", this.textBaseline()), t.setAttr("textAlign", "left"), t.save();
@@ -6091,10 +6091,10 @@ class nt extends k {
     return C.warn("text.getTextHeight() method is deprecated. Use text.height() - for full height and text.fontSize() - for one line height."), this.textHeight;
   }
   setText(t) {
-    return J.prototype.setText.call(this, t);
+    return Q.prototype.setText.call(this, t);
   }
   _getContextFont() {
-    return J.prototype._getContextFont.call(this);
+    return Q.prototype._getContextFont.call(this);
   }
   _getTextSize(t) {
     const i = this.dummyCanvas.getContext("2d");
@@ -6133,7 +6133,7 @@ class nt extends k {
       const y = this._getPointAtLength(c + g);
       if (!y)
         return;
-      const T = Z.getLineLength(u.x, u.y, y.x, y.y);
+      const T = J.getLineLength(u.x, u.y, y.x, y.y);
       let S = 0;
       if (o)
         try {
@@ -6142,7 +6142,7 @@ class nt extends k {
           S = 0;
         }
       u.x += S, y.x += S, this.textWidth += S;
-      const v = Z.getPointOnLine(S + T / 2, u.x, u.y, y.x, y.y), b = Math.atan2(y.y - u.y, y.x - u.x);
+      const v = J.getPointOnLine(S + T / 2, u.x, u.y, y.x, y.y), b = Math.atan2(y.y - u.y, y.x - u.x);
       this.glyphInfo.push({
         transposeX: v.x,
         transposeY: v.y,
@@ -6181,24 +6181,24 @@ class nt extends k {
     return C.releaseCanvas(this.dummyCanvas), super.destroy();
   }
 }
-nt.prototype._fillFunc = as;
-nt.prototype._strokeFunc = os;
-nt.prototype._fillFuncHit = as;
-nt.prototype._strokeFuncHit = os;
-nt.prototype.className = "TextPath";
-nt.prototype._attrsAffectingSize = ["text", "fontSize", "data"];
-Q(nt);
-m.addGetterSetter(nt, "data");
-m.addGetterSetter(nt, "fontFamily", "Arial");
-m.addGetterSetter(nt, "fontSize", 12, x());
-m.addGetterSetter(nt, "fontStyle", rs);
-m.addGetterSetter(nt, "align", "left");
-m.addGetterSetter(nt, "letterSpacing", 0, x());
-m.addGetterSetter(nt, "textBaseline", "middle");
-m.addGetterSetter(nt, "fontVariant", rs);
-m.addGetterSetter(nt, "text", ha);
-m.addGetterSetter(nt, "textDecoration", "");
-m.addGetterSetter(nt, "kerningFunc", void 0);
+st.prototype._fillFunc = as;
+st.prototype._strokeFunc = os;
+st.prototype._fillFuncHit = as;
+st.prototype._strokeFuncHit = os;
+st.prototype.className = "TextPath";
+st.prototype._attrsAffectingSize = ["text", "fontSize", "data"];
+tt(st);
+m.addGetterSetter(st, "data");
+m.addGetterSetter(st, "fontFamily", "Arial");
+m.addGetterSetter(st, "fontSize", 12, x());
+m.addGetterSetter(st, "fontStyle", rs);
+m.addGetterSetter(st, "align", "left");
+m.addGetterSetter(st, "letterSpacing", 0, x());
+m.addGetterSetter(st, "textBaseline", "middle");
+m.addGetterSetter(st, "fontVariant", rs);
+m.addGetterSetter(st, "text", ha);
+m.addGetterSetter(st, "textDecoration", "");
+m.addGetterSetter(st, "kerningFunc", void 0);
 const ls = "tr-konva", ca = [
   "resizeEnabledChange",
   "rotateAnchorOffsetChange",
@@ -6808,7 +6808,7 @@ function Sa(r) {
   }), r || [];
 }
 F.prototype.className = "Transformer";
-Q(F);
+tt(F);
 m.addGetterSetter(F, "enabledAnchors", Ye, Sa);
 m.addGetterSetter(F, "flipEnabled", !0, ft());
 m.addGetterSetter(F, "resizeEnabled", !0);
@@ -6865,7 +6865,7 @@ class _t extends k {
 _t.prototype.className = "Wedge";
 _t.prototype._centroid = !0;
 _t.prototype._attrsAffectingSize = ["radius"];
-Q(_t);
+tt(_t);
 m.addGetterSetter(_t, "radius", 0, x());
 m.addGetterSetter(_t, "angle", 0, x());
 m.addGetterSetter(_t, "clockwise", !1);
@@ -7393,32 +7393,32 @@ const Ca = [
 function va(r, t) {
   const e = r.data, i = r.width, n = r.height;
   let s, a, o, l, h, c, d, u, p, g, y, T, S, v, b, w, L, P, I, A;
-  const D = t + t + 1, z = i - 1, W = n - 1, B = t + 1, V = B * (B + 1) / 2, N = new an(), H = Ca[t], M = Ta[t];
-  let K = null, G = N, $ = null, it = null;
+  const D = t + t + 1, z = i - 1, V = n - 1, B = t + 1, W = B * (B + 1) / 2, N = new an(), H = Ca[t], M = Ta[t];
+  let j = null, G = N, q = null, nt = null;
   for (let U = 1; U < D; U++)
-    G = G.next = new an(), U === B && (K = G);
+    G = G.next = new an(), U === B && (j = G);
   G.next = N, o = a = 0;
   for (let U = 0; U < n; U++) {
-    T = S = v = b = l = h = c = d = 0, u = B * (w = e[a]), p = B * (L = e[a + 1]), g = B * (P = e[a + 2]), y = B * (I = e[a + 3]), l += V * w, h += V * L, c += V * P, d += V * I, G = N;
-    for (let tt = 0; tt < B; tt++)
+    T = S = v = b = l = h = c = d = 0, u = B * (w = e[a]), p = B * (L = e[a + 1]), g = B * (P = e[a + 2]), y = B * (I = e[a + 3]), l += W * w, h += W * L, c += W * P, d += W * I, G = N;
+    for (let et = 0; et < B; et++)
       G.r = w, G.g = L, G.b = P, G.a = I, G = G.next;
-    for (let tt = 1; tt < B; tt++)
-      s = a + ((z < tt ? z : tt) << 2), l += (G.r = w = e[s]) * (A = B - tt), h += (G.g = L = e[s + 1]) * A, c += (G.b = P = e[s + 2]) * A, d += (G.a = I = e[s + 3]) * A, T += w, S += L, v += P, b += I, G = G.next;
-    $ = N, it = K;
-    for (let tt = 0; tt < i; tt++)
-      e[a + 3] = I = d * H >> M, I !== 0 ? (I = 255 / I, e[a] = (l * H >> M) * I, e[a + 1] = (h * H >> M) * I, e[a + 2] = (c * H >> M) * I) : e[a] = e[a + 1] = e[a + 2] = 0, l -= u, h -= p, c -= g, d -= y, u -= $.r, p -= $.g, g -= $.b, y -= $.a, s = o + ((s = tt + t + 1) < z ? s : z) << 2, T += $.r = e[s], S += $.g = e[s + 1], v += $.b = e[s + 2], b += $.a = e[s + 3], l += T, h += S, c += v, d += b, $ = $.next, u += w = it.r, p += L = it.g, g += P = it.b, y += I = it.a, T -= w, S -= L, v -= P, b -= I, it = it.next, a += 4;
+    for (let et = 1; et < B; et++)
+      s = a + ((z < et ? z : et) << 2), l += (G.r = w = e[s]) * (A = B - et), h += (G.g = L = e[s + 1]) * A, c += (G.b = P = e[s + 2]) * A, d += (G.a = I = e[s + 3]) * A, T += w, S += L, v += P, b += I, G = G.next;
+    q = N, nt = j;
+    for (let et = 0; et < i; et++)
+      e[a + 3] = I = d * H >> M, I !== 0 ? (I = 255 / I, e[a] = (l * H >> M) * I, e[a + 1] = (h * H >> M) * I, e[a + 2] = (c * H >> M) * I) : e[a] = e[a + 1] = e[a + 2] = 0, l -= u, h -= p, c -= g, d -= y, u -= q.r, p -= q.g, g -= q.b, y -= q.a, s = o + ((s = et + t + 1) < z ? s : z) << 2, T += q.r = e[s], S += q.g = e[s + 1], v += q.b = e[s + 2], b += q.a = e[s + 3], l += T, h += S, c += v, d += b, q = q.next, u += w = nt.r, p += L = nt.g, g += P = nt.b, y += I = nt.a, T -= w, S -= L, v -= P, b -= I, nt = nt.next, a += 4;
     o += i;
   }
   for (let U = 0; U < i; U++) {
-    S = v = b = T = h = c = d = l = 0, a = U << 2, u = B * (w = e[a]), p = B * (L = e[a + 1]), g = B * (P = e[a + 2]), y = B * (I = e[a + 3]), l += V * w, h += V * L, c += V * P, d += V * I, G = N;
+    S = v = b = T = h = c = d = l = 0, a = U << 2, u = B * (w = e[a]), p = B * (L = e[a + 1]), g = B * (P = e[a + 2]), y = B * (I = e[a + 3]), l += W * w, h += W * L, c += W * P, d += W * I, G = N;
     for (let ot = 0; ot < B; ot++)
       G.r = w, G.g = L, G.b = P, G.a = I, G = G.next;
-    let tt = i;
+    let et = i;
     for (let ot = 1; ot <= t; ot++)
-      a = tt + U << 2, l += (G.r = w = e[a]) * (A = B - ot), h += (G.g = L = e[a + 1]) * A, c += (G.b = P = e[a + 2]) * A, d += (G.a = I = e[a + 3]) * A, T += w, S += L, v += P, b += I, G = G.next, ot < W && (tt += i);
-    a = U, $ = N, it = K;
+      a = et + U << 2, l += (G.r = w = e[a]) * (A = B - ot), h += (G.g = L = e[a + 1]) * A, c += (G.b = P = e[a + 2]) * A, d += (G.a = I = e[a + 3]) * A, T += w, S += L, v += P, b += I, G = G.next, ot < V && (et += i);
+    a = U, q = N, nt = j;
     for (let ot = 0; ot < n; ot++)
-      s = a << 2, e[s + 3] = I = d * H >> M, I > 0 ? (I = 255 / I, e[s] = (l * H >> M) * I, e[s + 1] = (h * H >> M) * I, e[s + 2] = (c * H >> M) * I) : e[s] = e[s + 1] = e[s + 2] = 0, l -= u, h -= p, c -= g, d -= y, u -= $.r, p -= $.g, g -= $.b, y -= $.a, s = U + ((s = ot + B) < W ? s : W) * i << 2, l += T += $.r = e[s], h += S += $.g = e[s + 1], c += v += $.b = e[s + 2], d += b += $.a = e[s + 3], $ = $.next, u += w = it.r, p += L = it.g, g += P = it.b, y += I = it.a, T -= w, S -= L, v -= P, b -= I, it = it.next, a += i;
+      s = a << 2, e[s + 3] = I = d * H >> M, I > 0 ? (I = 255 / I, e[s] = (l * H >> M) * I, e[s + 1] = (h * H >> M) * I, e[s + 2] = (c * H >> M) * I) : e[s] = e[s + 1] = e[s + 2] = 0, l -= u, h -= p, c -= g, d -= y, u -= q.r, p -= q.g, g -= q.b, y -= q.a, s = U + ((s = ot + B) < V ? s : V) * i << 2, l += T += q.r = e[s], h += S += q.g = e[s + 1], c += v += q.b = e[s + 2], d += b += q.a = e[s + 3], q = q.next, u += w = nt.r, p += L = nt.g, g += P = nt.b, y += I = nt.a, T -= w, S -= L, v -= P, b -= I, nt = nt.next, a += i;
   }
 }
 const ba = function(t) {
@@ -7457,18 +7457,18 @@ const Pa = function(r) {
   }[(a = (s = this.embossDirection) === null || s === void 0 ? void 0 : s.call(this)) !== null && a !== void 0 ? a : "top-left"]) !== null && o !== void 0 ? o : 315, S = !!((h = (l = this.embossBlend) === null || l === void 0 ? void 0 : l.call(this)) !== null && h !== void 0 && h), v = p * 10, b = g * 255, w = T * Math.PI / 180, L = Math.cos(w), P = Math.sin(w), I = 128 / 1020 * v, A = new Uint8ClampedArray(c), D = new Float32Array(d * u);
   for (let N = 0, H = 0; H < c.length; H += 4, N++)
     D[N] = 0.2126 * A[H] + 0.7152 * A[H + 1] + 0.0722 * A[H + 2];
-  const z = [-1, 0, 1, -2, 0, 2, -1, 0, 1], W = [-1, -2, -1, 0, 0, 0, 1, 2, 1], B = [-d - 1, -d, -d + 1, -1, 0, 1, d - 1, d, d + 1], V = (N) => N < 0 ? 0 : N > 255 ? 255 : N;
+  const z = [-1, 0, 1, -2, 0, 2, -1, 0, 1], V = [-1, -2, -1, 0, 0, 0, 1, 2, 1], B = [-d - 1, -d, -d + 1, -1, 0, 1, d - 1, d, d + 1], W = (N) => N < 0 ? 0 : N > 255 ? 255 : N;
   for (let N = 1; N < u - 1; N++)
     for (let H = 1; H < d - 1; H++) {
       const M = N * d + H;
-      let K = 0, G = 0;
-      K += D[M + B[0]] * z[0], G += D[M + B[0]] * W[0], K += D[M + B[1]] * z[1], G += D[M + B[1]] * W[1], K += D[M + B[2]] * z[2], G += D[M + B[2]] * W[2], K += D[M + B[3]] * z[3], G += D[M + B[3]] * W[3], K += D[M + B[5]] * z[5], G += D[M + B[5]] * W[5], K += D[M + B[6]] * z[6], G += D[M + B[6]] * W[6], K += D[M + B[7]] * z[7], G += D[M + B[7]] * W[7], K += D[M + B[8]] * z[8], G += D[M + B[8]] * W[8];
-      const $ = L * K + P * G, it = V(b + $ * I), U = M * 4;
+      let j = 0, G = 0;
+      j += D[M + B[0]] * z[0], G += D[M + B[0]] * V[0], j += D[M + B[1]] * z[1], G += D[M + B[1]] * V[1], j += D[M + B[2]] * z[2], G += D[M + B[2]] * V[2], j += D[M + B[3]] * z[3], G += D[M + B[3]] * V[3], j += D[M + B[5]] * z[5], G += D[M + B[5]] * V[5], j += D[M + B[6]] * z[6], G += D[M + B[6]] * V[6], j += D[M + B[7]] * z[7], G += D[M + B[7]] * V[7], j += D[M + B[8]] * z[8], G += D[M + B[8]] * V[8];
+      const q = L * j + P * G, nt = W(b + q * I), U = M * 4;
       if (S) {
-        const tt = it - b;
-        c[U] = V(A[U] + tt), c[U + 1] = V(A[U + 1] + tt), c[U + 2] = V(A[U + 2] + tt), c[U + 3] = A[U + 3];
+        const et = nt - b;
+        c[U] = W(A[U] + et), c[U + 1] = W(A[U + 1] + et), c[U + 2] = W(A[U + 2] + et), c[U + 3] = A[U + 3];
       } else
-        c[U] = c[U + 1] = c[U + 2] = it, c[U + 3] = A[U + 3];
+        c[U] = c[U + 1] = c[U + 2] = nt, c[U + 3] = A[U + 3];
     }
   for (let N = 0; N < d; N++) {
     let H = N * 4, M = ((u - 1) * d + N) * 4;
@@ -7711,13 +7711,13 @@ const Fa = function(r) {
   return e && (e = Ha(e, r.width, r.height), e = za(e, r.width, r.height), e = Na(e, r.width, r.height), Ba(r, e)), r;
 };
 m.addGetterSetter(_, "threshold", 0, x(), m.afterSetFilter);
-const Wa = function(r) {
+const Va = function(r) {
   const t = this.noise() * 255, e = r.data, i = e.length, n = t / 2;
   for (let s = 0; s < i; s += 4)
     e[s + 0] += n - 2 * n * Math.random(), e[s + 1] += n - 2 * n * Math.random(), e[s + 2] += n - 2 * n * Math.random();
 };
 m.addGetterSetter(_, "noise", 0.2, x(), m.afterSetFilter);
-const Va = function(r) {
+const Wa = function(r) {
   let t = Math.ceil(this.pixelSize()), e = r.width, i = r.height, n = Math.ceil(e / t), s = Math.ceil(i / t), a = r.data;
   if (t <= 0) {
     C.error("pixelSize value can not be <= 0");
@@ -7813,14 +7813,14 @@ const X = qi.Util._assign(qi, {
   Label: Li,
   Tag: Xt,
   Line: kt,
-  Path: Z,
+  Path: J,
   Rect: be,
   RegularPolygon: It,
   Ring: Ut,
   Sprite: St,
   Star: Dt,
-  Text: J,
-  TextPath: nt,
+  Text: Q,
+  TextPath: st,
   Transformer: F,
   Wedge: _t,
   Filters: {
@@ -7836,8 +7836,8 @@ const X = qi.Util._assign(qi, {
     Invert: Ma,
     Kaleidoscope: Da,
     Mask: Fa,
-    Noise: Wa,
-    Pixelate: Va,
+    Noise: Va,
+    Pixelate: Wa,
     Posterize: Ya,
     RGB: Xa,
     RGBA: Ua,
@@ -8326,7 +8326,7 @@ function ho(r, t, e) {
   p.ellipsis(!0), p.width(s), p.height(dn), p.name("clip-label"), r.add(p);
 }
 function gs(r, t) {
-  const e = t.width <= Ve, i = us(t.theme, t.isSelected, t.clipType);
+  const e = t.width <= We, i = us(t.theme, t.isSelected, t.clipType);
   if (r.destroyChildren(), e) {
     ao(r, t.width, t.height, i);
     return;
@@ -8338,7 +8338,7 @@ function gs(r, t) {
   oo(r, t, i);
 }
 function co(r, t) {
-  if (t.width <= Ve || t.clipType !== "video")
+  if (t.width <= We || t.clipType !== "video")
     return !1;
   const i = us(t.theme, t.isSelected, t.clipType);
   return lo(r, t, i);
@@ -8439,7 +8439,7 @@ function So(r, t, e, i, n, s) {
     a.add(bi([0, o, i, o], "#E0E0E0", 0.5));
   r.add(a);
 }
-class et {
+class it {
   /**
    * 创建舞台
    */
@@ -8602,7 +8602,7 @@ class et {
   }
 }
 // 定义拉伸交互区域宽度常量
-f(et, "RESIZE_AREA_WIDTH", 3);
+f(it, "RESIZE_AREA_WIDTH", 3);
 function we(r) {
   let t = !1;
   return typeof window < "u" && (window.addEventListener("mousemove", r.onPointerMove), window.addEventListener("mouseup", r.onPointerEnd), window.addEventListener("blur", r.onWindowBlur || r.onPointerEnd), t = !0), typeof document < "u" && (document.addEventListener("visibilitychange", r.onVisibilityChange), t = !0), t;
@@ -8610,7 +8610,7 @@ function we(r) {
 function ke(r) {
   typeof window < "u" && (window.removeEventListener("mousemove", r.onPointerMove), window.removeEventListener("mouseup", r.onPointerEnd), window.removeEventListener("blur", r.onWindowBlur || r.onPointerEnd)), typeof document < "u" && document.removeEventListener("visibilitychange", r.onVisibilityChange);
 }
-class Ll {
+class Ml {
   constructor(t, e, i, n, s, a) {
     f(this, "stage");
     f(this, "gridLayer");
@@ -8649,7 +8649,7 @@ class Ll {
       currentTime: i.currentTime || 0,
       playState: i.playState || "paused",
       container: i.container,
-      theme: We(i.theme),
+      theme: Ve(i.theme),
       timeScaleHeight: i.timeScaleHeight
     }, this.theme = this.config.theme, i.timeScaleHeight && (this.timeScaleHeight = i.timeScaleHeight), this.initEventListeners(), this.render();
   }
@@ -8780,7 +8780,7 @@ class Ll {
     if (i)
       i.width(t), i.height(e), i.fill(this.theme.background), i.stroke(this.theme.border);
     else {
-      const n = et.createRect(0, 0, t, e, this.theme.background, this.theme.border, 1);
+      const n = it.createRect(0, 0, t, e, this.theme.background, this.theme.border, 1);
       n.name("timeline-background"), this.gridLayer.add(n);
     }
     this.gridLayer.find(".grid-line").forEach((n) => n.remove()), this.gridLayer.find(".time-tick-line").forEach((n) => n.remove()), this.gridLayer.find(".time-tick-text").forEach((n) => n.remove()), this.renderTimeTicks(), this.renderScrollbar(), this.gridLayer.batchDraw();
@@ -8790,7 +8790,7 @@ class Ll {
     if (a)
       a.x(0), a.y(i), a.width(t), a.height(this.scrollbarHeight), a.fill(this.theme.scrollbarBackground || "#333333"), a.stroke(this.theme.scrollbarBorder || "#555555"), a.visible(!0);
     else {
-      const l = et.createRect(
+      const l = it.createRect(
         0,
         i,
         t,
@@ -8805,7 +8805,7 @@ class Ll {
     if (o)
       o.x(s), o.y(i), o.width(n), o.height(this.scrollbarHeight), o.fill(this.theme.scrollbarThumb || "#444444"), o.stroke(this.theme.scrollbarThumbBorder || this.theme.scrollbarBorder || "#555555"), o.visible(n < t);
     else {
-      const l = et.createRect(
+      const l = it.createRect(
         s,
         i,
         n,
@@ -8823,7 +8823,7 @@ class Ll {
     const y = 20;
     for (const T of p) {
       const S = this.timeToPixel(T.time);
-      S >= -y && S <= t + y && (et.drawTimeTick(
+      S >= -y && S <= t + y && (it.drawTimeTick(
         this.gridLayer,
         S,
         0,
@@ -8923,11 +8923,11 @@ class Ll {
 }
 const fe = 8;
 function Lt(r, t, e) {
-  return et.timeToPixels(r, t) - e + at;
+  return it.timeToPixels(r, t) - e + at;
 }
 function Nt(r, t) {
-  const e = et.timeToPixels(r, t);
-  return r <= 1e3 || e <= Ve ? Ve : e;
+  const e = it.timeToPixels(r, t);
+  return r <= 1e3 || e <= We ? We : e;
 }
 function fn(r, t) {
   const e = Lt(r.startTime, r.zoom, r.scrollLeft), i = Nt(r.duration, r.zoom);
@@ -9205,7 +9205,7 @@ const pt = class pt {
       }
       this.startEdgeAutoScroll();
     });
-    this.layer = t, this.config = e, this.theme = o, this.trackType = i, this.zoom = n, this.trackY = s, this.trackHeight = a, this.onClipUpdate = l, this.onClipAdd = h, this.onClipRemove = c, this.onClipSplit = d, this.onClipSelect = u, this.onTimeJump = p, this.onHorizontalDragAutoScroll = g, this.onClipOverlap = y, this.onClipCrossTrackPreview = T, this.onClipCrossTrack = S, this.onClearDropPreview = v, this.onClearSelection = b, this.onSnapGuideChange = w, this.dragActivationThreshold = Math.max(0, L), this.enableClipSnap = P, this.clipSnapThreshold = Math.max(0, I), this.trackGroup = et.createGroup(0, s), this.layer.add(this.trackGroup), this.initClips(), this.initEventListeners(), this.render();
+    this.layer = t, this.config = e, this.theme = o, this.trackType = i, this.zoom = n, this.trackY = s, this.trackHeight = a, this.onClipUpdate = l, this.onClipAdd = h, this.onClipRemove = c, this.onClipSplit = d, this.onClipSelect = u, this.onTimeJump = p, this.onHorizontalDragAutoScroll = g, this.onClipOverlap = y, this.onClipCrossTrackPreview = T, this.onClipCrossTrack = S, this.onClearDropPreview = v, this.onClearSelection = b, this.onSnapGuideChange = w, this.dragActivationThreshold = Math.max(0, L), this.enableClipSnap = P, this.clipSnapThreshold = Math.max(0, I), this.trackGroup = it.createGroup(0, s), this.layer.add(this.trackGroup), this.initClips(), this.initEventListeners(), this.render();
   }
   initClips() {
     this.clips = this.config.clips.map((t) => {
@@ -9220,9 +9220,9 @@ const pt = class pt {
   ensureDropPreviewGroup() {
     if (this.dropPreviewGroup)
       return this.dropPreviewGroup;
-    const t = et.createGroup(0, 0);
+    const t = it.createGroup(0, 0);
     t.name("clip-drop-preview"), t.visible(!1), t.listening(!1);
-    const e = this.trackType === "video" ? "rgba(80, 227, 194, 0.18)" : "rgba(181, 186, 255, 0.18)", i = this.trackType === "video" ? "#50e3c2" : "#b5baff", n = et.createRect(0, 0, 0, 0, e, i, 1);
+    const e = this.trackType === "video" ? "rgba(80, 227, 194, 0.18)" : "rgba(181, 186, 255, 0.18)", i = this.trackType === "video" ? "#50e3c2" : "#b5baff", n = it.createRect(0, 0, 0, 0, e, i, 1);
     return n.dash([6, 4]), n.cornerRadius(4), n.listening(!1), t.add(n), this.trackGroup.add(t), this.dropPreviewGroup = t, t;
   }
   showDropPreview(t) {
@@ -9267,7 +9267,7 @@ const pt = class pt {
     this.onTimeJump(a), this.onClearSelection && this.onClearSelection();
   }
   createClipGroup(t) {
-    const e = Lt(t.startTime, this.zoom, this.scrollLeft), i = Nt(t.duration, this.zoom), n = 2, s = this.trackHeight - 4, a = et.createClipGroup(
+    const e = Lt(t.startTime, this.zoom, this.scrollLeft), i = Nt(t.duration, this.zoom), n = 2, s = this.trackHeight - 4, a = it.createClipGroup(
       e,
       n,
       i,
@@ -9529,7 +9529,7 @@ const pt = class pt {
         scrollLeft: this.scrollLeft
       }, this.layer.width()));
       const a = t.isSelected;
-      (t.isDragging || a) && i.moveToTop(), i.opacity(t.opacity), et.updateClipGroup(
+      (t.isDragging || a) && i.moveToTop(), i.opacity(t.opacity), it.updateClipGroup(
         i,
         s,
         this.trackHeight - 4,
@@ -9647,7 +9647,7 @@ const pt = class pt {
   render(t = !0) {
     const e = this.getTrackBackgroundFill();
     if (this.trackGroup.children.length === 0) {
-      const i = et.createRect(0, 0, this.layer.width(), this.trackHeight, e, this.theme.trackBorder, 1);
+      const i = it.createRect(0, 0, this.layer.width(), this.trackHeight, e, this.theme.trackBorder, 1);
       i.name("track-background"), i.on("click", (n) => {
         this.handleTrackBackgroundClick(n.evt);
       }), i.on("mousemove", () => {
@@ -9985,7 +9985,7 @@ const pt = class pt {
 };
 f(pt, "DEFAULT_DRAG_ACTIVATION_THRESHOLD", 4), f(pt, "DEFAULT_CLIP_SNAP_THRESHOLD", 8), f(pt, "AUTO_SCROLL_EDGE_THRESHOLD", 48), f(pt, "AUTO_SCROLL_MAX_SPEED", 18);
 let ki = pt;
-class Ml {
+class Rl {
   constructor(t, e, i, n, s, a) {
     f(this, "layer");
     f(this, "playheadGroup");
@@ -9997,7 +9997,7 @@ class Ml {
     f(this, "scrollLeft", 0);
     f(this, "onTimeChange");
     f(this, "isDragging", !1);
-    this.layer = t, this.currentTime = e, this.zoom = i, this.theme = s, this.onTimeChange = a, this.playheadGroup = et.createGroup(), this.layer.add(this.playheadGroup), this.playheadLine = et.createLine(
+    this.layer = t, this.currentTime = e, this.zoom = i, this.theme = s, this.onTimeChange = a, this.playheadGroup = it.createGroup(), this.layer.add(this.playheadGroup), this.playheadLine = it.createLine(
       [0, 0, 0, n],
       this.theme.playhead,
       1
@@ -10140,8 +10140,14 @@ const _o = {
   buttonActiveBackground: "#409eff",
   buttonActiveBorder: "#409eff",
   buttonActiveText: "#fff"
-}, st = {
+}, $ = {
   container: "clip-config-panel",
+  tabBar: "clip-config-tab-bar",
+  tabButton: "clip-config-tab-button",
+  content: "clip-config-content",
+  visualPanel: "clip-config-visual-panel",
+  audioPanel: "clip-config-audio-panel",
+  actionBar: "clip-config-action-bar",
   section: "clip-config-section",
   sectionTitle: "clip-config-section-title",
   row: "clip-config-row",
@@ -10152,128 +10158,206 @@ const _o = {
   presetButton: "clip-config-preset-button",
   resetButton: "clip-config-reset-button",
   emptyState: "clip-config-empty-state"
+}, Po = {
+  visual: "画面",
+  audio: "音频"
 };
-class Po {
+class xo {
   constructor(t) {
     f(this, "container");
     f(this, "rootElement", null);
     f(this, "theme");
     f(this, "onClipUpdate");
     f(this, "currentClip", null);
-    // UI 控件引用，用于实时更新
+    f(this, "activeTab", "visual");
+    f(this, "tabBar", null);
+    f(this, "contentArea", null);
+    f(this, "visualPanel", null);
+    f(this, "audioPanel", null);
     f(this, "xSlider", null);
     f(this, "xInput", null);
     f(this, "ySlider", null);
     f(this, "yInput", null);
     f(this, "scaleSlider", null);
     f(this, "scaleInput", null);
+    f(this, "volumeSlider", null);
+    f(this, "volumeInput", null);
     this.container = t.container, this.theme = t.theme ?? _o, this.onClipUpdate = t.onClipUpdate, this.render();
   }
   setClip(t) {
-    this.currentClip = t, this.render();
+    this.currentClip = t, (t == null ? void 0 : t.type) === "video" ? this.activeTab = "visual" : (t == null ? void 0 : t.type) === "audio" && (this.activeTab = "audio"), this.render();
   }
   destroy() {
     this.rootElement && (this.rootElement.remove(), this.rootElement = null);
   }
+  getAvailableTabs() {
+    return this.currentClip ? this.currentClip.type === "audio" ? ["audio"] : ["visual", "audio"] : [];
+  }
   render() {
-    this.rootElement && this.rootElement.remove(), this.rootElement = document.createElement("div"), this.rootElement.className = st.container, this.applyTheme(), this.currentClip ? this.renderConfigPanel() : this.renderEmptyState(), this.container.appendChild(this.rootElement);
+    this.rootElement && this.rootElement.remove(), this.rootElement = document.createElement("div"), this.rootElement.className = $.container, this.applyBaseTheme(), this.currentClip ? this.renderPanel() : this.renderEmptyState(), this.container.appendChild(this.rootElement);
+  }
+  applyBaseTheme() {
+    this.rootElement && (this.rootElement.style.backgroundColor = this.theme.backgroundColor, this.rootElement.style.border = `1px solid ${this.theme.borderColor}`, this.rootElement.style.borderRadius = "4px", this.rootElement.style.color = this.theme.textColor, this.rootElement.style.fontFamily = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif', this.rootElement.style.fontSize = "13px", this.rootElement.style.display = "flex", this.rootElement.style.flexDirection = "column", this.rootElement.style.overflow = "hidden", this.rootElement.style.height = "100%");
   }
   renderEmptyState() {
     const t = document.createElement("div");
-    t.className = st.emptyState, t.style.textAlign = "center", t.style.padding = "20px", t.style.color = this.theme.labelColor;
+    t.className = $.emptyState, t.style.textAlign = "center", t.style.padding = "40px 20px", t.style.color = this.theme.labelColor;
     const e = document.createElement("div");
     e.style.fontSize = "24px", e.style.marginBottom = "8px", e.textContent = "🎬";
     const i = document.createElement("div");
     i.style.fontSize = "13px", i.textContent = "请选择一个片段", t.appendChild(e), t.appendChild(i), this.rootElement.appendChild(t);
   }
-  renderConfigPanel() {
+  renderPanel() {
+    this.renderTabBar(), this.renderContentArea(), this.renderActionBar();
+  }
+  renderTabBar() {
+    const t = this.getAvailableTabs();
+    this.tabBar = document.createElement("div"), this.tabBar.className = $.tabBar, this.tabBar.style.display = "flex", this.tabBar.style.gap = "12px", this.tabBar.style.padding = "4px", this.tabBar.style.backgroundColor = "#2a2a2a", this.tabBar.style.borderRadius = "4px 4px 0 0", t.forEach((e) => {
+      const i = document.createElement("button");
+      i.className = $.tabButton, i.textContent = Po[e], i.style.lineHeight = "22px", i.style.padding = "0 6px", i.style.border = "none", i.style.cursor = "pointer", i.style.fontSize = "13px", i.style.fontFamily = "inherit", i.style.transition = "background-color 0.15s, color 0.15s";
+      const n = this.activeTab === e;
+      i.style.backgroundColor = n ? "#595A5D" : "transparent", i.style.color = n ? "#fff" : "#b5b6bf", i.style.borderRadius = "4px", i.addEventListener("click", () => {
+        this.activeTab = e, this.updateTabBarState(), this.updateContentVisibility();
+      }), this.tabBar.appendChild(i);
+    }), this.rootElement.appendChild(this.tabBar);
+  }
+  updateTabBarState() {
+    if (!this.tabBar) return;
+    const t = this.tabBar.querySelectorAll(`.${$.tabButton}`), e = this.getAvailableTabs();
+    t.forEach((i, n) => {
+      const a = e[n] === this.activeTab, o = i;
+      o.style.backgroundColor = a ? "#595A5D" : "transparent", o.style.color = a ? "#fff" : "#b5b6bf";
+    });
+  }
+  renderContentArea() {
+    this.contentArea = document.createElement("div"), this.contentArea.className = $.content, this.contentArea.style.padding = "12px", this.contentArea.style.flex = "1", this.contentArea.style.overflowY = "auto", this.contentArea.style.minHeight = "0", this.renderVisualPanel(), this.renderAudioPanel(), this.updateContentVisibility(), this.rootElement.appendChild(this.contentArea);
+  }
+  updateContentVisibility() {
+    this.visualPanel && (this.visualPanel.style.display = this.activeTab === "visual" ? "block" : "none"), this.audioPanel && (this.audioPanel.style.display = this.activeTab === "audio" ? "block" : "none");
+  }
+  renderVisualPanel() {
+    this.visualPanel = document.createElement("div"), this.visualPanel.className = $.visualPanel;
     const t = document.createElement("div");
-    t.className = st.section, t.style.marginBottom = "16px";
+    t.className = $.section, t.style.marginBottom = "16px";
     const e = document.createElement("div");
-    e.className = st.sectionTitle, e.style.fontSize = "12px", e.style.color = this.theme.labelColor, e.style.marginBottom = "8px", e.style.textTransform = "uppercase", e.textContent = "位置", t.appendChild(e), this.renderPositionControl(t, "X", "x"), this.renderPositionControl(t, "Y", "y"), this.renderPresetGrid(t), this.rootElement.appendChild(t);
+    e.className = $.sectionTitle, e.style.fontSize = "12px", e.style.color = this.theme.labelColor, e.style.marginBottom = "8px", e.style.textTransform = "uppercase", e.textContent = "位置", t.appendChild(e), this.renderPositionControl(t, "X", "x"), this.renderPositionControl(t, "Y", "y"), this.renderPresetGrid(t), this.visualPanel.appendChild(t);
     const i = document.createElement("div");
-    i.className = st.section, i.style.borderTop = `1px solid ${this.theme.borderColor}`, i.style.paddingTop = "16px";
+    i.className = $.section, i.style.borderTop = `1px solid ${this.theme.borderColor}`, i.style.paddingTop = "16px";
     const n = document.createElement("div");
-    n.className = st.sectionTitle, n.style.fontSize = "12px", n.style.color = this.theme.labelColor, n.style.marginBottom = "8px", n.style.textTransform = "uppercase", n.textContent = "缩放", i.appendChild(n), this.renderScaleControl(i), this.rootElement.appendChild(i);
+    n.className = $.sectionTitle, n.style.fontSize = "12px", n.style.color = this.theme.labelColor, n.style.marginBottom = "8px", n.style.textTransform = "uppercase", n.textContent = "缩放", i.appendChild(n), this.renderScaleControl(i), this.visualPanel.appendChild(i), this.contentArea.appendChild(this.visualPanel);
+  }
+  renderAudioPanel() {
+    this.audioPanel = document.createElement("div"), this.audioPanel.className = $.audioPanel;
+    const t = document.createElement("div");
+    t.className = $.section;
+    const e = document.createElement("div");
+    e.className = $.sectionTitle, e.style.fontSize = "12px", e.style.color = this.theme.labelColor, e.style.marginBottom = "8px", e.style.textTransform = "uppercase", e.textContent = "音量", t.appendChild(e), this.renderVolumeControl(t), this.audioPanel.appendChild(t), this.contentArea.appendChild(this.audioPanel);
+  }
+  renderActionBar() {
+    const t = document.createElement("div");
+    t.className = $.actionBar, t.style.borderTop = `1px solid ${this.theme.borderColor}`, t.style.borderRadius = "0 0 4px 4px", t.style.minHeight = "36px", t.style.backgroundColor = "#2a2a2a", this.rootElement.appendChild(t);
   }
   renderPositionControl(t, e, i) {
     var u, p, g, y, T, S;
     const n = document.createElement("div");
-    n.className = st.row, n.style.display = "flex", n.style.alignItems = "center", n.style.gap = "8px", n.style.marginBottom = "8px";
+    n.className = $.row, n.style.display = "flex", n.style.alignItems = "center", n.style.gap = "8px", n.style.marginBottom = "8px";
     const s = document.createElement("label");
-    s.className = st.label, s.style.width = "16px", s.style.fontSize = "13px", s.style.color = this.theme.labelColor, s.textContent = e, n.appendChild(s);
+    s.className = $.label, s.style.width = "16px", s.style.fontSize = "13px", s.style.color = this.theme.labelColor, s.textContent = e, n.appendChild(s);
     const o = (((p = (u = this.currentClip) == null ? void 0 : u.visualTransform) == null ? void 0 : p.scale) ?? 1) / 2, l = -o, h = 1 + o, c = document.createElement("input");
-    c.type = "range", c.className = st.slider, c.min = String(l), c.max = String(h), c.step = "0.01", c.value = String(((y = (g = this.currentClip) == null ? void 0 : g.visualTransform) == null ? void 0 : y[i]) ?? 0.5), c.style.flex = "1", c.style.height = "4px", c.addEventListener("input", (v) => {
+    c.type = "range", c.className = $.slider, c.min = String(l), c.max = String(h), c.step = "0.01", c.value = String(((y = (g = this.currentClip) == null ? void 0 : g.visualTransform) == null ? void 0 : y[i]) ?? 0.5), c.style.flex = "1", c.style.height = "4px", c.addEventListener("input", (v) => {
       const b = parseFloat(v.target.value);
       this.handleTransformChange(i, b);
     }), n.appendChild(c);
     const d = document.createElement("input");
-    d.type = "number", d.className = st.input, d.min = String(l), d.max = String(h), d.step = "0.01", d.value = String(((S = (T = this.currentClip) == null ? void 0 : T.visualTransform) == null ? void 0 : S[i]) ?? 0.5), d.style.width = "60px", d.style.padding = "4px 6px", d.style.border = `1px solid ${this.theme.inputBorder}`, d.style.borderRadius = "4px", d.style.fontSize = "12px", d.style.backgroundColor = this.theme.inputBackground, d.style.color = this.theme.textColor, d.addEventListener("change", (v) => {
+    d.type = "number", d.className = $.input, d.min = String(l), d.max = String(h), d.step = "0.01", d.value = String(((S = (T = this.currentClip) == null ? void 0 : T.visualTransform) == null ? void 0 : S[i]) ?? 0.5), d.style.width = "60px", d.style.padding = "4px 6px", d.style.border = `1px solid ${this.theme.inputBorder}`, d.style.borderRadius = "4px", d.style.fontSize = "12px", d.style.backgroundColor = this.theme.inputBackground, d.style.color = this.theme.textColor, d.addEventListener("change", (v) => {
       const b = parseFloat(v.target.value);
       this.handleTransformChange(i, b);
     }), n.appendChild(d), i === "x" ? (this.xSlider = c, this.xInput = d) : (this.ySlider = c, this.yInput = d), t.appendChild(n);
   }
   renderPresetGrid(t) {
     const e = document.createElement("div");
-    e.className = st.presetGrid, e.style.display = "grid", e.style.gridTemplateColumns = "repeat(3, 1fr)", e.style.gap = "4px", (() => {
-      var a, o;
-      const s = (((o = (a = this.currentClip) == null ? void 0 : a.visualTransform) == null ? void 0 : o.scale) ?? 1) / 2;
-      return [
-        { label: "↖ 左上", x: s, y: s },
-        { label: "↑ 上中", x: 0.5, y: s },
-        { label: "↗ 右上", x: 1 - s, y: s },
-        { label: "← 左中", x: s, y: 0.5 },
-        { label: "● 居中", x: 0.5, y: 0.5 },
-        { label: "右中 →", x: 1 - s, y: 0.5 },
-        { label: "↙ 左下", x: s, y: 1 - s },
-        { label: "↓ 下中", x: 0.5, y: 1 - s },
-        { label: "↘ 右下", x: 1 - s, y: 1 - s }
-      ];
-    })().forEach((n) => {
+    e.className = $.presetGrid, e.style.display = "grid", e.style.gridTemplateColumns = "repeat(3, 1fr)", e.style.gap = "4px", [
+      { label: "↖ 左上", x: "left", y: "top" },
+      { label: "↑ 上中", x: "center", y: "top" },
+      { label: "↗ 右上", x: "right", y: "top" },
+      { label: "← 左中", x: "left", y: "center" },
+      { label: "● 居中", x: "center", y: "center" },
+      { label: "右中 →", x: "right", y: "center" },
+      { label: "↙ 左下", x: "left", y: "bottom" },
+      { label: "↓ 下中", x: "center", y: "bottom" },
+      { label: "↘ 右下", x: "right", y: "bottom" }
+    ].forEach((n) => {
       const s = document.createElement("button");
-      s.className = st.presetButton, s.textContent = n.label, s.style.padding = "6px", s.style.border = `1px solid ${this.theme.buttonBorder}`, s.style.borderRadius = "4px", s.style.background = this.theme.buttonBackground, s.style.fontSize = "11px", s.style.cursor = "pointer", s.style.color = this.theme.textColor, s.addEventListener("click", () => {
-        var c, d;
-        const o = (((d = (c = this.currentClip) == null ? void 0 : c.visualTransform) == null ? void 0 : d.scale) ?? 1) / 2, h = {
-          "↖ 左上": { x: o, y: o },
-          "↑ 上中": { x: 0.5, y: o },
-          "↗ 右上": { x: 1 - o, y: o },
-          "← 左中": { x: o, y: 0.5 },
-          "● 居中": { x: 0.5, y: 0.5 },
-          "右中 →": { x: 1 - o, y: 0.5 },
-          "↙ 左下": { x: o, y: 1 - o },
-          "↓ 下中": { x: 0.5, y: 1 - o },
-          "↘ 右下": { x: 1 - o, y: 1 - o }
-        }[n.label];
-        h && this.handleTransformChanges({ x: h.x, y: h.y });
+      s.className = $.presetButton, s.textContent = n.label, s.style.padding = "6px", s.style.border = `1px solid ${this.theme.buttonBorder}`, s.style.borderRadius = "4px", s.style.background = this.theme.buttonBackground, s.style.fontSize = "11px", s.style.cursor = "pointer", s.style.color = this.theme.textColor, s.addEventListener("click", () => {
+        const { x: a, y: o } = this.calculatePresetPosition(
+          n.x,
+          n.y
+        );
+        this.handleTransformChanges({ x: a, y: o });
       }), e.appendChild(s);
     }), t.appendChild(e);
   }
+  calculatePresetPosition(t, e) {
+    var o, l;
+    const n = (((l = (o = this.currentClip) == null ? void 0 : o.visualTransform) == null ? void 0 : l.scale) ?? 1) / 2, s = { left: n, center: 0.5, right: 1 - n }, a = { top: n, center: 0.5, bottom: 1 - n };
+    return { x: s[t], y: a[e] };
+  }
   renderScaleControl(t) {
     var a, o, l, h;
     const e = document.createElement("div");
-    e.className = st.row, e.style.display = "flex", e.style.alignItems = "center", e.style.gap = "8px";
+    e.className = $.row, e.style.display = "flex", e.style.alignItems = "center", e.style.gap = "8px";
     const i = document.createElement("input");
-    i.type = "range", i.className = st.slider, i.min = "0.1", i.max = "8", i.step = "0.1", i.value = String(((o = (a = this.currentClip) == null ? void 0 : a.visualTransform) == null ? void 0 : o.scale) ?? 1), i.style.flex = "1", i.style.height = "4px", i.addEventListener("input", (c) => {
+    i.type = "range", i.className = $.slider, i.min = "0.1", i.max = "8", i.step = "0.1", i.value = String(((o = (a = this.currentClip) == null ? void 0 : a.visualTransform) == null ? void 0 : o.scale) ?? 1), i.style.flex = "1", i.style.height = "4px", i.addEventListener("input", (c) => {
       const d = parseFloat(c.target.value);
       this.handleTransformChange("scale", d);
     }), e.appendChild(i);
     const n = document.createElement("input");
-    n.type = "number", n.className = st.input, n.min = "0.1", n.max = "8", n.step = "0.1", n.value = String(((h = (l = this.currentClip) == null ? void 0 : l.visualTransform) == null ? void 0 : h.scale) ?? 1), n.style.width = "60px", n.style.padding = "4px 6px", n.style.border = `1px solid ${this.theme.inputBorder}`, n.style.borderRadius = "4px", n.style.fontSize = "12px", n.style.backgroundColor = this.theme.inputBackground, n.style.color = this.theme.textColor, n.addEventListener("change", (c) => {
+    n.type = "number", n.className = $.input, n.min = "0.1", n.max = "8", n.step = "0.1", n.value = String(((h = (l = this.currentClip) == null ? void 0 : l.visualTransform) == null ? void 0 : h.scale) ?? 1), n.style.width = "60px", n.style.padding = "4px 6px", n.style.border = `1px solid ${this.theme.inputBorder}`, n.style.borderRadius = "4px", n.style.fontSize = "12px", n.style.backgroundColor = this.theme.inputBackground, n.style.color = this.theme.textColor, n.addEventListener("change", (c) => {
       const d = parseFloat(c.target.value);
       this.handleTransformChange("scale", d);
     }), e.appendChild(n);
     const s = document.createElement("button");
-    s.className = st.resetButton, s.textContent = "重置", s.style.padding = "4px 8px", s.style.border = `1px solid ${this.theme.buttonBorder}`, s.style.borderRadius = "4px", s.style.background = this.theme.buttonBackground, s.style.fontSize = "11px", s.style.cursor = "pointer", s.style.color = this.theme.textColor, s.addEventListener("click", () => {
+    s.className = $.resetButton, s.textContent = "重置", s.style.padding = "4px 8px", s.style.border = `1px solid ${this.theme.buttonBorder}`, s.style.borderRadius = "4px", s.style.background = this.theme.buttonBackground, s.style.fontSize = "11px", s.style.cursor = "pointer", s.style.color = this.theme.textColor, s.addEventListener("click", () => {
       this.handleTransformChange("scale", 1);
     }), e.appendChild(s), this.scaleSlider = i, this.scaleInput = n, t.appendChild(e);
   }
+  renderVolumeControl(t) {
+    var a, o;
+    const e = document.createElement("div");
+    e.className = $.row, e.style.display = "flex", e.style.alignItems = "center", e.style.gap = "8px";
+    const i = document.createElement("input");
+    i.type = "range", i.className = $.slider, i.min = "0", i.max = "1", i.step = "0.01", i.value = String(((a = this.currentClip) == null ? void 0 : a.volume) ?? 1), i.style.flex = "1", i.style.height = "4px", i.addEventListener("input", (l) => {
+      const h = parseFloat(l.target.value);
+      this.handleVolumeChange(h);
+    }), e.appendChild(i);
+    const n = document.createElement("input");
+    n.type = "number", n.className = $.input, n.min = "0", n.max = "100", n.step = "1", n.value = String(Math.round((((o = this.currentClip) == null ? void 0 : o.volume) ?? 1) * 100)), n.style.width = "60px", n.style.padding = "4px 6px", n.style.border = `1px solid ${this.theme.inputBorder}`, n.style.borderRadius = "4px", n.style.fontSize = "12px", n.style.backgroundColor = this.theme.inputBackground, n.style.color = this.theme.textColor, n.addEventListener("change", (l) => {
+      const h = parseFloat(l.target.value) / 100;
+      this.handleVolumeChange(Math.max(0, Math.min(1, h)));
+    }), e.appendChild(n);
+    const s = document.createElement("span");
+    s.style.fontSize = "12px", s.style.color = this.theme.labelColor, s.textContent = "%", e.appendChild(s), this.volumeSlider = i, this.volumeInput = n, t.appendChild(e);
+  }
+  handleVolumeChange(t) {
+    if (!this.currentClip || !this.onClipUpdate) return;
+    const e = Math.max(0, Math.min(1, t));
+    this.currentClip = { ...this.currentClip, volume: e }, this.updateVolumeControls(), this.onClipUpdate(this.currentClip.id, { volume: e });
+  }
+  updateVolumeControls() {
+    var e;
+    const t = ((e = this.currentClip) == null ? void 0 : e.volume) ?? 1;
+    this.volumeSlider && (this.volumeSlider.value = String(t)), this.volumeInput && (this.volumeInput.value = String(Math.round(t * 100)));
+  }
   clampValue(t, e) {
     return t === "scale" ? Math.max(0.1, Math.min(8, e)) : e;
   }
   updateUIControls() {
     var s;
     const t = ((s = this.currentClip) == null ? void 0 : s.visualTransform) ?? { x: 0.5, y: 0.5, scale: 1 }, e = t.scale / 2, i = -e, n = 1 + e;
-    this.xSlider && (this.xSlider.value = String(t.x), this.xSlider.min = String(i), this.xSlider.max = String(n)), this.xInput && (this.xInput.value = String(t.x), this.xInput.min = String(i), this.xInput.max = String(n)), this.ySlider && (this.ySlider.value = String(t.y), this.ySlider.min = String(i), this.ySlider.max = String(n)), this.yInput && (this.yInput.value = String(t.y), this.yInput.min = String(i), this.yInput.max = String(n)), this.scaleSlider && (this.scaleSlider.value = String(t.scale)), this.scaleInput && (this.scaleInput.value = String(t.scale));
+    this.updateSliderAndInput(this.xSlider, this.xInput, t.x, i, n), this.updateSliderAndInput(this.ySlider, this.yInput, t.y, i, n), this.scaleSlider && (this.scaleSlider.value = String(t.scale)), this.scaleInput && (this.scaleInput.value = String(t.scale));
+  }
+  updateSliderAndInput(t, e, i, n, s) {
+    t && (t.value = String(i), t.min = String(n), t.max = String(s)), e && (e.value = String(i), e.min = String(n), e.max = String(s));
   }
   handleTransformChange(t, e) {
     if (!this.currentClip || !this.onClipUpdate) return;
@@ -10285,9 +10369,6 @@ class Po {
     const i = { ...this.currentClip.visualTransform ?? { x: 0.5, y: 0.5, scale: 1 } };
     t.x !== void 0 && (i.x = this.clampValue("x", t.x)), t.y !== void 0 && (i.y = this.clampValue("y", t.y)), t.scale !== void 0 && (i.scale = this.clampValue("scale", t.scale)), this.currentClip = { ...this.currentClip, visualTransform: i }, this.updateUIControls(), this.onClipUpdate(this.currentClip.id, { visualTransform: i });
   }
-  applyTheme() {
-    this.rootElement && (this.rootElement.style.backgroundColor = this.theme.backgroundColor, this.rootElement.style.border = `1px solid ${this.theme.borderColor}`, this.rootElement.style.borderRadius = "4px", this.rootElement.style.padding = "12px", this.rootElement.style.color = this.theme.textColor, this.rootElement.style.fontFamily = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif', this.rootElement.style.fontSize = "13px");
-  }
 }
 class gn {
   constructor(t) {
@@ -10884,7 +10965,7 @@ class mn {
     e && (n = this.target.ensureTrackFromHistorySnapshot(e)), n && this.target.moveClipToTrack(t, n), this.target.updateClip(t, i);
   }
 }
-const xo = [
+const Eo = [
   "type",
   "externalId",
   "src",
@@ -10901,8 +10982,8 @@ const xo = [
   "visualTransform",
   "separatedAudioClipId",
   "separatedFromVideoClipId"
-], Eo = /* @__PURE__ */ new Set(["thumbnails"]);
-function Ao(r, t) {
+], Ao = /* @__PURE__ */ new Set(["thumbnails"]);
+function Lo(r, t) {
   return Object.is(r, t) ? !0 : r === void 0 || t === void 0 ? !1 : typeof r == "object" && typeof t == "object" ? JSON.stringify(r) === JSON.stringify(t) : !1;
 }
 class yn {
@@ -10973,34 +11054,34 @@ class yn {
         e.startTime
       );
     const a = {}, o = {};
-    return xo.forEach((h) => {
-      Ao(t[h], e[h]) || (a[h] = t[h], o[h] = e[h]);
-    }), Object.keys(a).length === 0 || Object.keys(a).every((h) => Eo.has(h)) ? null : this.history.createUpdateClipAction(t.id, a, o);
+    return Eo.forEach((h) => {
+      Lo(t[h], e[h]) || (a[h] = t[h], o[h] = e[h]);
+    }), Object.keys(a).length === 0 || Object.keys(a).every((h) => Ao.has(h)) ? null : this.history.createUpdateClipAction(t.id, a, o);
   }
 }
 function ri(r) {
   r.notifySelectionChange(), r.emitSelectedClipChangeIfNeeded(), r.handleClipChange();
 }
-function Lo(r) {
+function Mo(r) {
   var t, e;
   r.notifySelectionChange(), (t = r.reloadClipThumbnailsIfNeeded) == null || t.call(r), (e = r.checkTrackDurationChange) == null || e.call(r), r.emitSelectedClipChangeIfNeeded(), r.handleClipChange();
 }
-function Mo(r, t, e = !1) {
+function Ro(r, t, e = !1) {
   if (!t || !e || r.type === "audio")
     return !1;
   const i = t.duration !== r.duration, n = t.startTimeAtSource !== r.startTimeAtSource || t.endTimeAtSource !== r.endTimeAtSource;
   return i || n;
 }
-function Ro(r, t) {
+function Io(r, t) {
   if (r.length === 0)
     return !1;
   const e = Math.max(...r.map((i) => i.endTime));
   return t < e;
 }
-function Io(r) {
+function Do(r) {
   return r.currentCanPlay === r.nextCanPlay ? r.currentCanPlay : (r.setCanPlay(r.nextCanPlay), r.currentCanPlay && !r.nextCanPlay && r.playState === "playing" && (r.pauseTimeline(), r.setCurrentTime(r.clipEndTime || 1)), r.emitCanPlayChange(r.nextCanPlay), r.nextCanPlay);
 }
-function Do(r) {
+function Go(r) {
   const t = !r.id && r.startTime > 0;
   return {
     shouldJumpToTime: t,
@@ -11012,7 +11093,7 @@ function Fe(r) {
   var t;
   return r.applied ? (r.isExecutingHistoryAction || (t = r.recordHistory) == null || t.call(r), r.applyEffects(), !0) : !1;
 }
-function Go(r) {
+function Oo(r) {
   return Fe({
     applied: r.applied,
     isExecutingHistoryAction: r.isExecutingHistoryAction,
@@ -11032,7 +11113,7 @@ function Go(r) {
     applyEffects: r.applyEffects
   });
 }
-function Oo(r) {
+function Bo(r) {
   var t;
   r.isExecutingHistoryAction || (t = r.recordSplitClip) == null || t.call(r, r.clip1, r.clip2), r.emitClipUpdated(r.clip1), r.emitClipAdded(r.clip2), r.applyEffects();
 }
@@ -11040,18 +11121,18 @@ const ai = {
   x: 0.5,
   y: 0.5,
   scale: 1
-}, Bo = 0.1, Ho = 8;
+}, Ho = 0.1, zo = 8;
 function oi(r, t) {
   return typeof r == "number" && Number.isFinite(r) ? r : t;
 }
-function zo(r) {
-  return Math.min(Ho, Math.max(Bo, r));
+function No(r) {
+  return Math.min(zo, Math.max(Ho, r));
 }
 function ut(r) {
   return {
     x: oi(r == null ? void 0 : r.x, ai.x),
     y: oi(r == null ? void 0 : r.y, ai.y),
-    scale: zo(oi(r == null ? void 0 : r.scale, ai.scale))
+    scale: No(oi(r == null ? void 0 : r.scale, ai.scale))
   };
 }
 function ps(r, t, e = 1e-4) {
@@ -11092,7 +11173,7 @@ function Sn(r, t, e) {
     centerY: l
   };
 }
-function No(r, t, e, i) {
+function Fo(r, t, e, i) {
   const n = ut(r), s = i.width > 0 ? i.width : 1, a = i.height > 0 ? i.height : 1;
   return ut({
     x: n.x + t / s,
@@ -11100,7 +11181,7 @@ function No(r, t, e, i) {
     scale: n.scale
   });
 }
-function Fo(r, t, e, i, n, s) {
+function Vo(r, t, e, i, n, s) {
   const a = ut(s), o = Math.max(n.width / 2, 1), l = Math.max(n.height / 2, 1), h = Math.abs(e - r) / o, c = Math.abs(i - t) / l;
   return ut({
     x: a.x,
@@ -11227,7 +11308,7 @@ class Wo {
     const i = this.toLocalPoint(e);
     let n = this.interaction.startTransform;
     if (this.interaction.mode === "move")
-      n = No(
+      n = Fo(
         this.interaction.startTransform,
         i.x - this.interaction.pointerStart.x,
         i.y - this.interaction.pointerStart.y,
@@ -11235,7 +11316,7 @@ class Wo {
       );
     else {
       const l = this.interaction.startTransform.x * this.interaction.frameSize.width, h = this.interaction.startTransform.y * this.interaction.frameSize.height;
-      n = Fo(
+      n = Vo(
         l,
         h,
         i.x,
@@ -11301,14 +11382,14 @@ class Wo {
     e && (e.style.cursor = t || "");
   }
 }
-function Vo(r, t) {
+function Yo(r, t) {
   return !ge(r.mode) || !t ? r : {
     mode: vt.mode,
     width: t.width,
     height: t.height
   };
 }
-function Yo(r) {
+function Xo(r) {
   return r.getAttribute("src") || r.currentSrc || r.src || "";
 }
 function Tn(r) {
@@ -11326,7 +11407,7 @@ function jt(r) {
   } catch {
   }
 }
-function Xo(r) {
+function Uo(r) {
   var t;
   try {
     const e = r.play();
@@ -11352,7 +11433,7 @@ function bn(r) {
   const t = Number.parseFloat(r);
   return Number.isFinite(t) ? t : 0;
 }
-class Uo {
+class $o {
   constructor(t = {}, e = {}) {
     f(this, "container", null);
     f(this, "rootElement", null);
@@ -11396,7 +11477,7 @@ class Uo {
     }
     this.detach(), this.container = t;
     const e = document.createElement("div");
-    e.className = this.dependencies.rootClassName ?? "timeline-preview-root", e.style.position = "relative", e.style.width = "100%", e.style.height = "100%", e.style.overflow = "hidden", e.style.background = "#000000";
+    e.className = this.dependencies.rootClassName ?? "timeline-preview-root", e.style.position = "relative", e.style.width = "100%", e.style.height = "100%", e.style.overflow = "hidden";
     const i = document.createElement("div");
     i.className = this.dependencies.frameClassName ?? "timeline-preview-frame", i.style.position = "absolute", i.style.left = "0", i.style.top = "0", i.style.overflow = "hidden", i.style.background = "#000000", e.appendChild(i);
     const n = document.createElement("div");
@@ -11441,7 +11522,7 @@ class Uo {
     this.requestedAspectRatio = Ht(t), this.updateFrameLayout();
   }
   getAspectRatio() {
-    return Vo(this.requestedAspectRatio, this.resolvedAutoAspectRatio);
+    return Yo(this.requestedAspectRatio, this.resolvedAutoAspectRatio);
   }
   createMediaElement(t, e) {
     const i = this.dependencies.createMediaElement, n = i ? i(t, e) : document.createElement(t === "video" ? "video" : "audio");
@@ -11519,7 +11600,7 @@ class Uo {
   }
   assignClipToSlot(t, e) {
     t.entry = e, t.isActive = t.role === "current";
-    const i = e.clip.src, n = t.attachedSrc || Yo(t.element);
+    const i = e.clip.src, n = t.attachedSrc || Xo(t.element);
     (t.attachedClipId !== e.clip.id || n !== i) && (t.attachedClipId = e.clip.id, t.attachedSrc = i, t.isLoading = !0, t.isBuffering = !1, t.element.setAttribute("src", i), ae(t.element)), this.configureAudioRouting(t, e);
   }
   configureAudioRouting(t, e) {
@@ -11544,7 +11625,7 @@ class Uo {
   syncCurrentSlot(t, e, i, n) {
     t.isActive = !0, t.entry = e, t.element.playbackRate = i;
     const s = e.mediaTime / 1e3, a = Math.max(0.1, i * 0.15);
-    Math.abs(t.element.currentTime - s) > a ? (t.isSeeking = !0, t.isBuffering = !0, vn(t.element, s), this.refreshBufferingState()) : t.isSeeking || (t.isBuffering = !1), n === "playing" ? (this.resumeAudioContext(), Xo(t.element)) : jt(t.element), this.setSlotVisible(t, e.hasVisual, 1e3 - e.trackOrder);
+    Math.abs(t.element.currentTime - s) > a && (t.isSeeking = !0, t.isBuffering = !0, vn(t.element, s), this.refreshBufferingState()), n === "playing" ? (this.resumeAudioContext(), Uo(t.element)) : jt(t.element), this.setSlotVisible(t, e.hasVisual, 1e3 - e.trackOrder);
   }
   preparePreloadSlot(t, e) {
     if (t.isActive = !1, t.isBuffering = !1, t.isSeeking = !1, !e) {
@@ -11731,22 +11812,22 @@ class Uo {
     return ((e = this.transientVisualTransform) == null ? void 0 : e.clipId) === t.clip.id ? this.transientVisualTransform.transform : ut(t.clip.visualTransform);
   }
 }
-class $o extends Uo {
+class qo extends $o {
   destroy() {
     this.detach();
   }
 }
-function qo(r) {
+function Ko(r) {
   return "dom";
 }
-const Ko = 36e5, jo = 3e5;
+const jo = 36e5, Zo = 3e5;
 function ys(r) {
   return r.length === 0 ? 0 : r.reduce((t, e) => Math.max(t, e.startTime + e.duration), 0);
 }
 function Ss(r) {
-  return Math.max(r + jo, Ko);
+  return Math.max(r + Zo, jo);
 }
-function Zo(r) {
+function Jo(r) {
   const t = ys(r.clips);
   return t === r.lastTrackDuration ? r.lastTrackDuration : (r.setLastTrackDuration(t), r.setTimelineDuration(Ss(t)), r.emitTrackDurationChange(t), t);
 }
@@ -11776,10 +11857,10 @@ class wn {
     this.listeners.clear();
   }
 }
-function Jo(r) {
+function Qo(r) {
   return [...r].sort((t, e) => t.order - e.order);
 }
-function Qo(r) {
+function tl(r) {
   return [...r].sort((t, e) => t.startTime - e.startTime);
 }
 function li(r, t, e) {
@@ -11795,15 +11876,15 @@ function li(r, t, e) {
     hasAudio: !0
   };
 }
-class tl {
+class el {
   resolveActiveClipsAtTime(t, e) {
     return this.resolvePlaybackPlan(t, e).activeClips;
   }
   resolvePlaybackPlan(t, e) {
-    const i = Jo(t), n = [], s = [];
+    const i = Qo(t), n = [], s = [];
     let a = null;
     for (const o of i) {
-      const l = Qo(o.clips), h = l.find((d) => e >= d.startTime && e < d.endTime);
+      const l = tl(o.clips), h = l.find((d) => e >= d.startTime && e < d.endTime);
       if (h) {
         const d = h.startTimeAtSource + (e - h.startTime);
         n.push(li(o, h, d));
@@ -11821,7 +11902,7 @@ class tl {
     };
   }
 }
-function el(r) {
+function il(r) {
   var e;
   const t = r.getSelectedClip() || ((e = r.findFallbackSelectedClip) == null ? void 0 : e.call(r)) || null;
   return {
@@ -11829,7 +11910,7 @@ function el(r) {
     hasSelectedClip: !!t
   };
 }
-function il(r) {
+function nl(r) {
   var i;
   const t = r.resolveSelectedClip(), e = ((i = t.clip) == null ? void 0 : i.id) || null;
   return e === r.lastSelectedClipId ? r.lastSelectedClipId : (r.emitSelectedClipChange(t), e);
@@ -11838,23 +11919,23 @@ function Cs(r, t) {
   var e, i, n, s;
   return ((i = (e = r.findById(t)) == null ? void 0 : e.getId) == null ? void 0 : i.call(e)) || ((s = (n = r.getLastTrack()) == null ? void 0 : n.getId) == null ? void 0 : s.call(n)) || t;
 }
-function nl(r) {
+function sl(r) {
   if (r.placement.status === "use_existing_track")
     return r.trackCollection.addClipToTrack(r.placement.trackId, r.clip);
   const t = r.createTrack(r.placement.trackType, r.placement.suggestedTrackName), e = Cs(r.trackCollection, t);
   return e ? r.trackCollection.addClipToTrack(e, r.clip) : !1;
 }
-function sl(r, t, e) {
+function rl(r, t, e) {
   return t.trackId ? r.removeClipFromTrack(t.trackId, e) : !1;
 }
-function rl(r) {
+function al(r) {
   return r.trackCollection.moveClipToTrack(
     r.command.clip,
     r.command.sourceTrackId,
     r.command.targetTrackId
   );
 }
-function al(r) {
+function ol(r) {
   const t = r.createTrack(r.trackType, r.trackName), e = Cs(r.trackCollection, t);
   return e ? r.trackCollection.moveClipToTrack(r.clip, r.currentTrackId, e) : !1;
 }
@@ -11862,11 +11943,11 @@ function Bt(r) {
   var t, e, i, n;
   (t = r.checkTrackDurationChange) == null || t.call(r), (e = r.updateCanPlayState) == null || e.call(r), (i = r.updateTrackInfoPanel) == null || i.call(r), (n = r.handleClipChange) == null || n.call(r);
 }
-function ol(r) {
+function ll(r) {
   var t, e;
   r.notifySelectionChange(), (t = r.cleanupEmptyTracks) == null || t.call(r), r.updateTrackInfoPanel(), (e = r.batchDraw) == null || e.call(r), r.syncPreviewSession();
 }
-class ll {
+class hl {
   constructor() {
     f(this, "panel", null);
   }
@@ -11985,7 +12066,7 @@ class _n {
     );
   }
 }
-class hl {
+class cl {
   constructor(t) {
     this.tracks = t;
   }
@@ -12107,7 +12188,7 @@ class hl {
     return typeof t.getId == "function" ? t.getId() : typeof t.id == "string" ? t.id : null;
   }
 }
-class cl {
+class dl {
   constructor(t = []) {
     f(this, "tracks", []);
     f(this, "trackCounter", 0);
@@ -12210,7 +12291,7 @@ function oe(r, t, e) {
 function Pn(r, t) {
   return r.reduce((e, i) => e + Ft(i.type), t);
 }
-function dl(r, t) {
+function ul(r, t) {
   let e = t;
   return r.map((i) => {
     const n = Ft(i.type), s = {
@@ -12222,7 +12303,7 @@ function dl(r, t) {
   });
 }
 const Ts = 200, vs = 8, xn = "timeline-manager-managed-layout-styles";
-function ul() {
+function fl() {
   if (typeof document > "u" || document.getElementById(xn))
     return;
   const r = document.createElement("style");
@@ -12254,8 +12335,8 @@ function ul() {
     }
   `, document.head.appendChild(r);
 }
-function fl(r, t) {
-  ul();
+function gl(r, t) {
+  fl();
   const e = t.leftPanelWidth ?? Ts, i = t.scrollbarSize ?? vs;
   r.innerHTML = "", r.classList.add("timeline-manager-root"), r.style.gridTemplateColumns = `${e}px minmax(0, 1fr)`, r.style.gridTemplateRows = `${t.timeScaleHeight}px minmax(0, 1fr)`, r.style.background = t.theme.background;
   const n = Ct("div");
@@ -12293,7 +12374,7 @@ function Ct(r) {
 function He(r, t) {
   r.style.position = "relative", r.style.minWidth = "0", r.style.minHeight = "0", r.style.maxWidth = "100%", r.style.boxSizing = "border-box", r.style.background = t.background, r.style.color = t.clipName;
 }
-class gl {
+class pl {
   constructor(t) {
     f(this, "currentTime");
     f(this, "playState");
@@ -12319,7 +12400,7 @@ class gl {
     this.speed = t;
   }
 }
-class pl {
+class ml {
   constructor() {
     f(this, "selectedClipId", null);
   }
@@ -12336,7 +12417,7 @@ class pl {
     return this.selectedClipId !== null;
   }
 }
-class ml {
+class yl {
   constructor(t) {
     f(this, "zoom");
     f(this, "duration");
@@ -12395,11 +12476,11 @@ class En {
     f(this, "selectionStore");
     f(this, "playbackStore");
     f(this, "viewportStore");
-    this.selectionStore = new pl(), this.playbackStore = new gl({
+    this.selectionStore = new ml(), this.playbackStore = new pl({
       currentTime: t.currentTime,
       playState: t.playState,
       speed: t.speed
-    }), this.viewportStore = new ml({
+    }), this.viewportStore = new yl({
       zoom: t.zoom,
       duration: t.duration,
       scrollLeft: t.scrollLeft,
@@ -12482,7 +12563,7 @@ class En {
     this.viewportStore.setContentHeight(t);
   }
 }
-class yl {
+class Sl {
   constructor(t, e, i, n, s) {
     f(this, "stage");
     f(this, "layer");
@@ -12512,7 +12593,7 @@ class yl {
       currentTime: i.currentTime || 0,
       playState: i.playState || "paused",
       container: i.container,
-      theme: We(i.theme),
+      theme: Ve(i.theme),
       timeScaleHeight: i.timeScaleHeight
     }, this.theme = this.config.theme, this.timeScaleHeight = i.timeScaleHeight || 40, this.initEventListeners(), this.render();
   }
@@ -12552,7 +12633,7 @@ class yl {
   }
   initEventListeners() {
     this.stage.on("click", (t) => {
-      t.target.getLayer() === this.layer && this.onTimeChange(this.pixelToTime(t.evt.offsetX));
+      t.target.getLayer() === this.layer && this.onTimeChange(this.pixelToTime(t.evt.offsetX), "seek");
     }), this.stage.on("mousedown", (t) => {
       t.target.getLayer() === this.layer && (this.updatePointerPosition(t.evt.offsetX), this.isPointerInsideTimeline = !0, this.isDragging = !0, this.dragStartX = t.evt.clientX, this.bindGlobalPointerListenersForDrag());
     }), this.stage.on("mousemove", (t) => {
@@ -12597,7 +12678,7 @@ class yl {
     if (i)
       i.width(t), i.height(e), i.fill(this.theme.background), i.stroke(this.theme.border);
     else {
-      const n = et.createRect(0, 0, t, e, this.theme.background, this.theme.border, 1);
+      const n = it.createRect(0, 0, t, e, this.theme.background, this.theme.border, 1);
       n.name("timeline-header-background"), this.layer.add(n);
     }
     this.layer.find(".time-tick-line").forEach((n) => n.remove()), this.layer.find(".time-tick-text").forEach((n) => n.remove()), this.renderTimeTicks(), this.layer.batchDraw();
@@ -12606,7 +12687,7 @@ class yl {
     const t = this.stage.width(), e = this.scrollLeft, i = this.scrollLeft + t, n = O.pixelsToTime(e, this.config.zoom), s = O.pixelsToTime(i, this.config.zoom), a = O.msToSeconds(n), o = O.msToSeconds(s), { majorStep: l, minorStep: h } = O.getTickConfig(this.config.zoom), c = O.generateVisibleTicks(a - 10, o + 10, l, h);
     for (const d of c) {
       const u = this.timeToPixel(d.time);
-      u >= -20 && u <= t + 20 && et.drawTimeTick(
+      u >= -20 && u <= t + 20 && it.drawTimeTick(
         this.layer,
         u,
         0,
@@ -12626,7 +12707,7 @@ class yl {
     return Math.max(0, Math.min(e, t));
   }
 }
-class Sl {
+class Cl {
   constructor(t, e, i, n, s, a) {
     f(this, "container");
     f(this, "lineElement");
@@ -12651,7 +12732,10 @@ class Sl {
     f(this, "handleMouseDown", (t) => {
       t.preventDefault(), t.stopPropagation(), this.isDragging = !0, this.bindGlobalPointerListeners();
     });
-    this.container = t, this.currentTime = e, this.zoom = i, this.height = n, this.theme = s, this.onTimeChange = a, this.container.innerHTML = "", this.container.style.position = "absolute", this.container.style.pointerEvents = "none", this.lineElement = document.createElement("div"), this.lineElement.className = "timeline-manager-playhead-line", this.lineElement.style.position = "absolute", this.lineElement.style.top = "0", this.lineElement.style.width = "1px", this.lineElement.style.background = this.theme.playhead, this.lineElement.style.pointerEvents = "none", this.handleElement = document.createElement("div"), this.handleElement.className = "timeline-manager-playhead-handle", this.handleElement.style.position = "absolute", this.handleElement.style.top = "0", this.handleElement.style.width = "18px", this.handleElement.style.height = "12px", this.handleElement.style.marginLeft = "-9px", this.handleElement.style.background = this.theme.playhead, this.handleElement.style.clipPath = "polygon(50% 100%, 0 0, 100% 0)", this.handleElement.style.cursor = "ew-resize", this.handleElement.style.pointerEvents = "auto", this.container.appendChild(this.lineElement), this.container.appendChild(this.handleElement), this.handleElement.addEventListener("mousedown", this.handleMouseDown), this.render();
+    f(this, "handleHandleClick", (t) => {
+      t.preventDefault(), t.stopPropagation();
+    });
+    this.container = t, this.currentTime = e, this.zoom = i, this.height = n, this.theme = s, this.onTimeChange = a, this.container.innerHTML = "", this.container.style.position = "absolute", this.container.style.pointerEvents = "none", this.lineElement = document.createElement("div"), this.lineElement.className = "timeline-manager-playhead-line", this.lineElement.style.position = "absolute", this.lineElement.style.top = "0", this.lineElement.style.width = "1px", this.lineElement.style.background = this.theme.playhead, this.lineElement.style.pointerEvents = "none", this.handleElement = document.createElement("div"), this.handleElement.className = "timeline-manager-playhead-handle", this.handleElement.style.position = "absolute", this.handleElement.style.top = "0", this.handleElement.style.width = "18px", this.handleElement.style.height = "12px", this.handleElement.style.marginLeft = "-9px", this.handleElement.style.background = this.theme.playhead, this.handleElement.style.clipPath = "polygon(50% 100%, 0 0, 100% 0)", this.handleElement.style.cursor = "ew-resize", this.handleElement.style.pointerEvents = "auto", this.container.appendChild(this.lineElement), this.container.appendChild(this.handleElement), this.handleElement.addEventListener("mousedown", this.handleMouseDown), this.handleElement.addEventListener("click", this.handleHandleClick), this.render();
   }
   setCurrentTime(t) {
     this.currentTime = Math.max(0, t), this.render();
@@ -12669,7 +12753,7 @@ class Sl {
     this.height = Math.max(0, t), this.render();
   }
   destroy() {
-    this.handleElement.removeEventListener("mousedown", this.handleMouseDown), this.unbindGlobalPointerListeners(), this.container.innerHTML = "";
+    this.handleElement.removeEventListener("mousedown", this.handleMouseDown), this.handleElement.removeEventListener("click", this.handleHandleClick), this.unbindGlobalPointerListeners(), this.container.innerHTML = "";
   }
   bindGlobalPointerListeners() {
     this.hasBoundGlobalPointerListeners || (this.hasBoundGlobalPointerListeners = we({
@@ -12687,7 +12771,7 @@ class Sl {
   }
   updateTimeFromClientX(t) {
     const e = this.container.getBoundingClientRect(), i = t - e.left, n = O.pixelsToTime(i - at + this.scrollLeft, this.zoom);
-    this.onTimeChange(Math.max(0, n));
+    this.onTimeChange(Math.max(0, n), "scrub");
   }
   render() {
     const t = O.timeToPixels(this.currentTime, this.zoom) - this.scrollLeft + at, e = t >= 0 && t <= this.container.clientWidth;
@@ -12744,7 +12828,7 @@ class An {
       container: this.container,
       width: this.container.clientWidth,
       height: this.container.clientHeight
-    }), this.layer = new X.Layer(), this.layer.name("scrollbar-layer"), this.stage.add(this.layer), this.hitAreaRect = et.createRect(0, 0, 0, 0, "rgba(0, 0, 0, 0.001)", "transparent", 0), this.hitAreaRect.name("scrollbar-hit-area"), this.thumbRect = et.createRect(0, 0, 0, 0, this.theme.scrollbarThumb || "#444444", this.theme.scrollbarThumbBorder || this.theme.scrollbarBorder || "#555555", 1), this.thumbRect.name("scrollbar-thumb"), this.thumbRect.cornerRadius(999), this.layer.add(this.hitAreaRect), this.layer.add(this.thumbRect), this.stage.on("mousedown", this.handleStageMouseDown), this.stage.on("mouseup", this.handleStageMouseUp), this.stage.on("mouseenter", this.handleStageMouseEnter), this.stage.on("mousemove", this.handleStageMouseMove), this.stage.on("mouseleave", this.handleStageMouseLeave), this.render();
+    }), this.layer = new X.Layer(), this.layer.name("scrollbar-layer"), this.stage.add(this.layer), this.hitAreaRect = it.createRect(0, 0, 0, 0, "rgba(0, 0, 0, 0.001)", "transparent", 0), this.hitAreaRect.name("scrollbar-hit-area"), this.thumbRect = it.createRect(0, 0, 0, 0, this.theme.scrollbarThumb || "#444444", this.theme.scrollbarThumbBorder || this.theme.scrollbarBorder || "#555555", 1), this.thumbRect.name("scrollbar-thumb"), this.thumbRect.cornerRadius(999), this.layer.add(this.hitAreaRect), this.layer.add(this.thumbRect), this.stage.on("mousedown", this.handleStageMouseDown), this.stage.on("mouseup", this.handleStageMouseUp), this.stage.on("mouseenter", this.handleStageMouseEnter), this.stage.on("mousemove", this.handleStageMouseMove), this.stage.on("mouseleave", this.handleStageMouseLeave), this.render();
   }
   setViewportMetrics(t, e) {
     this.viewportSize = Math.max(0, t), this.contentSize = Math.max(0, e), this.scrollOffset = this.clampScrollOffset(this.scrollOffset), this.render();
@@ -12831,7 +12915,7 @@ class An {
     return this.scrollOffset / i * n;
   }
 }
-class Cl {
+class Tl {
   constructor() {
     f(this, "entries", /* @__PURE__ */ new Map());
   }
@@ -12847,7 +12931,7 @@ class Cl {
     this.entries.clear();
   }
 }
-class Tl {
+class vl {
   constructor() {
     f(this, "panel", null);
     f(this, "config", null);
@@ -12856,7 +12940,7 @@ class Tl {
   init(t) {
     this.config = t;
     const e = this.convertTheme(t.theme);
-    this.panel = new Po({
+    this.panel = new xo({
       container: t.container,
       theme: e,
       onClipUpdate: (i, n) => {
@@ -12871,7 +12955,6 @@ class Tl {
     const t = this.config.getSelectedClip();
     this.panel.setClip(t);
   }
-  // 外部更新时调用（如预览组件更新 visualTransform）
   updateFromExternal() {
     this.isInternalUpdate || this.update();
   }
@@ -12895,10 +12978,10 @@ class Tl {
     };
   }
 }
-const vl = "2.0.0", bl = {
-  version: vl
-}, wl = 1, kl = 2, _l = 8e3;
-class Rl {
+const bl = "2.0.1", wl = {
+  version: bl
+}, kl = 1, _l = 2, Pl = 8e3;
+class Il {
   constructor(t = {}) {
     f(this, "timeline", null);
     f(this, "tracks", []);
@@ -12959,7 +13042,7 @@ class Rl {
     f(this, "rootWheelListener", (t) => {
       this.handleUnifiedWheel(t);
     });
-    f(this, "mountManager", new Cl());
+    f(this, "mountManager", new Tl());
     f(this, "pendingDraftData", null);
     this.config = {
       duration: t.duration || 36e5,
@@ -12967,7 +13050,7 @@ class Rl {
       currentTime: t.currentTime || 0,
       playState: t.playState || "paused",
       container: t.container,
-      theme: We(t.theme),
+      theme: Ve(t.theme),
       timeScaleHeight: t.timeScaleHeight,
       logConfig: t.logConfig,
       speed: t.speed || 1,
@@ -12977,7 +13060,7 @@ class Rl {
       thumbnailProvider: t.thumbnailProvider,
       previewBackend: t.previewBackend ?? "dom",
       previewSourceResolver: t.previewSourceResolver
-    }, R.setConfig(this.config.logConfig), R.debug("TimelineManager", "日志系统初始化完成", { logConfig: this.config.logConfig }), this.thumbnailProvider = t.thumbnailProvider || null, this.trackInfoPanelController = new ll(), this.eventDispatcher = new wn({
+    }, R.setConfig(this.config.logConfig), R.debug("TimelineManager", "日志系统初始化完成", { logConfig: this.config.logConfig }), this.thumbnailProvider = t.thumbnailProvider || null, this.trackInfoPanelController = new hl(), this.eventDispatcher = new wn({
       can_play_change: () => ({ canPlay: this.canPlay }),
       selected_clip_change: () => this.resolveSelectedClipSnapshot(),
       source_loading_change: () => this.getSourceLoadingState(),
@@ -13002,7 +13085,7 @@ class Rl {
       findTrackByClipId: this.findTrackByClipId.bind(this),
       getDefaultTrack: () => this.getDefaultTrackForHistory(),
       loadClipThumbnails: this.loadClipThumbnails.bind(this)
-    }), this.trackManager = new cl(), this.timelineStore = new En({
+    }), this.trackManager = new dl(), this.timelineStore = new En({
       currentTime: this.config.currentTime,
       playState: this.config.playState,
       speed: this.config.speed || 1,
@@ -13042,7 +13125,7 @@ class Rl {
     return this.timelineCommands || (this.timelineCommands = new gn(this.getTimelineStore())), this.timelineCommands;
   }
   getTrackCollection() {
-    return new hl(this.tracks);
+    return new cl(this.tracks);
   }
   getTimelinePresentationAdapter() {
     return this.timelinePresentationAdapter || (this.timelinePresentationAdapter = new kn()), this.timelinePresentationAdapter;
@@ -13065,10 +13148,10 @@ class Rl {
     })), this.timelineTrackBridge;
   }
   getTimelinePlaybackResolver() {
-    return this.timelinePlaybackResolver || (this.timelinePlaybackResolver = new tl()), this.timelinePlaybackResolver;
+    return this.timelinePlaybackResolver || (this.timelinePlaybackResolver = new el()), this.timelinePlaybackResolver;
   }
   resolveConfiguredPreviewBackend() {
-    return this.runtimePreviewBackendOverride ? (this.resolvedPreviewBackend = this.runtimePreviewBackendOverride, this.resolvedPreviewBackend) : (this.resolvedPreviewBackend = qo(this.config.previewBackend), this.resolvedPreviewBackend);
+    return this.runtimePreviewBackendOverride ? (this.resolvedPreviewBackend = this.runtimePreviewBackendOverride, this.resolvedPreviewBackend) : (this.resolvedPreviewBackend = Ko(this.config.previewBackend), this.resolvedPreviewBackend);
   }
   createPreviewBackendCallbacks(t = this.activePreviewCallbackToken) {
     return {
@@ -13097,7 +13180,7 @@ class Rl {
   }
   createPreviewBackend(t = this.resolveConfiguredPreviewBackend()) {
     const e = this.createPreviewBackendCallbacks(++this.activePreviewCallbackToken);
-    return new $o(e);
+    return new qo(e);
   }
   isActivePreviewCallbackToken(t) {
     return t === this.activePreviewCallbackToken;
@@ -13147,7 +13230,7 @@ class Rl {
       zoom: ct.MEDIUM,
       currentTime: 0,
       playState: "paused",
-      theme: We(),
+      theme: Ve(),
       speed: 1,
       dragActivationThreshold: 4,
       enableClipSnap: !1,
@@ -13375,22 +13458,22 @@ class Rl {
     this.clearPendingPreviewState(), e && this.play();
   }
   buildPreviewPendingState() {
-    return this.pendingPreviewState ? {
+    return !this.pendingPreviewState || this.pendingPreviewState.mode === "scrub" ? null : {
       mode: this.pendingPreviewState.mode,
       targetTime: this.pendingPreviewState.targetTime,
       loadingPending: this.previewSourceLoadingCount,
       isBuffering: this.previewBuffering,
       errorMessage: this.pendingPreviewState.errorMessage
-    } : null;
+    };
   }
   ensurePendingPreviewTimeout() {
-    if (!this.pendingPreviewState || this.pendingPreviewState.timeoutId !== null)
+    if (!this.pendingPreviewState || this.pendingPreviewState.mode === "scrub" || this.pendingPreviewState.timeoutId !== null)
       return;
     const t = this.pendingPreviewState.syncRequestId;
     this.pendingPreviewState.timeoutId = setTimeout(() => {
       var e, i;
       !this.pendingPreviewState || this.pendingPreviewState.syncRequestId !== t || (this.pendingPreviewState.errorMessage = "资源加载异常，请刷新重试", this.clearPendingPreviewTimeout(), (i = (e = this.previewSession) == null ? void 0 : e.setPendingState) == null || i.call(e, this.buildPreviewPendingState()));
-    }, _l);
+    }, Pl);
   }
   clearPendingPreviewTimeout() {
     var t;
@@ -13430,7 +13513,7 @@ class Rl {
       R.warn("TimelineManager", "TimelineManager has already been initialized");
       return;
     }
-    if (this.rootContainer = t, this.layout = fl(t, {
+    if (this.rootContainer = t, this.layout = gl(t, {
       theme: this.config.theme,
       timeScaleHeight: this.getTimeScaleHeight(),
       leftPanelWidth: Ts,
@@ -13443,13 +13526,13 @@ class Rl {
       container: this.layout.bodyCanvasHost,
       width: this.layout.bodyViewport.clientWidth,
       height: 0
-    }), this.backgroundLayer = new X.Layer({ name: "trackBackgroundLayer" }), this.trackLayer = new X.Layer({ name: "trackLayer" }), this.snapGuideLayer = new X.Layer({ name: "trackSnapGuideLayer", listening: !1 }), this.stage.add(this.backgroundLayer), this.stage.add(this.trackLayer), this.stage.add(this.snapGuideLayer), this.timeline = new yl(
+    }), this.backgroundLayer = new X.Layer({ name: "trackBackgroundLayer" }), this.trackLayer = new X.Layer({ name: "trackLayer" }), this.snapGuideLayer = new X.Layer({ name: "trackSnapGuideLayer", listening: !1 }), this.stage.add(this.backgroundLayer), this.stage.add(this.trackLayer), this.stage.add(this.snapGuideLayer), this.timeline = new Sl(
       this.headerStage,
       this.headerLayer,
       this.config,
       this.handleTimeChange.bind(this),
       this.handleScrollChange.bind(this)
-    ), this.playhead = new Sl(
+    ), this.playhead = new Cl(
       this.layout.playheadOverlay,
       this.getCurrentTimeState(),
       this.getZoomState(),
@@ -13549,7 +13632,7 @@ class Rl {
   }
   updateAllTrackPositions() {
     var e, i;
-    const t = dl(this.trackManager.getTracks(), this.getTrackContentTopOffset());
+    const t = ul(this.trackManager.getTracks(), this.getTrackContentTopOffset());
     for (const n of t) {
       const s = this.getTrackCollection().findById(n.trackId);
       s && ((e = s.setTrackY) == null || e.call(s, n.y), (i = s.setTrackHeight) == null || i.call(s, n.height));
@@ -13589,7 +13672,7 @@ class Rl {
     if (!this.snapGuideLayer)
       return null;
     if (!this.trackInsertionPreviewLine) {
-      const t = et.createLine(
+      const t = it.createLine(
         [0, 0, 0, 0],
         this.config.theme.clipSelectedBorder,
         2
@@ -13681,7 +13764,7 @@ class Rl {
       return null;
     if (!this.snapGuideLine) {
       const t = this.config.theme;
-      this.snapGuideLine = et.createLine(
+      this.snapGuideLine = it.createLine(
         [0, 0, 0, this.calculateTotalHeight()],
         t.snapGuideLineColor || t.clipSelectedBorder,
         t.snapGuideLineWidth ?? 1
@@ -13738,9 +13821,9 @@ class Rl {
   normalizeWheelDelta(t, e, i) {
     if (!Number.isFinite(t) || t === 0)
       return 0;
-    if (e === wl)
+    if (e === kl)
       return t * 16;
-    if (e === kl) {
+    if (e === _l) {
       const n = i === "x" ? this.getViewportWidth() : this.getViewportHeight();
       return t * (n || 1);
     }
@@ -14046,7 +14129,7 @@ class Rl {
           return c.id;
         }
       }
-      const u = this.getTimelineCommands().planTrackPlacement(c, this.tracks), p = this.getTrackCollection(), g = nl({
+      const u = this.getTimelineCommands().planTrackPlacement(c, this.tracks), p = this.getTrackCollection(), g = sl({
         clip: c,
         placement: u,
         trackCollection: p,
@@ -14077,7 +14160,7 @@ class Rl {
   removeClip(t) {
     const e = this.getTimelineCommands().prepareRemoveClip(t, this.tracks);
     e.exists && (e.shouldClearSelection && this.clearSelection(), Fe({
-      applied: sl(this.getTrackCollection(), e, t),
+      applied: rl(this.getTrackCollection(), e, t),
       isExecutingHistoryAction: this.isExecutingHistoryAction,
       recordHistory: () => {
         this.getTimelineHistoryRecorder().recordRemoveClip(e.clip);
@@ -14223,7 +14306,7 @@ class Rl {
   * 获取插件版本号
   */
   getVersion() {
-    return bl.version;
+    return wl.version;
   }
   undo() {
     return this.history.undo();
@@ -14252,14 +14335,14 @@ class Rl {
     const t = this.getClips().map((e) => ({ ...e }));
     this.getTrackCollection().removeClipGaps(), t.length > 0 && this.getTimelineHistoryRecorder().recordRemoveGaps(t), this.checkTrackDurationChange();
   }
-  handleTimeChange(t) {
-    this.beginPendingPreview(t, "seek"), this.setCurrentTime(t);
+  handleTimeChange(t, e = "seek") {
+    this.beginPendingPreview(t, e), this.setCurrentTime(t);
   }
   handleScrollChange(t) {
     this.syncScrollLeft(t);
   }
   handleClipUpdate(t, e, i) {
-    this.isExecutingHistoryAction || this.getTimelineHistoryRecorder().recordClipUpdate(t, e, i), this.emitEvent("clip_updated", { clip: t }), Lo({
+    this.isExecutingHistoryAction || this.getTimelineHistoryRecorder().recordClipUpdate(t, e, i), this.emitEvent("clip_updated", { clip: t }), Mo({
       notifySelectionChange: this.notifySelectionChange.bind(this),
       reloadClipThumbnailsIfNeeded: () => this.reloadClipThumbnailsIfNeeded(t, e),
       checkTrackDurationChange: this.checkTrackDurationChange.bind(this),
@@ -14287,7 +14370,7 @@ class Rl {
    * @param originalClip 原始片段
    */
   reloadClipThumbnailsIfNeeded(t, e) {
-    Mo(t, e, !!this.thumbnailProvider) && this.loadClipThumbnails(t).catch((i) => {
+    Ro(t, e, !!this.thumbnailProvider) && this.loadClipThumbnails(t).catch((i) => {
       R.warn("TimelineManager", "Error reloading clip thumbnails during update:", { error: i, clipId: t.id });
     });
   }
@@ -14296,8 +14379,8 @@ class Rl {
    */
   updateCanPlayState() {
     var s;
-    const t = this.getClips(), e = this.getCurrentTime(), i = Ro(t, e), n = this.canPlay;
-    this.canPlay = Io({
+    const t = this.getClips(), e = this.getCurrentTime(), i = Io(t, e), n = this.canPlay;
+    this.canPlay = Do({
       currentCanPlay: this.canPlay,
       nextCanPlay: i,
       playState: this.getPlayStateState(),
@@ -14313,7 +14396,7 @@ class Rl {
     }), n !== this.canPlay && R.debugLazy("TimelineManager", () => "Can play state changed", () => ({ oldState: n, newState: this.canPlay }));
   }
   handleClipSplit(t, e) {
-    Oo({
+    Bo({
       clip1: t,
       clip2: e,
       isExecutingHistoryAction: this.isExecutingHistoryAction,
@@ -14332,7 +14415,7 @@ class Rl {
     });
   }
   handleClipSelect(t) {
-    const e = Do(t);
+    const e = Go(t);
     e.shouldJumpToTime && e.jumpTime !== null ? (this.setCurrentTime(e.jumpTime), this.emitEvent("clip_selected", { clip: t }), R.debugLazy("TimelineManager", () => "Empty track clicked, jumping to time", () => ({ time: t.startTime }))) : e.shouldSelectClip && this.selectClip(t.id, t);
   }
   handleActionUndo(t) {
@@ -14351,7 +14434,7 @@ class Rl {
     this.getEventDispatcher().emit(t, e);
   }
   emitSelectedClipChangeIfNeeded() {
-    this.lastSelectedClipId = il({
+    this.lastSelectedClipId = nl({
       lastSelectedClipId: this.lastSelectedClipId,
       resolveSelectedClip: () => this.resolveSelectedClipSnapshot(),
       emitSelectedClipChange: (t) => this.emitEvent("selected_clip_change", t)
@@ -14374,7 +14457,7 @@ class Rl {
     const i = this.getTrackCollection();
     if (!i.findById(e)) return;
     const n = t.type, s = this.trackManager.getTracksByType(n).length + 1, a = n === "video" ? `视频轨道 ${s}` : `音频轨道 ${s}`;
-    al({
+    ol({
       clip: t,
       currentTrackId: e,
       trackType: n,
@@ -14513,7 +14596,7 @@ class Rl {
     (t = this.previewSession) != null && t.hasPreview() && (this.clearPendingPreviewState(), this.destroyPreviewSession(), this.recreateDetachedPreviewSession(), this.previewMountContainer = null, R.debugLazy("TimelineManager", () => "TimelineManager detached from preview container"));
   }
   attachClipConfig(t) {
-    const e = new Tl();
+    const e = new vl();
     e.init({
       container: t,
       theme: this.config.theme,
@@ -14656,11 +14739,11 @@ class Rl {
       }), !1;
     if (n.status !== "ready")
       return !1;
-    const { sourceTrackId: s, targetTrackId: a } = n, o = i ? { ...i } : { ...n.clip }, l = this.cloneTrackSnapshot(s), h = this.cloneTrackSnapshot(a), c = rl({
+    const { sourceTrackId: s, targetTrackId: a } = n, o = i ? { ...i } : { ...n.clip }, l = this.cloneTrackSnapshot(s), h = this.cloneTrackSnapshot(a), c = al({
       command: n,
       trackCollection: this.getTrackCollection()
     }), d = this.getClips().find((u) => u.id === t) ?? null;
-    return Go({
+    return Oo({
       applied: c,
       clipId: t,
       sourceTrackId: s,
@@ -14671,7 +14754,7 @@ class Rl {
       targetTrackSnapshot: h,
       isExecutingHistoryAction: this.isExecutingHistoryAction,
       recordMoveClipBetweenTracks: this.getTimelineHistoryRecorder().recordMoveClipBetweenTracks.bind(this.getTimelineHistoryRecorder()),
-      applyEffects: () => ol({
+      applyEffects: () => ll({
         notifySelectionChange: this.notifySelectionChange.bind(this),
         cleanupEmptyTracks: this.cleanupEmptyTracks.bind(this),
         updateTrackInfoPanel: this.updateTrackInfoPanel.bind(this),
@@ -14739,7 +14822,7 @@ class Rl {
    * 检查轨道总时长是否变化，如果变化则触发事件并更新时间轴时长
    */
   checkTrackDurationChange() {
-    const t = this.lastTrackDuration, e = Zo({
+    const t = this.lastTrackDuration, e = Jo({
       clips: this.getClips(),
       lastTrackDuration: this.lastTrackDuration,
       setLastTrackDuration: (i) => {
@@ -14759,7 +14842,7 @@ class Rl {
     );
   }
   resolveSelectedClipSnapshot() {
-    return el({
+    return il({
       getSelectedClip: () => {
         var t;
         return ((t = this.getSelectedClip) == null ? void 0 : t.call(this)) || null;
@@ -14797,24 +14880,24 @@ class Rl {
   }
 }
 export {
-  El as CLIP_LAYER,
+  Al as CLIP_LAYER,
   ni as Clip,
-  Po as ClipConfigPanel,
+  xo as ClipConfigPanel,
   ks as DEFAULT_CLIP_VIEW_STATE,
   vt as DEFAULT_PREVIEW_ASPECT_RATIO,
   pn as HistoryManager,
-  Ve as MIN_CLIP_LINE_WIDTH,
-  xl as PREVIEW_ASPECT_RATIO_PRESETS,
-  Ml as Playhead,
+  We as MIN_CLIP_LINE_WIDTH,
+  El as PREVIEW_ASPECT_RATIO_PRESETS,
+  Rl as Playhead,
   at as TIMELINE_LEFT_PADDING,
-  Al as TIME_SCALE,
+  Ll as TIME_SCALE,
   At as TRACK_HEIGHT,
   O as TimeUtils,
-  Ll as Timeline,
-  Rl as TimelineManager,
+  Ml as Timeline,
+  Il as TimelineManager,
   ki as Track,
   ko as TrackInfoPanel,
-  cl as TrackManager,
+  dl as TrackManager,
   _s as ZOOM_ANIMATION,
   ct as ZOOM_PRESETS,
   Ps as createClipViewState,
@@ -14823,5 +14906,5 @@ export {
   ge as isAutoPreviewAspectRatioMode,
   Ht as normalizePreviewAspectRatio,
   Ln as normalizePreviewAspectRatioMode,
-  We as resolveTheme
+  Ve as resolveTheme
 };