@vidispine/vdt-react-timeline 23.3.0-pre.1 → 23.3.0-pre.3

package/dist/index.js

@@ -1,140 +1,136 @@
-import { jsx as D, jsxs as te, Fragment as Fe } from "react/jsx-runtime";
-import { useState as re, useRef as U, createContext as Je, useMemo as We, useContext as Ke, useEffect as le, memo as Qe, Children as oe, cloneElement as Le } from "react";
+import { jsx as D, jsxs as te, Fragment as Ze } from "react/jsx-runtime";
+import { useState as re, useRef as U, createContext as Je, useMemo as We, useContext as Ke, useEffect as le, memo as Qe, Children as oe, cloneElement as _e } from "react";
 import ne from "lodash.clamp";
-import F from "clsx";
-import _e from "react-is";
-import { Rect as ee, Stage as ue, Layer as de, Group as Pe, Text as et, Line as tt } from "react-konva";
+import Z from "clsx";
+import Le from "react-is";
+import { Rect as ee, Stage as ue, Layer as fe, Group as Oe, Text as et, Line as tt } from "react-konva";
 import rt from "lodash.sortby";
 import nt from "lodash.uniq";
-const M = (r, i, s, n, l) => r + (l - s) * (i - r) / (n - s), we = (r, i, s) => {
-  process.env.NODE_ENV === "development" && console[s](`${r ? `${r}: ` : ""}${i}`);
+const N = (t, i, s, n, l) => t + (l - s) * (i - t) / (n - s), xe = (t, i, s) => {
+  process.env.NODE_ENV === "development" && console[s](`${t ? `${t}: ` : ""}${i}`);
 }, J = {
-  error: (...r) => we(...r, "error"),
-  warn: (...r) => we(...r, "warn")
+  error: (...t) => xe(...t, "error"),
+  warn: (...t) => xe(...t, "warn")
 };
-function it(r, i) {
+function it(t, i) {
   const s = [];
-  for (let n = 0; n < r.length - 1; n += 1)
-    s.push(i(r[n], r[n + 1]));
+  for (let n = 0; n < t.length - 1; n += 1)
+    s.push(i(t[n], t[n + 1]));
   return s;
 }
-function ae(...r) {
+function ae(...t) {
   const i = getComputedStyle(document.body);
-  return r.map((s) => i.getPropertyValue(s));
+  return t.map((s) => i.getPropertyValue(s));
 }
 function ot({
-  uncontrolledDefaultState: r = void 0,
+  uncontrolledDefaultState: t = void 0,
   uncontrolledOnChange: i = void 0,
   controlledState: s = void 0,
   controlledOnChange: n = void 0,
   componentName: l,
   stateName: o
 }) {
-  const [f, d] = re(r), y = U(null), h = (a) => {
-    y.current !== null && y.current !== a && (a ? J.warn(l, `${o} changed from uncontrolled to controlled`) : J.warn(l, `${o} changed from controlled to uncontrolled`)), y.current = a;
+  const [d, f] = re(t), m = U(null), h = (a) => {
+    m.current !== null && m.current !== a && (a ? J.warn(l, `${o} changed from uncontrolled to controlled`) : J.warn(l, `${o} changed from controlled to uncontrolled`)), m.current = a;
   };
   return s !== void 0 ? (h(!0), [s, n]) : (h(!1), [
-    f,
+    d,
     n ? (...a) => {
-      i ? i(d, ...a) : d(...a), n(...a);
-    } : i || d
+      i ? i(f, ...a) : f(...a), n(...a);
+    } : i || f
   ]);
 }
-function st(r, i, s) {
-  const n = s.end - s.start < 100 && r === "in" ? 1 : 2;
-  return r === "in" ? 1 / n : n;
+function st(t, i, s) {
+  const n = s.end - s.start < 100 && t === "in" ? 1 : 2;
+  return t === "in" ? 1 / n : n;
 }
 function at({
-  start: r,
+  start: t,
   end: i,
   defaultPerspective: s,
   perspective: n,
   onChangePerspective: l,
   zoomMultiplier: o = st
 }) {
-  const [f, d] = ot({
+  const [d, f] = ot({
     uncontrolledDefaultState: s || {
-      start: r,
+      start: t,
       end: i
     },
     controlledState: n,
     controlledOnChange: l,
     componentName: "VdtTimeline",
     stateName: "perspective"
-  }), y = typeof o == "function" ? o : (c) => c === "in" ? 1 / o : o, h = (c, p) => {
-    d({
-      start: ne(Number(c), r, i),
-      end: ne(Number(p), r, i)
+  }), m = typeof o == "function" ? o : (c) => c === "in" ? 1 / o : o, h = (c, p) => {
+    f({
+      start: ne(Number(c), t, i),
+      end: ne(Number(p), t, i)
     });
   };
   return {
-    perspective: f,
+    perspective: d,
     setPerspective: h,
     zoom: (c, p) => {
-      const b = f.end - f.start, E = (p - f.start) / b, g = y(c, p, f);
+      const b = d.end - d.start, E = (p - d.start) / b, g = m(c, p, d);
       if (g === 1)
         return;
-      const w = (f.end - f.start) * g, W = p - E * w, V = p + (1 - E) * w, N = (() => r > W ? r - W : V > i ? i - V : 0)();
+      const w = (d.end - d.start) * g, W = p - E * w, V = p + (1 - E) * w, M = (() => t > W ? t - W : V > i ? i - V : 0)();
       h(
-        W + N,
-        V + N
+        W + M,
+        V + M
       );
     }
   };
 }
 const Ve = Je();
 function ct({
-  start: r,
+  start: t,
   end: i,
   time: s,
   onChangeTime: n,
   timelineRef: l,
   children: o,
-  perspective: f,
-  onChangePerspective: d,
-  defaultPerspective: y
+  perspective: d,
+  onChangePerspective: f,
+  defaultPerspective: m
 }) {
   const h = at({
-    start: r,
+    start: t,
     end: i,
-    perspective: f,
-    onChangePerspective: d,
-    defaultPerspective: y
+    perspective: d,
+    onChangePerspective: f,
+    defaultPerspective: m
   }), a = We(
     () => ({
       ...h,
-      start: r,
+      start: t,
       end: i,
       time: s,
       onChangeTime: n,
       timelineRef: l
     }),
-    [i, n, r, s, h, l]
+    [i, n, t, s, h, l]
   );
   return /* @__PURE__ */ D(Ve.Provider, { value: a, children: o });
 }
 function ie() {
   return Ke(Ve);
 }
-var e = {}, xe = {
-  get exports() {
-    return e;
-  },
-  set exports(r) {
-    e = r;
-  }
-};
+function lt(t) {
+  return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
+}
+var Pe = { exports: {} };
 /*
 object-assign
 (c) Sindre Sorhus
 @license MIT
 */
 var ve, Re;
-function lt() {
+function ut() {
   if (Re)
     return ve;
   Re = 1;
-  var r = Object.getOwnPropertySymbols, i = Object.prototype.hasOwnProperty, s = Object.prototype.propertyIsEnumerable;
+  var t = Object.getOwnPropertySymbols, i = Object.prototype.hasOwnProperty, s = Object.prototype.propertyIsEnumerable;
   function n(o) {
     if (o == null)
       throw new TypeError("Object.assign cannot be called with null or undefined");
@@ -147,12 +143,12 @@ function lt() {
       var o = new String("abc");
       if (o[5] = "de", Object.getOwnPropertyNames(o)[0] === "5")
         return !1;
-      for (var f = {}, d = 0; d < 10; d++)
-        f["_" + String.fromCharCode(d)] = d;
-      var y = Object.getOwnPropertyNames(f).map(function(a) {
-        return f[a];
+      for (var d = {}, f = 0; f < 10; f++)
+        d["_" + String.fromCharCode(f)] = f;
+      var m = Object.getOwnPropertyNames(d).map(function(a) {
+        return d[a];
       });
-      if (y.join("") !== "0123456789")
+      if (m.join("") !== "0123456789")
         return !1;
       var h = {};
       return "abcdefghijklmnopqrst".split("").forEach(function(a) {
@@ -162,51 +158,51 @@ function lt() {
       return !1;
     }
   }
-  return ve = l() ? Object.assign : function(o, f) {
-    for (var d, y = n(o), h, a = 1; a < arguments.length; a++) {
-      d = Object(arguments[a]);
-      for (var c in d)
-        i.call(d, c) && (y[c] = d[c]);
-      if (r) {
-        h = r(d);
+  return ve = l() ? Object.assign : function(o, d) {
+    for (var f, m = n(o), h, a = 1; a < arguments.length; a++) {
+      f = Object(arguments[a]);
+      for (var c in f)
+        i.call(f, c) && (m[c] = f[c]);
+      if (t) {
+        h = t(f);
         for (var p = 0; p < h.length; p++)
-          s.call(d, h[p]) && (y[h[p]] = d[h[p]]);
+          s.call(f, h[p]) && (m[h[p]] = f[h[p]]);
       }
     }
-    return y;
+    return m;
   }, ve;
 }
-var he, ke;
-function Oe() {
-  if (ke)
+var he, je;
+function Ee() {
+  if (je)
     return he;
-  ke = 1;
-  var r = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
-  return he = r, he;
+  je = 1;
+  var t = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
+  return he = t, he;
 }
-var me, je;
-function Ne() {
-  return je || (je = 1, me = Function.call.bind(Object.prototype.hasOwnProperty)), me;
+var ye, ke;
+function Me() {
+  return ke || (ke = 1, ye = Function.call.bind(Object.prototype.hasOwnProperty)), ye;
 }
-var ye, Ae;
-function ut() {
-  if (Ae)
-    return ye;
-  Ae = 1;
-  var r = function() {
+var me, Ce;
+function ft() {
+  if (Ce)
+    return me;
+  Ce = 1;
+  var t = function() {
   };
   if (process.env.NODE_ENV !== "production") {
-    var i = Oe(), s = {}, n = Ne();
-    r = function(o) {
-      var f = "Warning: " + o;
-      typeof console < "u" && console.error(f);
+    var i = Ee(), s = {}, n = Me();
+    t = function(o) {
+      var d = "Warning: " + o;
+      typeof console < "u" && console.error(d);
       try {
-        throw new Error(f);
+        throw new Error(d);
       } catch {
       }
     };
   }
-  function l(o, f, d, y, h) {
+  function l(o, d, f, m, h) {
     if (process.env.NODE_ENV !== "production") {
       for (var a in o)
         if (n(o, a)) {
@@ -214,21 +210,21 @@ function ut() {
           try {
             if (typeof o[a] != "function") {
               var p = Error(
-                (y || "React class") + ": " + d + " type `" + a + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof o[a] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
+                (m || "React class") + ": " + f + " type `" + a + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof o[a] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
               );
               throw p.name = "Invariant Violation", p;
             }
-            c = o[a](f, a, y, d, null, i);
+            c = o[a](d, a, m, f, null, i);
           } catch (E) {
             c = E;
           }
-          if (c && !(c instanceof Error) && r(
-            (y || "React class") + ": type specification of " + d + " `" + a + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof c + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
+          if (c && !(c instanceof Error) && t(
+            (m || "React class") + ": type specification of " + f + " `" + a + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof c + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
           ), c instanceof Error && !(c.message in s)) {
             s[c.message] = !0;
             var b = h ? h() : "";
-            r(
-              "Failed " + d + " type: " + c.message + (b ?? "")
+            t(
+              "Failed " + f + " type: " + c.message + (b ?? "")
             );
           }
         }
@@ -236,30 +232,30 @@ function ut() {
   }
   return l.resetWarningCache = function() {
     process.env.NODE_ENV !== "production" && (s = {});
-  }, ye = l, ye;
+  }, me = l, me;
 }
-var ge, Ce;
+var ge, Ae;
 function dt() {
-  if (Ce)
+  if (Ae)
     return ge;
-  Ce = 1;
-  var r = _e, i = lt(), s = Oe(), n = Ne(), l = ut(), o = function() {
+  Ae = 1;
+  var t = Le, i = ut(), s = Ee(), n = Me(), l = ft(), o = function() {
   };
-  process.env.NODE_ENV !== "production" && (o = function(d) {
-    var y = "Warning: " + d;
-    typeof console < "u" && console.error(y);
+  process.env.NODE_ENV !== "production" && (o = function(f) {
+    var m = "Warning: " + f;
+    typeof console < "u" && console.error(m);
     try {
-      throw new Error(y);
+      throw new Error(m);
     } catch {
     }
   });
-  function f() {
+  function d() {
     return null;
   }
-  return ge = function(d, y) {
+  return ge = function(f, m) {
     var h = typeof Symbol == "function" && Symbol.iterator, a = "@@iterator";
-    function c(t) {
-      var u = t && (h && t[h] || t[a]);
+    function c(r) {
+      var u = r && (h && r[h] || r[a]);
       if (typeof u == "function")
         return u;
     }
@@ -273,30 +269,30 @@ function dt() {
       string: W("string"),
       symbol: W("symbol"),
       any: V(),
-      arrayOf: N,
+      arrayOf: M,
       element: I(),
       elementType: x(),
       instanceOf: $,
-      node: _(),
-      objectOf: L,
+      node: L(),
+      objectOf: _,
       oneOf: H,
-      oneOfType: C,
-      shape: Z,
-      exact: j
+      oneOfType: A,
+      shape: F,
+      exact: k
     };
-    function E(t, u) {
-      return t === u ? t !== 0 || 1 / t === 1 / u : t !== t && u !== u;
+    function E(r, u) {
+      return r === u ? r !== 0 || 1 / r === 1 / u : r !== r && u !== u;
     }
-    function g(t, u) {
-      this.message = t, this.data = u && typeof u == "object" ? u : {}, this.stack = "";
+    function g(r, u) {
+      this.message = r, this.data = u && typeof u == "object" ? u : {}, this.stack = "";
     }
     g.prototype = Error.prototype;
-    function w(t) {
+    function w(r) {
       if (process.env.NODE_ENV !== "production")
         var u = {}, R = 0;
-      function T(A, O, S, v, m, k, G) {
-        if (v = v || p, k = k || S, G !== s) {
-          if (y) {
+      function T(C, O, S, v, y, j, G) {
+        if (v = v || p, j = j || S, G !== s) {
+          if (m) {
             var z = new Error(
               "Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"
             );
@@ -305,23 +301,23 @@ function dt() {
             var Q = v + ":" + S;
             !u[Q] && // Avoid spamming the console because they are often not actionable except for lib authors
             R < 3 && (o(
-              "You are manually calling a React.PropTypes validation function for the `" + k + "` prop on `" + v + "`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."
+              "You are manually calling a React.PropTypes validation function for the `" + j + "` prop on `" + v + "`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."
             ), u[Q] = !0, R++);
           }
         }
-        return O[S] == null ? A ? O[S] === null ? new g("The " + m + " `" + k + "` is marked as required " + ("in `" + v + "`, but its value is `null`.")) : new g("The " + m + " `" + k + "` is marked as required in " + ("`" + v + "`, but its value is `undefined`.")) : null : t(O, S, v, m, k);
+        return O[S] == null ? C ? O[S] === null ? new g("The " + y + " `" + j + "` is marked as required " + ("in `" + v + "`, but its value is `null`.")) : new g("The " + y + " `" + j + "` is marked as required in " + ("`" + v + "`, but its value is `undefined`.")) : null : r(O, S, v, y, j);
       }
       var P = T.bind(null, !1);
       return P.isRequired = T.bind(null, !0), P;
     }
-    function W(t) {
-      function u(R, T, P, A, O, S) {
-        var v = R[T], m = X(v);
-        if (m !== t) {
-          var k = K(v);
+    function W(r) {
+      function u(R, T, P, C, O, S) {
+        var v = R[T], y = X(v);
+        if (y !== r) {
+          var j = K(v);
           return new g(
-            "Invalid " + A + " `" + O + "` of type " + ("`" + k + "` supplied to `" + P + "`, expected ") + ("`" + t + "`."),
-            { expectedType: t }
+            "Invalid " + C + " `" + O + "` of type " + ("`" + j + "` supplied to `" + P + "`, expected ") + ("`" + r + "`."),
+            { expectedType: r }
           );
         }
         return null;
@@ -329,135 +325,135 @@ function dt() {
       return w(u);
     }
     function V() {
-      return w(f);
+      return w(d);
     }
-    function N(t) {
-      function u(R, T, P, A, O) {
-        if (typeof t != "function")
+    function M(r) {
+      function u(R, T, P, C, O) {
+        if (typeof r != "function")
           return new g("Property `" + O + "` of component `" + P + "` has invalid PropType notation inside arrayOf.");
         var S = R[T];
         if (!Array.isArray(S)) {
           var v = X(S);
-          return new g("Invalid " + A + " `" + O + "` of type " + ("`" + v + "` supplied to `" + P + "`, expected an array."));
+          return new g("Invalid " + C + " `" + O + "` of type " + ("`" + v + "` supplied to `" + P + "`, expected an array."));
         }
-        for (var m = 0; m < S.length; m++) {
-          var k = t(S, m, P, A, O + "[" + m + "]", s);
-          if (k instanceof Error)
-            return k;
+        for (var y = 0; y < S.length; y++) {
+          var j = r(S, y, P, C, O + "[" + y + "]", s);
+          if (j instanceof Error)
+            return j;
         }
         return null;
       }
       return w(u);
     }
     function I() {
-      function t(u, R, T, P, A) {
+      function r(u, R, T, P, C) {
         var O = u[R];
-        if (!d(O)) {
+        if (!f(O)) {
           var S = X(O);
-          return new g("Invalid " + P + " `" + A + "` of type " + ("`" + S + "` supplied to `" + T + "`, expected a single ReactElement."));
+          return new g("Invalid " + P + " `" + C + "` of type " + ("`" + S + "` supplied to `" + T + "`, expected a single ReactElement."));
         }
         return null;
       }
-      return w(t);
+      return w(r);
     }
     function x() {
-      function t(u, R, T, P, A) {
+      function r(u, R, T, P, C) {
         var O = u[R];
-        if (!r.isValidElementType(O)) {
+        if (!t.isValidElementType(O)) {
           var S = X(O);
-          return new g("Invalid " + P + " `" + A + "` of type " + ("`" + S + "` supplied to `" + T + "`, expected a single ReactElement type."));
+          return new g("Invalid " + P + " `" + C + "` of type " + ("`" + S + "` supplied to `" + T + "`, expected a single ReactElement type."));
         }
         return null;
       }
-      return w(t);
+      return w(r);
     }
-    function $(t) {
-      function u(R, T, P, A, O) {
-        if (!(R[T] instanceof t)) {
-          var S = t.name || p, v = pe(R[T]);
-          return new g("Invalid " + A + " `" + O + "` of type " + ("`" + v + "` supplied to `" + P + "`, expected ") + ("instance of `" + S + "`."));
+    function $(r) {
+      function u(R, T, P, C, O) {
+        if (!(R[T] instanceof r)) {
+          var S = r.name || p, v = pe(R[T]);
+          return new g("Invalid " + C + " `" + O + "` of type " + ("`" + v + "` supplied to `" + P + "`, expected ") + ("instance of `" + S + "`."));
         }
         return null;
       }
       return w(u);
     }
-    function H(t) {
-      if (!Array.isArray(t))
+    function H(r) {
+      if (!Array.isArray(r))
         return process.env.NODE_ENV !== "production" && (arguments.length > 1 ? o(
           "Invalid arguments supplied to oneOf, expected an array, got " + arguments.length + " arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."
-        ) : o("Invalid argument supplied to oneOf, expected an array.")), f;
-      function u(R, T, P, A, O) {
-        for (var S = R[T], v = 0; v < t.length; v++)
-          if (E(S, t[v]))
+        ) : o("Invalid argument supplied to oneOf, expected an array.")), d;
+      function u(R, T, P, C, O) {
+        for (var S = R[T], v = 0; v < r.length; v++)
+          if (E(S, r[v]))
             return null;
-        var m = JSON.stringify(t, function(G, z) {
+        var y = JSON.stringify(r, function(G, z) {
           var Q = K(z);
           return Q === "symbol" ? String(z) : z;
         });
-        return new g("Invalid " + A + " `" + O + "` of value `" + String(S) + "` " + ("supplied to `" + P + "`, expected one of " + m + "."));
+        return new g("Invalid " + C + " `" + O + "` of value `" + String(S) + "` " + ("supplied to `" + P + "`, expected one of " + y + "."));
       }
       return w(u);
     }
-    function L(t) {
-      function u(R, T, P, A, O) {
-        if (typeof t != "function")
+    function _(r) {
+      function u(R, T, P, C, O) {
+        if (typeof r != "function")
           return new g("Property `" + O + "` of component `" + P + "` has invalid PropType notation inside objectOf.");
         var S = R[T], v = X(S);
         if (v !== "object")
-          return new g("Invalid " + A + " `" + O + "` of type " + ("`" + v + "` supplied to `" + P + "`, expected an object."));
-        for (var m in S)
-          if (n(S, m)) {
-            var k = t(S, m, P, A, O + "." + m, s);
-            if (k instanceof Error)
-              return k;
+          return new g("Invalid " + C + " `" + O + "` of type " + ("`" + v + "` supplied to `" + P + "`, expected an object."));
+        for (var y in S)
+          if (n(S, y)) {
+            var j = r(S, y, P, C, O + "." + y, s);
+            if (j instanceof Error)
+              return j;
           }
         return null;
       }
       return w(u);
     }
-    function C(t) {
-      if (!Array.isArray(t))
-        return process.env.NODE_ENV !== "production" && o("Invalid argument supplied to oneOfType, expected an instance of array."), f;
-      for (var u = 0; u < t.length; u++) {
-        var R = t[u];
+    function A(r) {
+      if (!Array.isArray(r))
+        return process.env.NODE_ENV !== "production" && o("Invalid argument supplied to oneOfType, expected an instance of array."), d;
+      for (var u = 0; u < r.length; u++) {
+        var R = r[u];
         if (typeof R != "function")
           return o(
-            "Invalid argument supplied to oneOfType. Expected an array of check functions, but received " + fe(R) + " at index " + u + "."
-          ), f;
+            "Invalid argument supplied to oneOfType. Expected an array of check functions, but received " + de(R) + " at index " + u + "."
+          ), d;
       }
-      function T(P, A, O, S, v) {
-        for (var m = [], k = 0; k < t.length; k++) {
-          var G = t[k], z = G(P, A, O, S, v, s);
+      function T(P, C, O, S, v) {
+        for (var y = [], j = 0; j < r.length; j++) {
+          var G = r[j], z = G(P, C, O, S, v, s);
           if (z == null)
             return null;
-          z.data && n(z.data, "expectedType") && m.push(z.data.expectedType);
+          z.data && n(z.data, "expectedType") && y.push(z.data.expectedType);
         }
-        var Q = m.length > 0 ? ", expected one of type [" + m.join(", ") + "]" : "";
+        var Q = y.length > 0 ? ", expected one of type [" + y.join(", ") + "]" : "";
         return new g("Invalid " + S + " `" + v + "` supplied to " + ("`" + O + "`" + Q + "."));
       }
       return w(T);
     }
-    function _() {
-      function t(u, R, T, P, A) {
-        return q(u[R]) ? null : new g("Invalid " + P + " `" + A + "` supplied to " + ("`" + T + "`, expected a ReactNode."));
+    function L() {
+      function r(u, R, T, P, C) {
+        return q(u[R]) ? null : new g("Invalid " + P + " `" + C + "` supplied to " + ("`" + T + "`, expected a ReactNode."));
       }
-      return w(t);
+      return w(r);
     }
-    function Y(t, u, R, T, P) {
+    function Y(r, u, R, T, P) {
       return new g(
-        (t || "React class") + ": " + u + " type `" + R + "." + T + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + P + "`."
+        (r || "React class") + ": " + u + " type `" + R + "." + T + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + P + "`."
       );
     }
-    function Z(t) {
-      function u(R, T, P, A, O) {
+    function F(r) {
+      function u(R, T, P, C, O) {
         var S = R[T], v = X(S);
         if (v !== "object")
-          return new g("Invalid " + A + " `" + O + "` of type `" + v + "` " + ("supplied to `" + P + "`, expected `object`."));
-        for (var m in t) {
-          var k = t[m];
-          if (typeof k != "function")
-            return Y(P, A, O, m, K(k));
-          var G = k(S, m, P, A, O + "." + m, s);
+          return new g("Invalid " + C + " `" + O + "` of type `" + v + "` " + ("supplied to `" + P + "`, expected `object`."));
+        for (var y in r) {
+          var j = r[y];
+          if (typeof j != "function")
+            return Y(P, C, O, y, K(j));
+          var G = j(S, y, P, C, O + "." + y, s);
           if (G)
             return G;
         }
@@ -465,22 +461,22 @@ function dt() {
       }
       return w(u);
     }
-    function j(t) {
-      function u(R, T, P, A, O) {
+    function k(r) {
+      function u(R, T, P, C, O) {
         var S = R[T], v = X(S);
         if (v !== "object")
-          return new g("Invalid " + A + " `" + O + "` of type `" + v + "` " + ("supplied to `" + P + "`, expected `object`."));
-        var m = i({}, R[T], t);
-        for (var k in m) {
-          var G = t[k];
-          if (n(t, k) && typeof G != "function")
-            return Y(P, A, O, k, K(G));
+          return new g("Invalid " + C + " `" + O + "` of type `" + v + "` " + ("supplied to `" + P + "`, expected `object`."));
+        var y = i({}, R[T], r);
+        for (var j in y) {
+          var G = r[j];
+          if (n(r, j) && typeof G != "function")
+            return Y(P, C, O, j, K(G));
           if (!G)
             return new g(
-              "Invalid " + A + " `" + O + "` key `" + k + "` supplied to `" + P + "`.\nBad object: " + JSON.stringify(R[T], null, "  ") + `
-Valid keys: ` + JSON.stringify(Object.keys(t), null, "  ")
+              "Invalid " + C + " `" + O + "` key `" + j + "` supplied to `" + P + "`.\nBad object: " + JSON.stringify(R[T], null, "  ") + `
+Valid keys: ` + JSON.stringify(Object.keys(r), null, "  ")
             );
-          var z = G(S, k, P, A, O + "." + k, s);
+          var z = G(S, j, P, C, O + "." + j, s);
           if (z)
             return z;
         }
@@ -488,23 +484,23 @@ Valid keys: ` + JSON.stringify(Object.keys(t), null, "  ")
       }
       return w(u);
     }
-    function q(t) {
-      switch (typeof t) {
+    function q(r) {
+      switch (typeof r) {
         case "number":
         case "string":
         case "undefined":
           return !0;
         case "boolean":
-          return !t;
+          return !r;
         case "object":
-          if (Array.isArray(t))
-            return t.every(q);
-          if (t === null || d(t))
+          if (Array.isArray(r))
+            return r.every(q);
+          if (r === null || f(r))
             return !0;
-          var u = c(t);
+          var u = c(r);
           if (u) {
-            var R = u.call(t), T;
-            if (u !== t.entries) {
+            var R = u.call(r), T;
+            if (u !== r.entries) {
               for (; !(T = R.next()).done; )
                 if (!q(T.value))
                   return !1;
@@ -521,27 +517,27 @@ Valid keys: ` + JSON.stringify(Object.keys(t), null, "  ")
           return !1;
       }
     }
-    function B(t, u) {
-      return t === "symbol" ? !0 : u ? u["@@toStringTag"] === "Symbol" || typeof Symbol == "function" && u instanceof Symbol : !1;
+    function B(r, u) {
+      return r === "symbol" ? !0 : u ? u["@@toStringTag"] === "Symbol" || typeof Symbol == "function" && u instanceof Symbol : !1;
     }
-    function X(t) {
-      var u = typeof t;
-      return Array.isArray(t) ? "array" : t instanceof RegExp ? "object" : B(u, t) ? "symbol" : u;
+    function X(r) {
+      var u = typeof r;
+      return Array.isArray(r) ? "array" : r instanceof RegExp ? "object" : B(u, r) ? "symbol" : u;
     }
-    function K(t) {
-      if (typeof t > "u" || t === null)
-        return "" + t;
-      var u = X(t);
+    function K(r) {
+      if (typeof r > "u" || r === null)
+        return "" + r;
+      var u = X(r);
       if (u === "object") {
-        if (t instanceof Date)
+        if (r instanceof Date)
           return "date";
-        if (t instanceof RegExp)
+        if (r instanceof RegExp)
           return "regexp";
       }
       return u;
     }
-    function fe(t) {
-      var u = K(t);
+    function de(r) {
+      var u = K(r);
       switch (u) {
         case "array":
         case "object":
@@ -554,25 +550,25 @@ Valid keys: ` + JSON.stringify(Object.keys(t), null, "  ")
           return u;
       }
     }
-    function pe(t) {
-      return !t.constructor || !t.constructor.name ? p : t.constructor.name;
+    function pe(r) {
+      return !r.constructor || !r.constructor.name ? p : r.constructor.name;
     }
     return b.checkPropTypes = l, b.resetWarningCache = l.resetWarningCache, b.PropTypes = b, b;
   }, ge;
 }
 var Te, De;
-function ft() {
+function pt() {
   if (De)
     return Te;
   De = 1;
-  var r = Oe();
+  var t = Ee();
   function i() {
   }
   function s() {
   }
   return s.resetWarningCache = i, Te = function() {
-    function n(f, d, y, h, a, c) {
-      if (c !== r) {
+    function n(d, f, m, h, a, c) {
+      if (c !== t) {
         var p = new Error(
           "Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types"
         );
@@ -610,20 +606,22 @@ function ft() {
   }, Te;
 }
 if (process.env.NODE_ENV !== "production") {
-  var pt = _e, vt = !0;
-  xe.exports = dt()(pt.isElement, vt);
+  var vt = Le, ht = !0;
+  Pe.exports = dt()(vt.isElement, ht);
 } else
-  xe.exports = ft()();
-function Me({
-  start: r,
+  Pe.exports = pt()();
+var yt = Pe.exports;
+const e = /* @__PURE__ */ lt(yt);
+function Ne({
+  start: t,
   end: i,
   time: s,
   onChangeTime: n,
   children: l,
   className: o,
-  perspective: f,
-  onChangePerspective: d,
-  defaultPerspective: y,
+  perspective: d,
+  onChangePerspective: f,
+  defaultPerspective: m,
   zoomMultiplier: h,
   ...a
 }) {
@@ -631,20 +629,20 @@ function Me({
   return /* @__PURE__ */ D(
     ct,
     {
-      start: r,
+      start: t,
       end: i,
       time: s,
       onChangeTime: n,
       timelineRef: c,
-      perspective: f,
-      onChangePerspective: d,
-      defaultPerspective: y,
+      perspective: d,
+      onChangePerspective: f,
+      defaultPerspective: m,
       zoomMultiplier: h,
-      children: /* @__PURE__ */ D("div", { ref: c, className: F("VdtTimeline-root", o), ...a, children: l })
+      children: /* @__PURE__ */ D("div", { ref: c, className: Z("VdtTimeline-root", o), ...a, children: l })
     }
   );
 }
-Me.propTypes = {
+Ne.propTypes = {
   /**
    * Start of timeline.
    */
@@ -686,7 +684,7 @@ Me.propTypes = {
    */
   className: e.string
 };
-Me.defaultProps = {
+Ne.defaultProps = {
   time: void 0,
   children: void 0,
   onChangeTime: void 0,
@@ -697,21 +695,21 @@ Me.defaultProps = {
   className: void 0
 };
 const He = 15, qe = 100;
-const [ht] = ae("--vdt-timeline-palette-secondary"), ze = document.createElement("img");
+const [mt] = ae("--vdt-timeline-palette-secondary"), ze = document.createElement("img");
 ze.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
 function $e({
-  className: r,
+  className: t,
   perspective: i,
   time: s,
   lineWidth: n,
   headWidth: l,
   headHeight: o,
-  style: f,
-  onDrag: d,
-  HeadProps: y,
+  style: d,
+  onDrag: f,
+  HeadProps: m,
   ...h
 }) {
-  var L;
+  var _;
   const { perspective: a, time: c, onChangeTime: p } = ie() || {
     perspective: i,
     time: s
@@ -720,40 +718,40 @@ function $e({
     "VdtTimelinePlayhead",
     "missing 'perspective' prop. If the component is used outside a VdtTimelineContext, 'perspective' must be passed explicitly"
   );
-  const b = U(), E = (L = b.current) == null ? void 0 : L.parentElement, g = (E == null ? void 0 : E.clientWidth) || 0, [w, W] = re(!1), [V, N] = re(c), I = M(0, g, a.start, a.end, V), x = (C) => C <= a.end && C >= a.start, $ = !x(V);
+  const b = U(), E = (_ = b.current) == null ? void 0 : _.parentElement, g = (E == null ? void 0 : E.clientWidth) || 0, [w, W] = re(!1), [V, M] = re(c), I = N(0, g, a.start, a.end, V), x = (A) => A <= a.end && A >= a.start, $ = !x(V);
   le(() => {
-    c !== void 0 && !w && N(c);
+    c !== void 0 && !w && M(c);
   }, [c, w]);
-  const H = d || p && ((C, ..._) => p(..._));
+  const H = f || p && ((A, ...L) => p(...L));
   return /* @__PURE__ */ D(
     "div",
     {
       ref: b,
-      className: F("VdtTimelinePlayhead-root", r),
+      className: Z("VdtTimelinePlayhead-root", t),
       style: {
         width: n,
         left: I,
         display: $ && "none",
         zIndex: qe,
-        ...f
+        ...d
       },
       draggable: !0,
-      onDragStart: (C) => (W(!0), C.dataTransfer.setDragImage(ze, 0, 0), !1),
+      onDragStart: (A) => (W(!0), A.dataTransfer.setDragImage(ze, 0, 0), !1),
       onDragEnd: () => {
         W(!1), H != null && H.flush && H.flush();
       },
-      onDrag: (C) => {
+      onDrag: (A) => {
         if (H) {
-          const { x: _ } = b.current.parentElement.getBoundingClientRect(), Y = M(
+          const { x: L } = b.current.parentElement.getBoundingClientRect(), Y = N(
             a.start,
             a.end,
             0,
             g,
-            C.clientX - _
+            A.clientX - L
           );
           if (x(Y)) {
-            const Z = ne(Y, a.start, a.end);
-            H(C, Z), N(Z);
+            const F = ne(Y, a.start, a.end);
+            H(A, F), M(F);
           }
         }
       },
@@ -766,12 +764,12 @@ function $e({
             position: "absolute",
             height: o,
             width: l,
-            backgroundColor: ht,
+            backgroundColor: mt,
             left: -(l / 2 - n / 2),
             top: -o + 1,
             clipPath: "polygon(0% 0%, 0% 70%, 50% 100%, 100% 70%, 100% 0%)"
           },
-          ...y
+          ...m
         }
       )
     }
@@ -823,24 +821,24 @@ $e.defaultProps = {
   HeadProps: {},
   className: void 0
 };
-function se(r) {
+function se(t) {
   const [i, s] = re({}), n = U(
     new ResizeObserver((l) => {
-      var f;
-      const o = (f = l[0]) == null ? void 0 : f.contentRect;
+      var d;
+      const o = (d = l[0]) == null ? void 0 : d.contentRect;
       o && s(o);
     })
   );
   return le(() => {
-    const l = n == null ? void 0 : n.current, o = r == null ? void 0 : r.current;
+    const l = n == null ? void 0 : n.current, o = t == null ? void 0 : t.current;
     return o && l.observe(o), () => {
       o && l.unobserve(o);
     };
-  }, [r]), i;
+  }, [t]), i;
 }
-const [mt] = ae("--vdt-timeline-palette-primary"), yt = Qe(
-  ({ amplitudeSegments: r, pxPerTimeUnit: i, start: s, height: n, ...l }) => r.map(({ amplitude: o, start: f, end: d }, y) => {
-    const h = i * (d - f), a = (f - s) * i, c = n * o, p = (n - c) / 2;
+const [gt] = ae("--vdt-timeline-palette-primary"), Tt = Qe(
+  ({ amplitudeSegments: t, pxPerTimeUnit: i, start: s, height: n, ...l }) => t.map(({ amplitude: o, start: d, end: f }, m) => {
+    const h = i * (f - d), a = (d - s) * i, c = n * o, p = (n - c) / 2;
     return /* @__PURE__ */ D(
       ee,
       {
@@ -848,23 +846,23 @@ const [mt] = ae("--vdt-timeline-palette-primary"), yt = Qe(
         y: p,
         height: c,
         width: h,
-        fill: mt,
+        fill: gt,
         ...l
       },
-      y
+      m
     );
   })
 );
 function Be({
-  className: r,
+  className: t,
   waveform: i,
   start: s,
   end: n,
   perspective: l,
   StageProps: o,
-  LayerProps: f,
-  RectProps: d,
-  WaveRectProps: y,
+  LayerProps: d,
+  RectProps: f,
+  WaveRectProps: m,
   ...h
 }) {
   const { start: a, end: c, perspective: p } = ie() || {
@@ -879,21 +877,21 @@ function Be({
   const b = U(), { width: E = 0, height: g = 0 } = se(b), w = We(
     () => i.map((I, x) => ({
       amplitude: I,
-      start: M(a, c, 0, i.length - 1, x),
-      end: M(a, c, 0, i.length - 1, x + 1)
+      start: N(a, c, 0, i.length - 1, x),
+      end: N(a, c, 0, i.length - 1, x + 1)
     })),
     [i, a, c]
-  ), W = E / (c - a), V = (c - a) / (p.end - p.start), N = M(0, V * E, a, c, p.start);
-  return /* @__PURE__ */ D("div", { ref: b, className: F("VdtTimelineWaveform-root", r), ...h, children: /* @__PURE__ */ D(ue, { height: g, width: E, x: -N, scaleX: V, ...o, children: /* @__PURE__ */ te(de, { listening: !1, ...f, children: [
-    /* @__PURE__ */ D(ee, { x: 0, y: 0, width: E, height: g, ...d }),
+  ), W = E / (c - a), V = (c - a) / (p.end - p.start), M = N(0, V * E, a, c, p.start);
+  return /* @__PURE__ */ D("div", { ref: b, className: Z("VdtTimelineWaveform-root", t), ...h, children: /* @__PURE__ */ D(ue, { height: g, width: E, x: -M, scaleX: V, ...o, children: /* @__PURE__ */ te(fe, { listening: !1, ...d, children: [
+    /* @__PURE__ */ D(ee, { x: 0, y: 0, width: E, height: g, ...f }),
     /* @__PURE__ */ D(
-      yt,
+      Tt,
       {
         amplitudeSegments: w,
         pxPerTimeUnit: W,
         start: a,
         height: g,
-        ...y
+        ...m
       }
     )
   ] }) }) });
@@ -947,33 +945,33 @@ Be.defaultProps = {
   WaveRectProps: {},
   className: void 0
 };
-function ce({ hoverEffect: r = () => {
+function ce({ hoverEffect: t = () => {
 } } = {}) {
   const [i, s] = re(!1), n = U(null);
   return {
     isHovering: i,
     onMouseEnter: (l) => {
-      s(!0), n.current = r(l);
+      s(!0), n.current = t(l);
     },
     onMouseLeave: () => {
       s(!1), n.current && n.current(), n.current = null;
     }
   };
 }
-const [gt, Tt] = ae(
+const [bt, Pt] = ae(
   "--vdt-timeline-palette-primary",
   "--vdt-timeline-palette-primary-dark"
 ), be = 5;
 function Ge({
-  onClick: r,
+  onClick: t,
   x: i,
   width: s,
   y: n,
   height: l,
   padding: o,
-  start: f,
-  end: d,
-  onHover: y,
+  start: d,
+  end: f,
+  onHover: m,
   onMove: h,
   onMoveStart: a,
   onMoveEnd: c,
@@ -982,42 +980,42 @@ function Ge({
   onResizeEnd: E,
   ...g
 }) {
-  [i, s, n, l].some((j) => j === void 0) && J.error(
+  [i, s, n, l].some((k) => k === void 0) && J.error(
     "VdtTimelineEvent",
     "missing 'x', 'width', 'y', or 'height' props. If the component is not used as a direct child of VdtTimelineTrack, 'x', 'width', 'y', or 'height' must be passed explicitly"
   );
   const w = U(), { isHovering: W, ...V } = ce({
-    hoverEffect: (j) => (y && y(j, !0), () => {
-      y && y(j, !1);
+    hoverEffect: (k) => (m && m(k, !0), () => {
+      m && m(k, !1);
     })
-  }), { isHovering: N, ...I } = ce({
-    hoverEffect: (j) => (p && (j.target.getStage().container().style.cursor = "col-resize"), () => {
-      p && (j.target.getStage().container().style.cursor = "default");
+  }), { isHovering: M, ...I } = ce({
+    hoverEffect: (k) => (p && (k.target.getStage().container().style.cursor = "col-resize"), () => {
+      p && (k.target.getStage().container().style.cursor = "default");
     })
-  }), [x, $] = re(!1), H = !!r;
+  }), [x, $] = re(!1), H = !!t;
   le(() => {
     if (w.current) {
-      const j = (() => x ? "grabbing" : W && H ? "pointer" : "default")();
-      w.current.getStage().container().style.cursor = j;
+      const k = (() => x ? "grabbing" : W && H ? "pointer" : "default")();
+      w.current.getStage().container().style.cursor = k;
     }
   }, [x, W, H]);
-  const L = n + o, C = l - 2 * o, _ = {
-    y: L,
-    height: C,
+  const _ = n + o, A = l - 2 * o, L = {
+    y: _,
+    height: A,
     x: i,
     width: s
-  }, Y = W || N ? {
-    fill: Tt
-  } : {}, Z = (j) => {
-    const q = j === "start" ? i : i + s - be;
+  }, Y = W || M ? {
+    fill: Pt
+  } : {}, F = (k) => {
+    const q = k === "start" ? i : i + s - be;
     return {
       onDragStart: () => {
-        b && b(j);
+        b && b(k);
       },
       draggable: !!p,
-      dragBoundFunc: (B) => ({ x: B.x, y: L }),
+      dragBoundFunc: (B) => ({ x: B.x, y: _ }),
       onDragEnd: () => {
-        E && E(j);
+        E && E(k);
       },
       width: be,
       x: q,
@@ -1027,49 +1025,49 @@ function Ge({
         const { x: X } = B.target.position();
         B.target.x(q);
         const K = Math.floor(
-          M(
-            f,
+          N(
             d,
+            f,
             i,
             i + s,
-            X + (j === "start" ? 0 : be)
+            X + (k === "start" ? 0 : be)
           )
         );
-        p(B, j, K);
+        p(B, k, K);
       }
     };
   };
-  return /* @__PURE__ */ te(Fe, { children: [
+  return /* @__PURE__ */ te(Ze, { children: [
     /* @__PURE__ */ D(
       ee,
       {
         ref: w,
         draggable: !!h,
-        dragBoundFunc: (j) => ({ x: j.x, y: L }),
-        onDragStart: (j) => {
-          h && ($(!0), a && a(j));
+        dragBoundFunc: (k) => ({ x: k.x, y: _ }),
+        onDragStart: (k) => {
+          h && ($(!0), a && a(k));
         },
-        onDragEnd: (j) => {
-          h && ($(!1), c && c(j));
+        onDragEnd: (k) => {
+          h && ($(!1), c && c(k));
         },
-        onDragMove: (j) => {
+        onDragMove: (k) => {
           if (!h)
             return;
-          const { x: q } = j.target.position();
-          j.target.x(i);
-          const B = Math.floor(M(f, d, i, i + s, q));
-          h(j, B);
+          const { x: q } = k.target.position();
+          k.target.x(i);
+          const B = Math.floor(N(d, f, i, i + s, q));
+          h(k, B);
         },
-        fill: gt,
-        onClick: r,
-        ..._,
+        fill: bt,
+        onClick: t,
+        ...L,
         ...Y,
         ...V,
         ...g
       }
     ),
-    /* @__PURE__ */ D(ee, { ..._, ...I, ...Z("start") }),
-    /* @__PURE__ */ D(ee, { ..._, ...I, ...Z("end") })
+    /* @__PURE__ */ D(ee, { ...L, ...I, ...F("start") }),
+    /* @__PURE__ */ D(ee, { ...L, ...I, ...F("end") })
   ] });
 }
 Ge.propTypes = {
@@ -1155,15 +1153,15 @@ Ge.defaultProps = {
   className: void 0
 };
 function Xe({
-  className: r,
+  className: t,
   children: i,
   perspective: s,
   onClick: n,
   style: l,
   onHover: o,
-  StageProps: f,
-  LayerProps: d,
-  GroupProps: y,
+  StageProps: d,
+  LayerProps: f,
+  GroupProps: m,
   RectProps: h,
   ...a
 }) {
@@ -1177,25 +1175,25 @@ function Xe({
   const p = oe.toArray(i).filter(({ props: I = {} }) => !(I.start > c.end || I.end < c.start)), b = U(), { width: E = 0, height: g = 0 } = se(b), w = Math.max(...oe.map(i, ({ props: { y: I = 0, height: x = 0 } = {} }) => I + x)) || He, W = (I) => {
     const { start: x, end: $ } = I.props || {}, H = (() => {
       if (x !== void 0 && $ !== void 0) {
-        const L = M(
+        const _ = N(
           0,
           E,
           c.start,
           c.end,
           x
-        ), C = M(0, E, c.start, c.end, $) - L;
+        ), A = N(0, E, c.start, c.end, $) - _;
         return {
-          x: L,
-          width: C
+          x: _,
+          width: A
         };
       }
       return {};
     })();
-    return Le(I, {
+    return _e(I, {
       ...I.props,
       ...H
     });
-  }, { isHovering: V, ...N } = ce({
+  }, { isHovering: V, ...M } = ce({
     hoverEffect: (I) => {
       o && o(I, !0);
       const x = I.target.getStage().container();
@@ -1208,10 +1206,10 @@ function Xe({
     "div",
     {
       ref: b,
-      className: F("VdtTimelineTrack-root", r),
+      className: Z("VdtTimelineTrack-root", t),
       style: { height: w, ...l },
       ...a,
-      children: /* @__PURE__ */ D(ue, { height: g, width: E, ...f, children: /* @__PURE__ */ D(de, { ...d, children: /* @__PURE__ */ te(Pe, { ...y, children: [
+      children: /* @__PURE__ */ D(ue, { height: g, width: E, ...d, children: /* @__PURE__ */ D(fe, { ...f, children: /* @__PURE__ */ te(Oe, { ...m, children: [
         /* @__PURE__ */ D(
           ee,
           {
@@ -1220,7 +1218,7 @@ function Xe({
             width: E,
             height: g,
             onClick: n,
-            ...N,
+            ...M,
             ...h
           }
         ),
@@ -1234,12 +1232,12 @@ Xe.propTypes = {
    * children are positioned within the track according to 'start' and 'end' props passed to them
    */
   // children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
-  children(r, i, s) {
-    const n = r[i];
+  children(t, i, s) {
+    const n = t[i];
     let l;
     return oe.forEach(n, (o) => {
-      const { props: { start: f, end: d } = {} } = o;
-      (f === void 0 || d === void 0) && (l = new Error(
+      const { props: { start: d, end: f } = {} } = o;
+      (d === void 0 || f === void 0) && (l = new Error(
         `children of ${s} must be passed a 'start' and 'end' prop. These props are used to position the child within the track.`
       ));
     }), l;
@@ -1293,8 +1291,8 @@ Xe.defaultProps = {
   RectProps: {},
   className: void 0
 };
-function Ee({
-  className: r,
+function Se({
+  className: t,
   children: i,
   label: s,
   LabelProps: n,
@@ -1304,7 +1302,7 @@ function Ee({
   return /* @__PURE__ */ te(
     "div",
     {
-      className: F("VdtTimelineRow-root", r, {
+      className: Z("VdtTimelineRow-root", t, {
         "VdtTimelineRow-hasLabel": !!s
       }),
       ...o,
@@ -1315,7 +1313,7 @@ function Ee({
     }
   );
 }
-Ee.propTypes = {
+Se.propTypes = {
   /**
    * Children components to render inside row content container.
    */
@@ -1341,7 +1339,7 @@ Ee.propTypes = {
    */
   style: e.instanceOf(Object)
 };
-Ee.defaultProps = {
+Se.defaultProps = {
   children: void 0,
   label: void 0,
   LabelProps: {},
@@ -1349,25 +1347,25 @@ Ee.defaultProps = {
   className: void 0,
   style: {}
 };
-const Ie = 2, [bt, Pt] = ae(
+const Ie = 2, [Ot, Et] = ae(
   "--vdt-timeline-palette-text-primary",
   "--vdt-timeline-palette-text-secondary"
 );
-function Ot({ x: r, y: i, minX: s, maxX: n, label: l, TickGroupProps: o, TickTextProps: f, TickLineProps: d }) {
-  const y = l !== void 0, { color: h, tickWidth: a, tickSize: c } = y ? {
-    color: bt,
+function St({ x: t, y: i, minX: s, maxX: n, label: l, TickGroupProps: o, TickTextProps: d, TickLineProps: f }) {
+  const m = l !== void 0, { color: h, tickWidth: a, tickSize: c } = m ? {
+    color: Ot,
     tickWidth: 2,
     tickSize: 8
   } : {
-    color: Pt,
+    color: Et,
     tickWidth: 1,
     tickSize: 4
   }, [p, b] = re(), E = U();
   le(() => {
     E.current && b(E.current.getTextWidth());
   }, []);
-  const g = ne(r - p / 2, s + Ie, n - p - Ie) || void 0;
-  return r < s || r > n ? null : /* @__PURE__ */ te(Pe, { ...o, children: [
+  const g = ne(t - p / 2, s + Ie, n - p - Ie) || void 0;
+  return t < s || t > n ? null : /* @__PURE__ */ te(Oe, { ...o, children: [
     /* @__PURE__ */ D(
       et,
       {
@@ -1379,44 +1377,44 @@ function Ot({ x: r, y: i, minX: s, maxX: n, label: l, TickGroupProps: o, TickTex
         fontStyle: "bold",
         fontSize: 10,
         fill: h,
-        ...f
+        ...d
       }
     ),
     /* @__PURE__ */ D(
       tt,
       {
-        points: [r, i - c, r, i],
+        points: [t, i - c, t, i],
         stroke: h,
         strokeWidth: a,
-        ...d
+        ...f
       }
     )
   ] });
 }
-function Ye({ width: r, perspective: i }) {
-  const s = Math.max(Math.floor(r / 90), 2), n = nt(
+function Ye({ width: t, perspective: i }) {
+  const s = Math.max(Math.floor(t / 90), 2), n = nt(
     [...Array(s).keys()].map(
-      (o) => M(i.start, i.end, 0, s - 1, o)
+      (o) => N(i.start, i.end, 0, s - 1, o)
     )
   ).map((o) => ({
     time: o,
     label: String(Math.round(o))
-  })), l = it(n, (o, f) => {
-    const d = (f.time - o.time) / 10;
-    return [...Array(9).keys()].map((y) => ({ time: o.time + (y + 1) * d }));
+  })), l = it(n, (o, d) => {
+    const f = (d.time - o.time) / 10;
+    return [...Array(9).keys()].map((m) => ({ time: o.time + (m + 1) * f }));
   }).flat();
   return rt([...n, ...l], ["time"]);
 }
 function Ue({
-  className: r,
+  className: t,
   children: i,
   ticks: s,
   onClick: n,
   onHover: l,
   onWheel: o,
-  onDrag: f,
-  start: d,
-  end: y,
+  onDrag: d,
+  start: f,
+  end: m,
   perspective: h,
   timelineRef: a,
   StageProps: c,
@@ -1429,109 +1427,109 @@ function Ue({
   ...V
 }) {
   var O, S;
-  const { start: N, end: I, perspective: x, setPerspective: $, zoom: H, onChangeTime: L, timelineRef: C } = ie() || {
-    start: d,
-    end: y,
+  const { start: M, end: I, perspective: x, setPerspective: $, zoom: H, onChangeTime: _, timelineRef: A } = ie() || {
+    start: f,
+    end: m,
     perspective: h,
     timelineRef: a
   };
-  (N === void 0 || I === void 0 || x === void 0) && J.error(
+  (M === void 0 || I === void 0 || x === void 0) && J.error(
     "VdtTimelinePlayheadTrack",
     "missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' and 'perspective' must be passed explicitly"
-  ), C === void 0 && (i == null ? void 0 : i.length) > 0 && J.warn(
+  ), A === void 0 && (i == null ? void 0 : i.length) > 0 && J.warn(
     "VdtTimelinePlayheadTrack",
     "missing 'timelineRef' prop. This ref is used to set the height of the playhead within the timeline."
   );
-  const _ = o || H && ((v, ...m) => H(...m)), Y = n || L && ((v, ...m) => L(...m)), Z = f || $ && ((v, ...m) => $(...m)), j = U(), { width: q = 0, height: B = 0 } = se(j), X = s || Ye, fe = (typeof X == "function" ? X({ start: N, end: I, width: q, perspective: x }) : X).map(({ label: v, time: m }) => ({
-    x: M(0, q, x.start, x.end, m),
+  const L = o || H && ((v, ...y) => H(...y)), Y = n || _ && ((v, ...y) => _(...y)), F = d || $ && ((v, ...y) => $(...y)), k = U(), { width: q = 0, height: B = 0 } = se(k), X = s || Ye, de = (typeof X == "function" ? X({ start: M, end: I, width: q, perspective: x }) : X).map(({ label: v, time: y }) => ({
+    x: N(0, q, x.start, x.end, y),
     label: v,
-    time: m
-  })), { height: pe } = se(C), t = (((O = j == null ? void 0 : j.current) == null ? void 0 : O.offsetTop) || 0) - (((S = C == null ? void 0 : C.current) == null ? void 0 : S.offsetTop) || 0), u = B, R = pe - B - t || void 0, T = U(), { isHovering: P, ...A } = ce({
+    time: y
+  })), { height: pe } = se(A), r = (((O = k == null ? void 0 : k.current) == null ? void 0 : O.offsetTop) || 0) - (((S = A == null ? void 0 : A.current) == null ? void 0 : S.offsetTop) || 0), u = B, R = pe - B - r || void 0, T = U(), { isHovering: P, ...C } = ce({
     hoverEffect: (v) => {
       l && l(v, !0);
-      const m = v.target.getStage().container();
-      return Y && (m.style.cursor = "pointer"), () => {
-        l && l(v, !1), Y && (m.style.cursor = "default");
+      const y = v.target.getStage().container();
+      return Y && (y.style.cursor = "pointer"), () => {
+        l && l(v, !1), Y && (y.style.cursor = "default");
       };
     }
   });
   return /* @__PURE__ */ te(
     "div",
     {
-      ref: j,
-      className: F("VdtTimelinePlayheadTrack-root", r),
+      ref: k,
+      className: Z("VdtTimelinePlayheadTrack-root", t),
       ...V,
       children: [
         oe.map(
           i,
-          (v) => Le(v, {
+          (v) => _e(v, {
             style: {
               top: u,
               height: R
             }
           })
         ),
-        /* @__PURE__ */ D(ue, { height: B, width: q, ...c, children: /* @__PURE__ */ D(de, { ...p, children: /* @__PURE__ */ te(
-          Pe,
+        /* @__PURE__ */ D(ue, { height: B, width: q, ...c, children: /* @__PURE__ */ D(fe, { ...p, children: /* @__PURE__ */ te(
+          Oe,
           {
             onClick: (v) => {
               if (T.current && Y) {
-                const { x: m } = T.current.getRelativePointerPosition();
-                Y(v, M(x.start, x.end, 0, q, m));
+                const { x: y } = T.current.getRelativePointerPosition();
+                Y(v, N(x.start, x.end, 0, q, y));
               }
             },
             onWheel: (v) => {
-              if (T.current && _) {
-                const { x: m } = T.current.getRelativePointerPosition();
-                _(
+              if (T.current && L) {
+                const { x: y } = T.current.getRelativePointerPosition();
+                L(
                   v,
                   v.evt.deltaY < 0 ? "in" : "out",
-                  M(x.start, x.end, 0, q, m)
+                  N(x.start, x.end, 0, q, y)
                 );
               }
             },
             draggable: !0,
             dragBoundFunc: () => ({ x: 0, y: 0 }),
             onDragStart: (v) => {
-              const m = v.target.getStage().container();
-              m.style.cursor = "grabbing";
+              const y = v.target.getStage().container();
+              y.style.cursor = "grabbing";
             },
             onDragEnd: (v) => {
-              const m = v.target.getStage().container();
-              m.style.cursor = "pointer";
+              const y = v.target.getStage().container();
+              y.style.cursor = "pointer";
             },
             onDragMove: (v) => {
-              if (Z) {
-                const { movementX: m } = v.evt;
-                if (m === 0)
+              if (F) {
+                const { movementX: y } = v.evt;
+                if (y === 0)
                   return;
-                const k = M(
+                const j = N(
                   x.start,
                   x.end,
                   0,
                   q,
-                  -m
-                ), G = x.end - x.start, z = ne(k, N, I - G), Q = z + G;
-                Z(v, z, Q);
+                  -y
+                ), G = x.end - x.start, z = ne(j, M, I - G), Q = z + G;
+                F(v, z, Q);
               }
             },
-            ...A,
+            ...C,
             ...b,
             children: [
               /* @__PURE__ */ D(ee, { ref: T, x: 0, y: 0, width: q, height: B, ...E }),
-              fe.map(({ x: v, label: m, time: k }) => /* @__PURE__ */ D(
-                Ot,
+              de.map(({ x: v, label: y, time: j }) => /* @__PURE__ */ D(
+                St,
                 {
                   minX: 0,
                   maxX: q,
                   x: v,
-                  label: m,
+                  label: y,
                   y: B,
                   TickGroupProps: g,
                   TickLineProps: W,
                   TickTextProps: w
                 },
-                k
+                j
               ))
             ]
           }
@@ -1647,17 +1645,17 @@ Ue.defaultProps = {
   className: void 0,
   style: {}
 };
-const [Et] = ae("--vdt-timeline-palette-secondary");
-function Se({
-  className: r,
+const [wt] = ae("--vdt-timeline-palette-secondary");
+function we({
+  className: t,
   onScroll: i,
   onClick: s,
   start: n,
   end: l,
   perspective: o,
-  style: f,
-  StageProps: d,
-  LayerProps: y,
+  style: d,
+  StageProps: f,
+  LayerProps: m,
   RectProps: h,
   ...a
 }) {
@@ -1670,12 +1668,12 @@ function Se({
     "VdtTimelineScroll",
     "missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' and 'perspective' must be passed explicitly"
   );
-  const g = U(), { width: w = 0, height: W = 0 } = se(g), V = M(0, w, c, p, b.start), N = b.end - b.start, I = M(0, w, 0, p - c, N), x = i || E && ((L, ...C) => E(...C)), $ = s || E && ((L, ...C) => E(...C)), H = c !== b.start || p !== b.end;
+  const g = U(), { width: w = 0, height: W = 0 } = se(g), V = N(0, w, c, p, b.start), M = b.end - b.start, I = N(0, w, 0, p - c, M), x = i || E && ((_, ...A) => E(...A)), $ = s || E && ((_, ...A) => E(...A)), H = c !== b.start || p !== b.end;
   return /* @__PURE__ */ D(
     "div",
     {
-      className: F("VdtTimelineScroll-root", r),
-      style: { display: !H && "none", zIndex: qe + 1, ...f },
+      className: Z("VdtTimelineScroll-root", t),
+      style: { display: !H && "none", zIndex: qe + 1, ...d },
       ref: g,
       ...a,
       children: /* @__PURE__ */ D(
@@ -1683,31 +1681,31 @@ function Se({
         {
           height: W,
           width: w,
-          onClick: (L) => {
+          onClick: (_) => {
             if (!$)
               return;
-            const { x: C } = L.currentTarget.getRelativePointerPosition();
-            let _;
-            C > V + I ? _ = Math.floor(M(c, p, 0, w, C - I)) : C < V && (_ = Math.floor(M(c, p, 0, w, C))), _ !== void 0 && _ !== b.start && $(L, _, _ + N);
+            const { x: A } = _.currentTarget.getRelativePointerPosition();
+            let L;
+            A > V + I ? L = Math.floor(N(c, p, 0, w, A - I)) : A < V && (L = Math.floor(N(c, p, 0, w, A))), L !== void 0 && L !== b.start && $(_, L, L + M);
           },
-          ...d,
-          children: /* @__PURE__ */ D(de, { ...y, children: /* @__PURE__ */ D(
+          ...f,
+          children: /* @__PURE__ */ D(fe, { ...m, children: /* @__PURE__ */ D(
             ee,
             {
               x: V,
               y: 0,
               width: I,
               height: W,
-              fill: Et,
+              fill: wt,
               draggable: !0,
-              dragBoundFunc: (L) => ({ x: ne(L.x, 0, w - I), y: 0 }),
-              onDragMove: (L) => {
+              dragBoundFunc: (_) => ({ x: ne(_.x, 0, w - I), y: 0 }),
+              onDragMove: (_) => {
                 if (!x)
                   return;
-                const { x: C } = L.target.position();
-                L.target.x(V);
-                const _ = Math.floor(M(c, p, 0, w, C));
-                x(L, _, _ + N);
+                const { x: A } = _.target.position();
+                _.target.x(V);
+                const L = Math.floor(N(c, p, 0, w, A));
+                x(_, L, L + M);
               },
               ...h
             }
@@ -1717,7 +1715,7 @@ function Se({
     }
   );
 }
-Se.propTypes = {
+we.propTypes = {
   /**
    * Callback to trigger on timeline component scroll.
    */
@@ -1759,7 +1757,7 @@ Se.propTypes = {
    */
   className: e.string
 };
-Se.defaultProps = {
+we.defaultProps = {
   onScroll: void 0,
   onClick: void 0,
   start: void 0,
@@ -1771,37 +1769,37 @@ Se.defaultProps = {
   RectProps: {},
   className: void 0
 };
-function St(r, { start: i, end: s }) {
+function xt(t, { start: i, end: s }) {
   return Math.floor(0.02 * (i - s));
 }
-function Ze({
-  className: r,
+function Fe({
+  className: t,
   children: i,
   getScrollDistance: s,
   RowProps: n,
   ScrollProps: l,
   ...o
 }) {
-  const { start: f, end: d, perspective: y, setPerspective: h } = ie();
+  const { start: d, end: f, perspective: m, setPerspective: h } = ie();
   return /* @__PURE__ */ te(
     "div",
     {
-      className: F("VdtTimelineScrollContainer-root", r),
+      className: Z("VdtTimelineScrollContainer-root", t),
       onWheel: (a) => {
         if (a.shiftKey) {
-          const c = s(a, { start: f, end: d, perspective: y }), p = y.start + (a.deltaY > 0 ? -c : c), b = y.end - y.start, E = p + b;
-          E > d ? h(d - b, d) : p < f ? h(f, b) : h(p, E);
+          const c = s(a, { start: d, end: f, perspective: m }), p = m.start + (a.deltaY > 0 ? -c : c), b = m.end - m.start, E = p + b;
+          E > f ? h(f - b, f) : p < d ? h(d, b) : h(p, E);
         }
       },
       ...o,
       children: [
         i,
-        /* @__PURE__ */ D(Ee, { className: F("VdtTimelineScrollContainer-timelineRow"), ...n, children: /* @__PURE__ */ D(Se, { ...l }) })
+        /* @__PURE__ */ D(Se, { className: Z("VdtTimelineScrollContainer-timelineRow"), ...n, children: /* @__PURE__ */ D(we, { ...l }) })
       ]
     }
   );
 }
-Ze.propTypes = {
+Fe.propTypes = {
   /**
    * Override styles with className
    */
@@ -1823,23 +1821,23 @@ Ze.propTypes = {
    */
   ScrollProps: e.instanceOf(Object)
 };
-Ze.defaultProps = {
+Fe.defaultProps = {
   children: void 0,
-  getScrollDistance: St,
+  getScrollDistance: xt,
   RowProps: {},
   ScrollProps: {},
   className: void 0
 };
 export {
-  Me as Timeline,
+  Ne as Timeline,
   Ve as TimelineContext,
   Ge as TimelineEvent,
   $e as TimelinePlayhead,
   Ue as TimelinePlayheadTrack,
   ct as TimelineProvider,
-  Ee as TimelineRow,
-  Se as TimelineScroll,
-  Ze as TimelineScrollContainer,
+  Se as TimelineRow,
+  we as TimelineScroll,
+  Fe as TimelineScrollContainer,
   Xe as TimelineTrack,
   Be as TimelineWaveform,
   ie as useTimeline