react-av-timeline 2.0.0 → 3.0.1

package/dist/index.js

@@ -1,358 +1,725 @@
-import ne from "react";
-var g = { exports: {} }, T = {};
-var W;
-function ae() {
-  if (W) return T;
-  W = 1;
-  var c = /* @__PURE__ */ Symbol.for("react.transitional.element"), p = /* @__PURE__ */ Symbol.for("react.fragment");
-  function u(_, f, m) {
-    var b = null;
-    if (m !== void 0 && (b = "" + m), f.key !== void 0 && (b = "" + f.key), "key" in f) {
-      m = {};
-      for (var v in f)
-        v !== "key" && (m[v] = f[v]);
-    } else m = f;
-    return f = m.ref, {
-      $$typeof: c,
-      type: _,
-      key: b,
-      ref: f !== void 0 ? f : null,
-      props: m
+import gt, { useRef as J, useState as be, useMemo as V, useCallback as ze, useEffect as he, useLayoutEffect as Me } from "react";
+var pe = { exports: {} }, se = {};
+var De;
+function wt() {
+  if (De) return se;
+  De = 1;
+  var r = /* @__PURE__ */ Symbol.for("react.transitional.element"), n = /* @__PURE__ */ Symbol.for("react.fragment");
+  function o(c, i, s) {
+    var _ = null;
+    if (s !== void 0 && (_ = "" + s), i.key !== void 0 && (_ = "" + i.key), "key" in i) {
+      s = {};
+      for (var y in i)
+        y !== "key" && (s[y] = i[y]);
+    } else s = i;
+    return i = s.ref, {
+      $$typeof: r,
+      type: c,
+      key: _,
+      ref: i !== void 0 ? i : null,
+      props: s
     };
   }
-  return T.Fragment = p, T.jsx = u, T.jsxs = u, T;
+  return se.Fragment = n, se.jsx = o, se.jsxs = o, se;
 }
-var x = {};
-var U;
-function oe() {
-  return U || (U = 1, process.env.NODE_ENV !== "production" && (function() {
-    function c(e) {
-      if (e == null) return null;
-      if (typeof e == "function")
-        return e.$$typeof === ee ? null : e.displayName || e.name || null;
-      if (typeof e == "string") return e;
-      switch (e) {
-        case O:
+var ae = {};
+var Ye;
+function Nt() {
+  return Ye || (Ye = 1, process.env.NODE_ENV !== "production" && (function() {
+    function r(t) {
+      if (t == null) return null;
+      if (typeof t == "function")
+        return t.$$typeof === we ? null : t.displayName || t.name || null;
+      if (typeof t == "string") return t;
+      switch (t) {
+        case M:
           return "Fragment";
-        case z:
+        case oe:
           return "Profiler";
-        case J:
+        case ye:
           return "StrictMode";
-        case H:
+        case ce:
           return "Suspense";
-        case Z:
+        case le:
           return "SuspenseList";
-        case K:
+        case ge:
           return "Activity";
       }
-      if (typeof e == "object")
-        switch (typeof e.tag == "number" && console.error(
+      if (typeof t == "object")
+        switch (typeof t.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
-        ), e.$$typeof) {
-          case k:
+        ), t.$$typeof) {
+          case q:
             return "Portal";
-          case X:
-            return e.displayName || "Context";
+          case ie:
+            return t.displayName || "Context";
+          case ke:
+            return (t._context.displayName || "Context") + ".Consumer";
+          case I:
+            var m = t.render;
+            return t = t.displayName, t || (t = m.displayName || m.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
+          case ue:
+            return m = t.displayName || null, m !== null ? m : r(t.type) || "Memo";
           case G:
-            return (e._context.displayName || "Context") + ".Consumer";
-          case B:
-            var r = e.render;
-            return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
-          case Q:
-            return r = e.displayName || null, r !== null ? r : c(e.type) || "Memo";
-          case S:
-            r = e._payload, e = e._init;
+            m = t._payload, t = t._init;
             try {
-              return c(e(r));
+              return r(t(m));
             } catch {
             }
         }
       return null;
     }
-    function p(e) {
-      return "" + e;
+    function n(t) {
+      return "" + t;
     }
-    function u(e) {
+    function o(t) {
       try {
-        p(e);
-        var r = !1;
+        n(t);
+        var m = !1;
       } catch {
-        r = !0;
+        m = !0;
       }
-      if (r) {
-        r = console;
-        var a = r.error, s = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
-        return a.call(
-          r,
+      if (m) {
+        m = console;
+        var N = m.error, E = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
+        return N.call(
+          m,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          s
-        ), p(e);
+          E
+        ), n(t);
       }
     }
-    function _(e) {
-      if (e === O) return "<>";
-      if (typeof e == "object" && e !== null && e.$$typeof === S)
+    function c(t) {
+      if (t === M) return "<>";
+      if (typeof t == "object" && t !== null && t.$$typeof === G)
         return "<...>";
       try {
-        var r = c(e);
-        return r ? "<" + r + ">" : "<...>";
+        var m = r(t);
+        return m ? "<" + m + ">" : "<...>";
       } catch {
         return "<...>";
       }
     }
-    function f() {
-      var e = P.A;
-      return e === null ? null : e.getOwner();
+    function i() {
+      var t = U.A;
+      return t === null ? null : t.getOwner();
     }
-    function m() {
+    function s() {
       return Error("react-stack-top-frame");
     }
-    function b(e) {
-      if (I.call(e, "key")) {
-        var r = Object.getOwnPropertyDescriptor(e, "key").get;
-        if (r && r.isReactWarning) return !1;
+    function _(t) {
+      if (P.call(t, "key")) {
+        var m = Object.getOwnPropertyDescriptor(t, "key").get;
+        if (m && m.isReactWarning) return !1;
       }
-      return e.key !== void 0;
+      return t.key !== void 0;
     }
-    function v(e, r) {
-      function a() {
-        Y || (Y = !0, console.error(
+    function y(t, m) {
+      function N() {
+        B || (B = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
-          r
+          m
         ));
       }
-      a.isReactWarning = !0, Object.defineProperty(e, "key", {
-        get: a,
+      N.isReactWarning = !0, Object.defineProperty(t, "key", {
+        get: N,
         configurable: !0
       });
     }
-    function R() {
-      var e = c(this.type);
-      return M[e] || (M[e] = !0, console.error(
+    function p() {
+      var t = r(this.type);
+      return de[t] || (de[t] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
-      )), e = this.props.ref, e !== void 0 ? e : null;
+      )), t = this.props.ref, t !== void 0 ? t : null;
     }
-    function n(e, r, a, s, A, $) {
-      var l = a.ref;
-      return e = {
-        $$typeof: d,
-        type: e,
-        key: r,
-        props: a,
-        _owner: s
-      }, (l !== void 0 ? l : null) !== null ? Object.defineProperty(e, "ref", {
+    function l(t, m, N, E, x, z) {
+      var b = N.ref;
+      return t = {
+        $$typeof: j,
+        type: t,
+        key: m,
+        props: N,
+        _owner: E
+      }, (b !== void 0 ? b : null) !== null ? Object.defineProperty(t, "ref", {
         enumerable: !1,
-        get: R
-      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        get: p
+      }) : Object.defineProperty(t, "ref", { enumerable: !1, value: null }), t._store = {}, Object.defineProperty(t._store, "validated", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: 0
-      }), Object.defineProperty(e, "_debugInfo", {
+      }), Object.defineProperty(t, "_debugInfo", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: null
-      }), Object.defineProperty(e, "_debugStack", {
+      }), Object.defineProperty(t, "_debugStack", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: A
-      }), Object.defineProperty(e, "_debugTask", {
+        value: x
+      }), Object.defineProperty(t, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: $
-      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+        value: z
+      }), Object.freeze && (Object.freeze(t.props), Object.freeze(t)), t;
     }
-    function E(e, r, a, s, A, $) {
-      var l = r.children;
-      if (l !== void 0)
-        if (s)
-          if (re(l)) {
-            for (s = 0; s < l.length; s++)
-              t(l[s]);
-            Object.freeze && Object.freeze(l);
+    function w(t, m, N, E, x, z) {
+      var b = m.children;
+      if (b !== void 0)
+        if (E)
+          if (K(b)) {
+            for (E = 0; E < b.length; E++)
+              u(b[E]);
+            Object.freeze && Object.freeze(b);
           } else
             console.error(
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
-        else t(l);
-      if (I.call(r, "key")) {
-        l = c(e);
-        var h = Object.keys(r).filter(function(te) {
-          return te !== "key";
+        else u(b);
+      if (P.call(m, "key")) {
+        b = r(t);
+        var S = Object.keys(m).filter(function(A) {
+          return A !== "key";
         });
-        s = 0 < h.length ? "{key: someKey, " + h.join(": ..., ") + ": ...}" : "{key: someKey}", D[l + s] || (h = 0 < h.length ? "{" + h.join(": ..., ") + ": ...}" : "{}", console.error(
+        E = 0 < S.length ? "{key: someKey, " + S.join(": ..., ") + ": ...}" : "{key: someKey}", ee[b + E] || (S = 0 < S.length ? "{" + S.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          s,
-          l,
-          h,
-          l
-        ), D[l + s] = !0);
+          E,
+          b,
+          S,
+          b
+        ), ee[b + E] = !0);
       }
-      if (l = null, a !== void 0 && (u(a), l = "" + a), b(r) && (u(r.key), l = "" + r.key), "key" in r) {
-        a = {};
-        for (var C in r)
-          C !== "key" && (a[C] = r[C]);
-      } else a = r;
-      return l && v(
-        a,
-        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
-      ), n(
-        e,
-        l,
-        a,
-        f(),
-        A,
-        $
+      if (b = null, N !== void 0 && (o(N), b = "" + N), _(m) && (o(m.key), b = "" + m.key), "key" in m) {
+        N = {};
+        for (var O in m)
+          O !== "key" && (N[O] = m[O]);
+      } else N = m;
+      return b && y(
+        N,
+        typeof t == "function" ? t.displayName || t.name || "Unknown" : t
+      ), l(
+        t,
+        b,
+        N,
+        i(),
+        x,
+        z
       );
     }
-    function t(e) {
-      o(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === S && (e._payload.status === "fulfilled" ? o(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    function u(t) {
+      k(t) ? t._store && (t._store.validated = 1) : typeof t == "object" && t !== null && t.$$typeof === G && (t._payload.status === "fulfilled" ? k(t._payload.value) && t._payload.value._store && (t._payload.value._store.validated = 1) : t._store && (t._store.validated = 1));
     }
-    function o(e) {
-      return typeof e == "object" && e !== null && e.$$typeof === d;
+    function k(t) {
+      return typeof t == "object" && t !== null && t.$$typeof === j;
     }
-    var i = ne, d = /* @__PURE__ */ Symbol.for("react.transitional.element"), k = /* @__PURE__ */ Symbol.for("react.portal"), O = /* @__PURE__ */ Symbol.for("react.fragment"), J = /* @__PURE__ */ Symbol.for("react.strict_mode"), z = /* @__PURE__ */ Symbol.for("react.profiler"), G = /* @__PURE__ */ Symbol.for("react.consumer"), X = /* @__PURE__ */ Symbol.for("react.context"), B = /* @__PURE__ */ Symbol.for("react.forward_ref"), H = /* @__PURE__ */ Symbol.for("react.suspense"), Z = /* @__PURE__ */ Symbol.for("react.suspense_list"), Q = /* @__PURE__ */ Symbol.for("react.memo"), S = /* @__PURE__ */ Symbol.for("react.lazy"), K = /* @__PURE__ */ Symbol.for("react.activity"), ee = /* @__PURE__ */ Symbol.for("react.client.reference"), P = i.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, I = Object.prototype.hasOwnProperty, re = Array.isArray, N = console.createTask ? console.createTask : function() {
+    var v = gt, j = /* @__PURE__ */ Symbol.for("react.transitional.element"), q = /* @__PURE__ */ Symbol.for("react.portal"), M = /* @__PURE__ */ Symbol.for("react.fragment"), ye = /* @__PURE__ */ Symbol.for("react.strict_mode"), oe = /* @__PURE__ */ Symbol.for("react.profiler"), ke = /* @__PURE__ */ Symbol.for("react.consumer"), ie = /* @__PURE__ */ Symbol.for("react.context"), I = /* @__PURE__ */ Symbol.for("react.forward_ref"), ce = /* @__PURE__ */ Symbol.for("react.suspense"), le = /* @__PURE__ */ Symbol.for("react.suspense_list"), ue = /* @__PURE__ */ Symbol.for("react.memo"), G = /* @__PURE__ */ Symbol.for("react.lazy"), ge = /* @__PURE__ */ Symbol.for("react.activity"), we = /* @__PURE__ */ Symbol.for("react.client.reference"), U = v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, P = Object.prototype.hasOwnProperty, K = Array.isArray, X = console.createTask ? console.createTask : function() {
       return null;
     };
-    i = {
-      react_stack_bottom_frame: function(e) {
-        return e();
+    v = {
+      react_stack_bottom_frame: function(t) {
+        return t();
       }
     };
-    var Y, M = {}, L = i.react_stack_bottom_frame.bind(
-      i,
-      m
-    )(), F = N(_(m)), D = {};
-    x.Fragment = O, x.jsx = function(e, r, a) {
-      var s = 1e4 > P.recentlyCreatedOwnerStacks++;
-      return E(
-        e,
-        r,
-        a,
+    var B, de = {}, Q = v.react_stack_bottom_frame.bind(
+      v,
+      s
+    )(), L = X(c(s)), ee = {};
+    ae.Fragment = M, ae.jsx = function(t, m, N) {
+      var E = 1e4 > U.recentlyCreatedOwnerStacks++;
+      return w(
+        t,
+        m,
+        N,
         !1,
-        s ? Error("react-stack-top-frame") : L,
-        s ? N(_(e)) : F
+        E ? Error("react-stack-top-frame") : Q,
+        E ? X(c(t)) : L
       );
-    }, x.jsxs = function(e, r, a) {
-      var s = 1e4 > P.recentlyCreatedOwnerStacks++;
-      return E(
-        e,
-        r,
-        a,
+    }, ae.jsxs = function(t, m, N) {
+      var E = 1e4 > U.recentlyCreatedOwnerStacks++;
+      return w(
+        t,
+        m,
+        N,
         !0,
-        s ? Error("react-stack-top-frame") : L,
-        s ? N(_(e)) : F
+        E ? Error("react-stack-top-frame") : Q,
+        E ? X(c(t)) : L
       );
     };
-  })()), x;
+  })()), ae;
 }
-var V;
-function se() {
-  return V || (V = 1, process.env.NODE_ENV === "production" ? g.exports = ae() : g.exports = oe()), g.exports;
+var qe;
+function Et() {
+  return qe || (qe = 1, process.env.NODE_ENV === "production" ? pe.exports = wt() : pe.exports = Nt()), pe.exports;
 }
-var y = se();
-const le = "_timeline_x6ik7_1", j = {
-  timeline: le,
+var a = Et();
+const jt = "_timeline_x6ik7_1", ve = {
+  timeline: jt,
   "timeline-items": "_timeline-items_x6ik7_6",
   "timeline-item": "_timeline-item_x6ik7_6",
   "timeline-indicator": "_timeline-indicator_x6ik7_26"
 };
-function q() {
-  var c = Math.floor(120 + Math.random() * 91), p = Math.floor(120 + Math.random() * 91), u = Math.floor(120 + Math.random() * 91);
-  return `rgb(${c},${p},${u})`;
+function Ue() {
+  var r = Math.floor(120 + Math.random() * 91), n = Math.floor(120 + Math.random() * 91), o = Math.floor(120 + Math.random() * 91);
+  return `rgb(${r},${n},${o})`;
 }
-const ie = new Array(20).fill(0).map(q);
-function me({ items: c, currentTime: p, totalTime: u, scale: _ = 1, indicator: f, itemStyle: m }) {
-  const b = c.map((n, E) => {
-    let t, o;
-    if (Array.isArray(n.time))
-      [t, o] = n.time;
-    else if (t = n.time, E === c.length - 1)
-      o = u;
+const Rt = new Array(20).fill(0).map(Ue);
+function Er({ items: r, currentTime: n, totalTime: o, scale: c = 1, indicator: i, itemStyle: s }) {
+  const _ = r.map((l, w) => {
+    let u, k;
+    if (Array.isArray(l.time))
+      [u, k] = l.time;
+    else if (u = l.time, w === r.length - 1)
+      k = o;
     else {
-      const i = c[E + 1];
-      o = Array.isArray(i.time) ? i.time[0] : i.time;
+      const v = r[w + 1];
+      k = Array.isArray(v.time) ? v.time[0] : v.time;
     }
-    return { ...n, start: t, end: o };
-  }).filter((n) => n.start >= 0);
-  let v = 0;
-  const R = [];
-  return b.forEach((n, E) => {
-    let t;
-    if (n.level !== void 0)
-      t = n.level;
+    return { ...l, start: u, end: k };
+  }).filter((l) => l.start >= 0);
+  let y = 0;
+  const p = [];
+  return _.forEach((l, w) => {
+    let u;
+    if (l.level !== void 0)
+      u = l.level;
     else {
-      t = 0;
-      const i = R.filter((d) => n.start < d.end && n.end > d.start).map((d) => d.level);
-      for (; i.includes(t); )
-        t++;
+      u = 0;
+      const v = p.filter((j) => l.start < j.end && l.end > j.start).map((j) => j.level);
+      for (; v.includes(u); )
+        u++;
     }
-    t > v && (v = t), R.push({ ...n, level: t });
-  }), y.jsxs("div", { className: j.timeline, children: [y.jsx("div", { className: j["timeline-indicator"], ...f }), y.jsx("div", { className: j["timeline-items"], style: {
-    "--translate": `${50 - p / u * _ * 100}%`,
-    height: `${(v + 1) * 40}px`
+    u > y && (y = u), p.push({ ...l, level: u });
+  }), a.jsxs("div", { className: ve.timeline, children: [a.jsx("div", { className: ve["timeline-indicator"], ...i }), a.jsx("div", { className: ve["timeline-items"], style: {
+    "--translate": `${50 - n / o * c * 100}%`,
+    height: `${(y + 1) * 40}px`
     // 动态计算总高度
-  }, children: R.map((n, E) => {
-    const t = (n.end - n.start) / u * _ * 100 + "%", o = n.start / u * _ * 100 + "%";
-    return y.jsx("span", { className: j["timeline-item"], style: {
-      "--bg": n.style?.background || ie[E % 20],
-      width: t,
-      left: o,
-      top: `${n.level * 40}px`,
+  }, children: p.map((l, w) => {
+    const u = (l.end - l.start) / o * c * 100 + "%", k = l.start / o * c * 100 + "%";
+    return a.jsx("span", { className: ve["timeline-item"], style: {
+      "--bg": l.style?.background || Rt[w % 20],
+      width: u,
+      left: k,
+      top: `${l.level * 40}px`,
       // 重叠时垂直偏移，每一层 40px
       position: "absolute",
-      ...m,
-      ...n.style
-    }, children: n.content }, E);
+      ...s,
+      ...l.style
+    }, children: l.content }, w);
   }) })] });
 }
-const ce = "_timeline_kp8su_1", w = {
-  timeline: ce,
+const Tt = "_timeline_kp8su_1", xe = {
+  timeline: Tt,
   "timeline-items": "_timeline-items_kp8su_6",
   "timeline-item": "_timeline-item_kp8su_6",
   "timeline-indicator": "_timeline-indicator_kp8su_25"
-}, ue = new Array(20).fill(0).map(q);
-function de({ items: c, currentTime: p, totalTime: u, scale: _ = 1, indicator: f, itemStyle: m, prev: b = 2, height: v, left: R = 10 }) {
-  const n = c.map((t, o) => {
-    let i, d;
-    if (Array.isArray(t.time))
-      [i, d] = t.time;
-    else if (i = t.time, o === c.length - 1)
-      d = u;
+}, Mt = new Array(20).fill(0).map(Ue);
+function jr({ items: r, currentTime: n, totalTime: o, scale: c = 1, indicator: i, itemStyle: s, prev: _ = 2, height: y, left: p = 10 }) {
+  const l = r.map((u, k) => {
+    let v, j;
+    if (Array.isArray(u.time))
+      [v, j] = u.time;
+    else if (v = u.time, k === r.length - 1)
+      j = o;
     else {
-      const k = c[o + 1];
-      d = Array.isArray(k.time) ? k.time[0] : k.time;
+      const q = r[k + 1];
+      j = Array.isArray(q.time) ? q.time[0] : q.time;
     }
-    return { ...t, start: i, end: d };
-  }).filter((t) => t.start >= 0), E = n.filter((t, o) => {
-    const i = n[o + b] || n[n.length - 1];
-    return p <= i.start;
+    return { ...u, start: v, end: j };
+  }).filter((u) => u.start >= 0), w = l.filter((u, k) => {
+    const v = l[k + _] || l[l.length - 1];
+    return n <= v.start;
   });
-  return y.jsxs("div", { className: w.timeline, style: { height: v }, children: [y.jsx("div", { className: w["timeline-indicator"], ...f, style: { left: `${R}%` } }), y.jsx("div", { className: w["timeline-items"], style: {
-    "--translate": `${R - p / u * _ * 100}%`
-  }, children: E.map((t, o) => {
-    const i = (t.end - t.start) / u * _ * 100 + "%", d = t.start / u * _ * 100 + "%";
-    return y.jsx("div", { className: w["timeline-item"], style: {
-      "--bg": t.style?.background || ue[o % 20],
-      width: i,
-      left: d,
-      top: `${o * 35}px`,
+  return a.jsxs("div", { className: xe.timeline, style: { height: y }, children: [a.jsx("div", { className: xe["timeline-indicator"], ...i, style: { left: `${p}%` } }), a.jsx("div", { className: xe["timeline-items"], style: {
+    "--translate": `${p - n / o * c * 100}%`
+  }, children: w.map((u, k) => {
+    const v = (u.end - u.start) / o * c * 100 + "%", j = u.start / o * c * 100 + "%";
+    return a.jsx("div", { className: xe["timeline-item"], style: {
+      "--bg": u.style?.background || Mt[k % 20],
+      width: v,
+      left: j,
+      top: `${k * 35}px`,
       // 垂直时间轴不受 Level 影响，始终使用 index 实现自动补位
       position: "absolute",
-      ...m,
-      ...t.style
-    }, children: t.content }, t.start + o);
+      ...s,
+      ...u.style
+    }, children: u.content }, u.start + k);
   }) })] });
 }
+const At = "_waterfall_113bd_1", Ct = "_popover_113bd_2", $t = "_timebar_113bd_62", Lt = "_timeItem_113bd_73", Ot = "_toolbar_113bd_84", St = "_search_113bd_94", Ft = "_zoom_113bd_132", It = "_zoomItem_113bd_141", Pt = "_zoomActive_113bd_155", zt = "_scroller_113bd_161", Dt = "_canvas_113bd_168", Yt = "_ruler_113bd_173", qt = "_rulerLabel_113bd_183", Wt = "_rulerTrack_113bd_198", Vt = "_rulerDim_113bd_204", Ut = "_tick_113bd_213", Xt = "_grid_113bd_228", Bt = "_rows_113bd_238", Ht = "_row_113bd_238", Jt = "_label_113bd_246", Zt = "_track_113bd_249", Gt = "_dot_113bd_269", Kt = "_name_113bd_276", Qt = "_tag_113bd_284", er = "_duration_113bd_297", tr = "_mark_113bd_305", rr = "_bar_113bd_318", nr = "_barActive_113bd_344", sr = "_barText_113bd_349", ar = "_idTag_113bd_353", or = "_dim_113bd_360", ir = "_cursor_113bd_369", cr = "_empty_113bd_388", lr = "_popoverHead_113bd_415", ur = "_close_113bd_430", dr = "_kv_113bd_448", mr = "_raw_113bd_464", Ae = {
+  waterfall: At,
+  popover: Ct,
+  timebar: $t,
+  timeItem: Lt,
+  toolbar: Ot,
+  search: St,
+  zoom: Ft,
+  zoomItem: It,
+  zoomActive: Pt,
+  scroller: zt,
+  canvas: Dt,
+  ruler: Yt,
+  rulerLabel: qt,
+  rulerTrack: Wt,
+  rulerDim: Vt,
+  tick: Ut,
+  grid: Xt,
+  rows: Bt,
+  row: Ht,
+  label: Jt,
+  track: Zt,
+  dot: Gt,
+  name: Kt,
+  tag: Qt,
+  duration: er,
+  mark: tr,
+  bar: rr,
+  barActive: nr,
+  barText: sr,
+  idTag: ar,
+  dim: or,
+  cursor: ir,
+  empty: cr,
+  popoverHead: lr,
+  close: ur,
+  kv: dr,
+  raw: mr
+}, Xe = { type: "clock", millisecond: !0 }, fr = [0.5, 1, 1.5, 2, 4, 8, 16], _r = {
+  search: "搜索片段",
+  noMatch: (r) => `没有匹配 “${r}” 的片段`,
+  empty: "暂无时间线数据",
+  current: "当前",
+  total: "总",
+  track: "轨道",
+  start: "开始",
+  end: "结束",
+  duration: "时长",
+  close: "关闭详情",
+  zoom: "缩放",
+  lanesColumn: "轨道",
+  sequenceColumn: "片段"
+};
+function D(r) {
+  const n = Number.isFinite(r.duration) ? Math.max(r.duration, 0) : 0;
+  return r.start + n;
+}
+function Be(r, n, o) {
+  const c = r.length > 0;
+  let i = 0, s = 0;
+  c && (i = 1 / 0, s = -1 / 0, r.forEach((l) => {
+    Number.isFinite(l.start) && (i = Math.min(i, l.start));
+    const w = D(l);
+    Number.isFinite(w) && (s = Math.max(s, w));
+  }), Number.isFinite(i) || (i = 0), Number.isFinite(s) || (s = i));
+  const _ = typeof n == "number" && Number.isFinite(n) ? n : i, y = c ? Math.max(s - _, 0) : 0, p = typeof o == "number" && Number.isFinite(o) ? Math.max(o, 0) : y;
+  return { start: _, end: _ + p, duration: p };
+}
+function Z(r, n) {
+  return Number.isFinite(r) ? Math.min(Math.max(r, n.start), n.end) : n.start;
+}
+function He(r, n, o) {
+  const c = o ?? Be(r), i = Z(n, c);
+  return r.filter((s) => Number.isFinite(s.start) ? s.start <= i && i <= D(s) : !1);
+}
+function br(r, n, o) {
+  const c = He(r, n, o), i = /* @__PURE__ */ new Map();
+  return c.forEach((s) => {
+    i.set(s.index, s);
+  }), [...i.entries()].sort((s, _) => s[0] - _[0]).map(([, s]) => s);
+}
+function hr(r, n) {
+  const o = n.trim().toLowerCase();
+  return o ? (r.name ?? "").toLowerCase().includes(o) || r.id.toLowerCase().includes(o) : !0;
+}
+function We(r, n, o) {
+  return r?.name ?? `${o.track} ${n}`;
+}
+function pr(r, n, o, c) {
+  if (o === "sequence")
+    return r.map((s, _) => ({ clip: s, order: _ })).sort((s, _) => s.clip.start - _.clip.start || s.order - _.order).map(({ clip: s, order: _ }) => {
+      const y = n?.find((l) => l.index === s.index), p = We(y, s.index, c);
+      return {
+        id: `clip-${s.id}-${_}`,
+        index: s.index,
+        trackName: p,
+        label: s.name ?? s.id,
+        start: s.start,
+        end: D(s),
+        clips: [s]
+      };
+    });
+  const i = /* @__PURE__ */ new Map();
+  return n?.forEach((s) => {
+    i.has(s.index) || i.set(s.index, s);
+  }), r.forEach((s) => {
+    i.has(s.index) || i.set(s.index, void 0);
+  }), [...i.keys()].sort((s, _) => s - _).map((s) => {
+    const _ = i.get(s), y = We(_, s, c), p = r.filter((u) => u.index === s), l = p.map((u) => u.start).filter(Number.isFinite), w = p.map(D).filter(Number.isFinite);
+    return {
+      id: `track-${s}`,
+      index: s,
+      trackName: y,
+      label: y,
+      start: l.length ? Math.min(...l) : 0,
+      end: w.length ? Math.max(...w) : 0,
+      clips: p
+    };
+  });
+}
+function vr(r) {
+  if (!Number.isFinite(r) || r <= 0)
+    return 1;
+  const n = Math.pow(10, Math.floor(Math.log10(r))), o = [1, 2, 5, 10];
+  for (let c = 0; c < o.length; c++) {
+    const i = o[c] * n;
+    if (i >= r)
+      return i;
+  }
+  return 10 * n;
+}
+function xr(r, n, o = 64) {
+  const c = Number.isFinite(n) && n > 0 ? n : 1e-6, i = vr(o / c), s = Math.ceil(r.start / i) * i, _ = [];
+  for (let y = 0; y < 500; y++) {
+    const p = s + y * i;
+    if (p > r.end + i * 1e-6)
+      break;
+    p < r.start - i * 1e-6 || _.push({ value: p, x: (p - r.start) * c });
+  }
+  return {
+    step: i,
+    ticks: _,
+    firstOffset: (s - r.start) * c
+  };
+}
+function Y(r, n = 2) {
+  return String(Math.floor(Math.abs(r))).padStart(n, "0");
+}
+function Je(r) {
+  if (!Number.isFinite(r))
+    return "-";
+  const n = Math.round(r * 1e3) / 1e3;
+  return Object.is(n, -0) ? "0" : String(n);
+}
+function Ze(r, n, o, c) {
+  if (!Number.isFinite(r))
+    return "-";
+  const i = c === "ms" ? 1 : 1e3, s = Number.isFinite(o) ? o : 0, _ = Math.round((s + r) * i), y = _ < 0, p = Math.abs(_), l = Math.floor(p / 36e5), w = Math.floor(p % 36e5 / 6e4), u = Math.floor(p % 6e4 / 1e3), k = p % 1e3;
+  let v = `${Y(l)}:${Y(w)}:${Y(u)}`;
+  return n && (v += `.${Y(k, 3)}`), (y ? "-" : "") + v;
+}
+function Ge(r, n, o, c) {
+  if (!Number.isFinite(r))
+    return "-";
+  const i = Number.isInteger(n) && n > 0 ? n : 25, s = Number.isFinite(o) ? o : 0, _ = c === "ms" ? 1 : 1e3, y = Math.round((s + r) * _ * i / 1e3), p = y < 0, l = Math.abs(y), w = l % i, u = Math.floor(l / i), k = Math.floor(u / 3600), v = Math.floor(u % 3600 / 60), j = u % 60;
+  return `${p ? "-" : ""}${Y(k)}:${Y(v)}:${Y(j)}:${Y(w)}`;
+}
+function yr(r, n = Xe, o = "s") {
+  return typeof n == "function" ? n(r) : n.type === "number" ? Je(r) : n.type === "clock" ? Ze(r, n.millisecond !== !1, n.offset ?? 0, o) : Ge(r, n.fps, n.offset ?? 0, o);
+}
+function kr(r, n = Xe, o = "s") {
+  return typeof n == "function" ? n(r) : n.type === "number" ? Je(r) : n.type === "clock" ? Ze(r, n.millisecond !== !1, 0, o) : Ge(r, n.fps, 0, o);
+}
+const gr = typeof Ae == "object" && Ae ? Ae : {}, f = new Proxy(gr, {
+  get(r, n) {
+    return typeof n == "string" ? r[n] ?? "" : void 0;
+  }
+});
+function Ce(...r) {
+  return r.filter(Boolean).join(" ");
+}
+function $e(r) {
+  return `var(--wf-clip-${(r % 6 + 6) % 6 + 1})`;
+}
+function wr(r) {
+  if (!r)
+    return;
+  const n = r.trim().replace(/^#/, "");
+  if (!/^[0-9a-fA-F]{6}$/.test(n))
+    return;
+  const o = parseInt(n.slice(0, 2), 16), c = parseInt(n.slice(2, 4), 16), i = parseInt(n.slice(4, 6), 16);
+  return 0.299 * o + 0.587 * c + 0.114 * i > 150 ? "#14161c" : "#ffffff";
+}
+function Ve(r, n) {
+  const o = n.trim();
+  if (!o)
+    return r;
+  const c = r.toLowerCase().indexOf(o.toLowerCase());
+  return c < 0 ? r : a.jsxs(a.Fragment, { children: [r.slice(0, c), a.jsx("mark", { className: f.mark, children: r.slice(c, c + o.length) }), r.slice(c + o.length)] });
+}
+function Rr({ clips: r, tracks: n, layout: o = "lanes", unit: c = "s", viewStart: i, viewDuration: s, currentTime: _, onCurrentTimeChange: y, formatTime: p, formatDuration: l, fixedPlayhead: w = !1, playheadPosition: u = 0.5, followMode: k = "off", zoom: v, defaultZoom: j = 1, onZoomChange: q, labelWidth: M = 220, height: ye = 360, minTickGap: oe = 64, showTime: ke = !0, showDetail: ie = !0, showSearch: I = !0, showZoom: ce = !0, emptyText: le, labels: ue, onClipClick: G, className: ge, style: we }) {
+  const U = J(null), P = J(null), K = J(null), X = J(null), B = J(!1), de = typeof v == "number" && v > 0 ? v : j > 0 ? j : 1, Q = J(de), [L, ee] = be(""), [t, m] = be(j), [N, E] = be(0), [x, z] = be(null), b = V(() => ({ ..._r, ...ue }), [ue]), S = typeof v == "number" && Number.isFinite(v) ? v : t, O = S > 0 ? S : 1, A = k !== "off" ? "sequence" : o, g = V(() => Be(r, i, s), [r, i, s]), Ne = g.duration, Ee = Math.max(Ne, 1), te = Math.max(N - M, 320), T = te / Ee * O, je = Ne * T, Le = Math.min(Math.max(Number.isFinite(u) ? u : 0.5, 0), 1), F = w ? te * Le : 0, Ke = V(() => r.reduce((e, d) => {
+    const h = D(d);
+    return Number.isFinite(h) ? Math.max(e, h) : e;
+  }, g.end), [r, g.end]), Qe = Math.max(g.end, Ke), H = Math.max(Qe - g.start, 0) * T, re = Math.max(H - je, 0), et = w ? Math.max(0, te * (1 - Le) - re) : 0, tt = M + F + H + et, R = typeof _ == "number" && Number.isFinite(_) ? Z(_, g) : void 0, me = ze((e) => yr(e, p, c), [p, c]), fe = ze((e) => l ? l(e) : kr(e, p, c), [l, p, c]), Re = V(() => pr(r, n, A, b), [r, n, A, b]), W = V(() => L.trim() ? Re.map((e) => ({
+    ...e,
+    clips: e.clips.filter((d) => hr(d, L))
+  })).filter((e) => e.clips.length > 0) : Re, [Re, L]), rt = V(() => R === void 0 ? /* @__PURE__ */ new Set() : new Set(He(r, R, g)), [r, R, g]), { step: nt, ticks: st, firstOffset: at } = V(() => xr(g, T, oe), [g, T, oe]), ot = Math.max(nt * T, 1);
+  he(() => {
+    const e = P.current;
+    if (!e)
+      return;
+    const d = () => E(e.clientWidth);
+    if (d(), typeof ResizeObserver > "u")
+      return window.addEventListener("resize", d), () => window.removeEventListener("resize", d);
+    const h = new ResizeObserver(d);
+    return h.observe(e), () => h.disconnect();
+  }, []), he(() => {
+    I || ee("");
+  }, [I]), he(() => {
+    if (!I)
+      return;
+    const e = (d) => {
+      if (!(d.metaKey || d.ctrlKey) || d.key.toLowerCase() !== "f")
+        return;
+      const h = U.current;
+      h && (!B.current && !h.contains(document.activeElement) || (d.preventDefault(), K.current?.focus(), K.current?.select()));
+    };
+    return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
+  }, [I]), he(() => {
+    if (!x)
+      return;
+    const e = (h) => {
+      const C = X.current;
+      C && h.target instanceof Node && C.contains(h.target) || z(null);
+    }, d = (h) => {
+      h.key === "Escape" && z(null);
+    };
+    return document.addEventListener("mousedown", e), document.addEventListener("keydown", d), () => {
+      document.removeEventListener("mousedown", e), document.removeEventListener("keydown", d);
+    };
+  }, [x]), Me(() => {
+    const e = P.current, d = Q.current;
+    if (!e || d === O)
+      return;
+    const h = te / Ee * d;
+    if (w) {
+      const C = Z(R ?? g.start, g);
+      e.scrollLeft = Math.max(0, (C - g.start) * T);
+    } else if (h > 0) {
+      const C = Z(g.start + (e.scrollLeft + e.clientWidth / 2 - M - F) / h, g);
+      e.scrollLeft = Math.max(0, M + F + (C - g.start) * T - e.clientWidth / 2);
+    }
+    Q.current = O;
+  }, [
+    O,
+    te,
+    Ee,
+    w,
+    R,
+    g,
+    T,
+    M,
+    F
+  ]), Me(() => {
+    if (!w)
+      return;
+    const e = P.current;
+    if (!e)
+      return;
+    const d = Z(R ?? g.start, g);
+    e.scrollLeft = Math.max(0, (d - g.start) * T);
+  }, [w, R, g, T]), Me(() => {
+    if (k === "off" || A !== "sequence")
+      return;
+    const e = P.current;
+    if (!e || R === void 0)
+      return;
+    if (k === "hide") {
+      e.scrollTop = 0;
+      return;
+    }
+    const d = e.querySelectorAll('[data-wf="row"]');
+    if (!d.length)
+      return;
+    let h = -1;
+    for (let $ = 0; $ < W.length; $++) {
+      const ne = W[$];
+      if (ne.start <= R && R <= ne.end) {
+        h = $;
+        break;
+      }
+    }
+    if (h < 0) {
+      for (let $ = 0; $ < W.length; $++)
+        if (W[$].end >= R) {
+          h = $;
+          break;
+        }
+    }
+    if (h < 0)
+      return;
+    const C = d[0].getBoundingClientRect().height || 32;
+    e.scrollTop = h * C;
+  }, [k, A, R, W]);
+  const it = (e) => {
+    v === void 0 && m(e), q?.(e);
+  }, Oe = (e, d) => {
+    G?.(e), ie && z({ clip: e, x: d.clientX, y: d.clientY });
+  }, ct = (e) => {
+    if (!y || !Number.isFinite(T) || T <= 0 || e.clientX < M)
+      return;
+    const d = e.currentTarget.getBoundingClientRect(), h = g.start + (e.clientX - d.left) / T;
+    y(Z(h, g));
+  }, lt = (e, d) => {
+    if (!e.clips.length)
+      return;
+    const h = R ?? g.start, C = br(e.clips, h, g)[0], $ = A === "sequence" ? e.clips[0] : C ?? e.clips[0];
+    Oe($, d);
+  }, Te = (e, d) => {
+    const h = L.trim();
+    return h ? e.toLowerCase().includes(h.toLowerCase()) ? Ve(e, L) : d && d.id.toLowerCase().includes(h.toLowerCase()) ? a.jsxs(a.Fragment, { children: [e, " ", a.jsxs("span", { className: f.idTag, children: ["#", Ve(d.id, L)] })] }) : e : e;
+  }, ut = (e) => e.label !== void 0 ? e.label : Te(e.name ?? e.id, e), dt = (e, d) => {
+    const h = D(e);
+    if (!Number.isFinite(e.start) || !Number.isFinite(h) || h < g.start)
+      return null;
+    const C = Math.max(e.start, g.start), $ = (C - g.start) * T, ne = Math.max((h - C) * T, 2), Ie = e.name ?? e.id, Pe = fe(h - e.start);
+    return a.jsx("button", { type: "button", "data-wf": "bar", "data-clip-id": e.id, className: Ce(f.bar, rt.has(e) && f.barActive), style: {
+      left: $,
+      width: ne,
+      background: e.color ?? $e(e.index),
+      color: wr(e.color),
+      ...e.style
+    }, title: `${Ie} · ${Pe}`, "aria-label": `${Ie} ${Pe}`, onClick: (kt) => Oe(e, kt), children: ne > 60 && a.jsx("span", { className: f.barText, children: ut(e) }) }, d);
+  }, Se = k === "hide" && A === "sequence" ? R : void 0, Fe = r.length > 0, mt = Fe && L.trim() ? b.noMatch(L) : le ?? b.empty, ft = !Fe || W.length === 0, _t = 300, bt = typeof window > "u" ? 1024 : window.innerWidth, ht = typeof window > "u" ? 768 : window.innerHeight, pt = x ? Math.max(12, Math.min(x.x + 12, bt - _t - 12)) : 0, vt = x ? Math.max(12, Math.min(x.y + 12, ht - 240)) : 0;
+  let _e = "";
+  if (x?.clip.meta)
+    try {
+      _e = JSON.stringify(x.clip.meta, null, 2);
+    } catch {
+      _e = "[无法序列化的数据]";
+    }
+  const xt = x ? n?.find((e) => e.index === x.clip.index) : void 0, yt = x ? xt?.name ?? `${b.track} ${x.clip.index}` : "";
+  return a.jsxs("div", { ref: U, className: Ce(f.waterfall, ge), style: we, onMouseEnter: () => {
+    B.current = !0;
+  }, onMouseLeave: () => {
+    B.current = !1;
+  }, children: [ke && a.jsxs("div", { className: f.timebar, children: [a.jsxs("span", { className: f.timeItem, "data-wf": "current-time", children: [b.current, "：", a.jsx("b", { children: R === void 0 ? "-" : me(R) })] }), a.jsxs("span", { className: f.timeItem, "data-wf": "total-time", children: [b.total, "：", a.jsx("b", { children: fe(Ne) })] })] }), (I || ce) && a.jsxs("div", { className: f.toolbar, children: [I && a.jsxs("div", { className: f.search, children: [a.jsx("input", { ref: K, "data-wf": "search", value: L, onChange: (e) => ee(e.target.value), placeholder: b.search, "aria-label": b.search }), a.jsx("kbd", { children: "⌘F" })] }), ce && a.jsx("div", { className: f.zoom, role: "group", "aria-label": b.zoom, "data-wf": "zoom", children: fr.map((e) => a.jsxs("button", { type: "button", "data-zoom": e, className: Ce(f.zoomItem, e === O && f.zoomActive), "aria-pressed": e === O, onClick: () => it(e), children: [e, "x"] }, e)) })] }), a.jsx("div", { ref: P, className: f.scroller, style: { height: ye }, "data-wf": "scroller", "data-wf-layout": A, children: a.jsxs("div", { className: f.canvas, "data-wf": "canvas", style: { width: tt }, children: [a.jsxs("div", { className: f.ruler, "data-wf": "ruler", children: [a.jsx("div", { className: f.rulerLabel, "data-wf": "ruler-label", style: { width: M }, children: A === "lanes" ? b.lanesColumn : b.sequenceColumn }), a.jsxs("div", { className: f.rulerTrack, "data-wf": "ruler-track", style: { width: H, marginLeft: F }, onClick: ct, children: [st.map((e) => a.jsx("span", { className: f.tick, style: { left: e.x }, children: me(e.value) }, e.value)), re > 0 && a.jsx("span", { className: f.rulerDim, style: { left: je, width: re } })] })] }), H > 0 && a.jsx("div", { className: f.grid, style: {
+    left: M + F,
+    width: H,
+    backgroundSize: `${ot}px 100%`,
+    backgroundPositionX: at
+  } }), ft ? a.jsx("div", { className: f.empty, "data-wf": "empty", children: mt }) : a.jsx("div", { className: f.rows, children: W.map((e) => a.jsxs("div", { className: f.row, "data-wf": "row", "data-start": e.start, "data-end": e.end, style: Se !== void 0 && e.end < Se ? { display: "none" } : void 0, children: [a.jsxs("div", { className: f.label, style: { width: M }, title: e.label, onClick: (d) => lt(e, d), children: [a.jsx("span", { className: f.dot, style: {
+    background: e.clips[0]?.color ?? $e(e.index)
+  } }), a.jsx("span", { className: f.name, children: A === "sequence" ? Te(e.label, e.clips[0]) : Te(e.label) }), A === "sequence" && a.jsx("span", { className: f.tag, title: e.trackName, children: e.trackName }), A === "sequence" && a.jsx("span", { className: f.duration, children: fe(e.end - e.start) })] }), a.jsx("div", { className: f.track, style: { width: H, marginLeft: F }, children: e.clips.map((d, h) => dt(d, `${e.id}-${h}`)) })] }, e.id)) }), re > 0 && a.jsx("div", { className: f.dim, "data-wf": "dim", style: { left: M + F + je, width: re } }), R !== void 0 && a.jsx("div", { className: f.cursor, "data-wf": "cursor", style: { left: M + F + (R - g.start) * T } })] }) }), ie && x && a.jsxs("div", { ref: X, className: f.popover, "data-wf": "detail", style: { left: pt, top: vt }, role: "dialog", "aria-label": x.clip.name ?? x.clip.id, children: [a.jsxs("div", { className: f.popoverHead, children: [a.jsx("span", { className: f.dot, style: {
+    background: x.clip.color ?? $e(x.clip.index)
+  } }), a.jsx("strong", { title: x.clip.name ?? x.clip.id, children: x.clip.name ?? x.clip.id }), a.jsx("button", { type: "button", className: f.close, "aria-label": b.close, onClick: () => z(null), children: "×" })] }), a.jsxs("dl", { className: f.kv, children: [a.jsx("dt", { children: b.track }), a.jsxs("dd", { children: [x.clip.index, " · ", yt] }), a.jsx("dt", { children: b.start }), a.jsx("dd", { children: me(x.clip.start) }), a.jsx("dt", { children: b.end }), a.jsx("dd", { children: me(D(x.clip)) }), a.jsx("dt", { children: b.duration }), a.jsx("dd", { children: fe(D(x.clip) - x.clip.start) })] }), _e && a.jsx("pre", { className: f.raw, children: _e })] })] });
+}
 export {
-  de as Vertical,
-  me as default
+  Rr as TraceWaterfall,
+  jr as Vertical,
+  pr as buildRows,
+  xr as buildTicks,
+  Er as default,
+  kr as formatDuration,
+  yr as formatTime,
+  He as getActiveAt,
+  D as getClipEnd,
+  br as getTopActiveAt,
+  Be as resolveRange
 };