@kteneyck/cesium-timeline-react 0.2.0 → 0.3.0

package/dist/cesium-timeline-react.js

@@ -1,9 +1,9 @@
-import Be, { useRef as T, useState as ve, useEffect as $, forwardRef as He, useCallback as oe, useImperativeHandle as Ue, useLayoutEffect as qe, useMemo as Se } from "react";
+import Be, { useRef as v, useState as xe, useEffect as Y, forwardRef as He, useCallback as ne, useImperativeHandle as Ue, useLayoutEffect as qe, useMemo as Se } from "react";
 import * as C from "cesium";
-import { splitForDisplay as Ge, formatDateTime as ke, drawTimeline as Ve, hitTestSwimLane as Ke, hitTestLaneLabel as Ze, isInSwimLaneRegion as Qe, zoomRange as et, TICK_AREA_HEIGHT as ze, DEFAULT_LANE_HEIGHT as Le, LANE_GAP as Ie, SWIM_LANE_SCROLL_SPEED as tt, MIN_SPAN_MS as nt, MAX_SPAN_MS as rt, toJulianDate as ge, defaultTheme as ot, generateTicks as st, timeToPosition as ct, snapToTick as it } from "@kteneyck/cesium-timeline-core";
+import { splitForDisplay as Ge, formatDateTime as ke, drawTimeline as Ve, hitTestSwimLane as Ke, hitTestLaneLabel as Ze, isInSwimLaneRegion as Qe, zoomRange as et, TICK_AREA_HEIGHT as ze, DEFAULT_LANE_HEIGHT as Le, LANE_GAP as Ie, SWIM_LANE_SCROLL_SPEED as tt, MIN_SPAN_MS as nt, MAX_SPAN_MS as rt, toJulianDate as he, defaultTheme as ot, generateTicks as st, timeToPosition as ct, snapToTick as it } from "@kteneyck/cesium-timeline-core";
 export * from "@kteneyck/cesium-timeline-core";
-import { TICK_AREA_HEIGHT as Tt } from "@kteneyck/cesium-timeline-core";
-var Me = { exports: {} }, we = {};
+import { TICK_AREA_HEIGHT as Et } from "@kteneyck/cesium-timeline-core";
+var Te = { exports: {} }, ve = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -14,28 +14,28 @@ var Me = { exports: {} }, we = {};
  * LICENSE file in the root directory of this source tree.
  */
 var Fe;
-function at() {
-  if (Fe) return we;
+function ut() {
+  if (Fe) return ve;
   Fe = 1;
-  var D = Symbol.for("react.transitional.element"), k = Symbol.for("react.fragment");
-  function X(u, b, I) {
-    var q = null;
-    if (I !== void 0 && (q = "" + I), b.key !== void 0 && (q = "" + b.key), "key" in b) {
-      I = {};
-      for (var P in b)
-        P !== "key" && (I[P] = b[P]);
-    } else I = b;
-    return b = I.ref, {
+  var D = Symbol.for("react.transitional.element"), A = Symbol.for("react.fragment");
+  function J(l, g, y) {
+    var I = null;
+    if (y !== void 0 && (I = "" + y), g.key !== void 0 && (I = "" + g.key), "key" in g) {
+      y = {};
+      for (var O in g)
+        O !== "key" && (y[O] = g[O]);
+    } else y = g;
+    return g = y.ref, {
       $$typeof: D,
-      type: u,
-      key: q,
-      ref: b !== void 0 ? b : null,
-      props: I
+      type: l,
+      key: I,
+      ref: g !== void 0 ? g : null,
+      props: y
     };
   }
-  return we.Fragment = k, we.jsx = X, we.jsxs = X, we;
+  return ve.Fragment = A, ve.jsx = J, ve.jsxs = J, ve;
 }
-var Te = {};
+var be = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -46,125 +46,125 @@ var Te = {};
  * LICENSE file in the root directory of this source tree.
  */
 var Oe;
-function ut() {
+function at() {
   return Oe || (Oe = 1, process.env.NODE_ENV !== "production" && (function() {
     function D(t) {
       if (t == null) return null;
       if (typeof t == "function")
-        return t.$$typeof === Y ? null : t.displayName || t.name || null;
+        return t.$$typeof === H ? null : t.displayName || t.name || null;
       if (typeof t == "string") return t;
       switch (t) {
-        case j:
+        case P:
           return "Fragment";
-        case V:
+        case B:
           return "Profiler";
-        case _:
+        case m:
           return "StrictMode";
-        case y:
+        case M:
           return "Suspense";
-        case E:
+        case T:
           return "SuspenseList";
-        case U:
+        case Q:
           return "Activity";
       }
       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."
         ), t.$$typeof) {
-          case x:
+          case Z:
             return "Portal";
-          case m:
+          case d:
             return t.displayName || "Context";
-          case v:
+          case b:
             return (t._context.displayName || "Context") + ".Consumer";
-          case g:
-            var l = t.render;
-            return t = t.displayName, t || (t = l.displayName || l.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
-          case ae:
-            return l = t.displayName || null, l !== null ? l : D(t.type) || "Memo";
-          case N:
-            l = t._payload, t = t._init;
+          case x:
+            var a = t.render;
+            return t = t.displayName, t || (t = a.displayName || a.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
+          case ce:
+            return a = t.displayName || null, a !== null ? a : D(t.type) || "Memo";
+          case X:
+            a = t._payload, t = t._init;
             try {
-              return D(t(l));
+              return D(t(a));
             } catch {
             }
         }
       return null;
     }
-    function k(t) {
+    function A(t) {
       return "" + t;
     }
-    function X(t) {
+    function J(t) {
       try {
-        k(t);
-        var l = !1;
+        A(t);
+        var a = !1;
       } catch {
-        l = !0;
+        a = !0;
       }
-      if (l) {
-        l = console;
-        var w = l.error, A = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
-        return w.call(
-          l,
+      if (a) {
+        a = console;
+        var E = a.error, L = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
+        return E.call(
+          a,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          A
-        ), k(t);
+          L
+        ), A(t);
       }
     }
-    function u(t) {
-      if (t === j) return "<>";
-      if (typeof t == "object" && t !== null && t.$$typeof === N)
+    function l(t) {
+      if (t === P) return "<>";
+      if (typeof t == "object" && t !== null && t.$$typeof === X)
         return "<...>";
       try {
-        var l = D(t);
-        return l ? "<" + l + ">" : "<...>";
+        var a = D(t);
+        return a ? "<" + a + ">" : "<...>";
       } catch {
         return "<...>";
       }
     }
-    function b() {
-      var t = L.A;
+    function g() {
+      var t = U.A;
       return t === null ? null : t.getOwner();
     }
-    function I() {
+    function y() {
       return Error("react-stack-top-frame");
     }
-    function q(t) {
-      if (c.call(t, "key")) {
-        var l = Object.getOwnPropertyDescriptor(t, "key").get;
-        if (l && l.isReactWarning) return !1;
+    function I(t) {
+      if (w.call(t, "key")) {
+        var a = Object.getOwnPropertyDescriptor(t, "key").get;
+        if (a && a.isReactWarning) return !1;
       }
       return t.key !== void 0;
     }
-    function P(t, l) {
-      function w() {
-        re || (re = !0, console.error(
+    function O(t, a) {
+      function E() {
+        k || (k = !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)",
-          l
+          a
         ));
       }
-      w.isReactWarning = !0, Object.defineProperty(t, "key", {
-        get: w,
+      E.isReactWarning = !0, Object.defineProperty(t, "key", {
+        get: E,
         configurable: !0
       });
     }
-    function B() {
+    function z() {
       var t = D(this.type);
-      return W[t] || (W[t] = !0, console.error(
+      return j[t] || (j[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."
       )), t = this.props.ref, t !== void 0 ? t : null;
     }
-    function R(t, l, w, A, te, de) {
-      var S = w.ref;
+    function R(t, a, E, L, q, ue) {
+      var _ = E.ref;
       return t = {
-        $$typeof: G,
+        $$typeof: K,
         type: t,
-        key: l,
-        props: w,
-        _owner: A
-      }, (S !== void 0 ? S : null) !== null ? Object.defineProperty(t, "ref", {
+        key: a,
+        props: E,
+        _owner: L
+      }, (_ !== void 0 ? _ : null) !== null ? Object.defineProperty(t, "ref", {
         enumerable: !1,
-        get: B
+        get: z
       }) : Object.defineProperty(t, "ref", { enumerable: !1, value: null }), t._store = {}, Object.defineProperty(t._store, "validated", {
         configurable: !1,
         enumerable: !1,
@@ -179,141 +179,143 @@ function ut() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: te
+        value: q
       }), Object.defineProperty(t, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: de
+        value: ue
       }), Object.freeze && (Object.freeze(t.props), Object.freeze(t)), t;
     }
-    function H(t, l, w, A, te, de) {
-      var S = l.children;
-      if (S !== void 0)
-        if (A)
-          if (J(S)) {
-            for (A = 0; A < S.length; A++)
-              ne(S[A]);
-            Object.freeze && Object.freeze(S);
+    function W(t, a, E, L, q, ue) {
+      var _ = a.children;
+      if (_ !== void 0)
+        if (L)
+          if (S(_)) {
+            for (L = 0; L < _.length; L++)
+              ee(_[L]);
+            Object.freeze && Object.freeze(_);
           } 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 ne(S);
-      if (c.call(l, "key")) {
-        S = D(t);
-        var ue = Object.keys(l).filter(function(i) {
-          return i !== "key";
+        else ee(_);
+      if (w.call(a, "key")) {
+        _ = D(t);
+        var ae = Object.keys(a).filter(function(h) {
+          return h !== "key";
         });
-        A = 0 < ue.length ? "{key: someKey, " + ue.join(": ..., ") + ": ...}" : "{key: someKey}", le[S + A] || (ue = 0 < ue.length ? "{" + ue.join(": ..., ") + ": ...}" : "{}", console.error(
+        L = 0 < ae.length ? "{key: someKey, " + ae.join(": ..., ") + ": ...}" : "{key: someKey}", ie[_ + L] || (ae = 0 < ae.length ? "{" + ae.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} />`,
-          A,
-          S,
-          ue,
-          S
-        ), le[S + A] = !0);
+          L,
+          _,
+          ae,
+          _
+        ), ie[_ + L] = !0);
       }
-      if (S = null, w !== void 0 && (X(w), S = "" + w), q(l) && (X(l.key), S = "" + l.key), "key" in l) {
-        w = {};
-        for (var K in l)
-          K !== "key" && (w[K] = l[K]);
-      } else w = l;
-      return S && P(
-        w,
+      if (_ = null, E !== void 0 && (J(E), _ = "" + E), I(a) && (J(a.key), _ = "" + a.key), "key" in a) {
+        E = {};
+        for (var oe in a)
+          oe !== "key" && (E[oe] = a[oe]);
+      } else E = a;
+      return _ && O(
+        E,
         typeof t == "function" ? t.displayName || t.name || "Unknown" : t
       ), R(
         t,
-        S,
-        w,
-        b(),
-        te,
-        de
+        _,
+        E,
+        g(),
+        q,
+        ue
       );
     }
-    function ne(t) {
-      Q(t) ? t._store && (t._store.validated = 1) : typeof t == "object" && t !== null && t.$$typeof === N && (t._payload.status === "fulfilled" ? Q(t._payload.value) && t._payload.value._store && (t._payload.value._store.validated = 1) : t._store && (t._store.validated = 1));
+    function ee(t) {
+      te(t) ? t._store && (t._store.validated = 1) : typeof t == "object" && t !== null && t.$$typeof === X && (t._payload.status === "fulfilled" ? te(t._payload.value) && t._payload.value._store && (t._payload.value._store.validated = 1) : t._store && (t._store.validated = 1));
     }
-    function Q(t) {
-      return typeof t == "object" && t !== null && t.$$typeof === G;
+    function te(t) {
+      return typeof t == "object" && t !== null && t.$$typeof === K;
     }
-    var ee = Be, G = Symbol.for("react.transitional.element"), x = Symbol.for("react.portal"), j = Symbol.for("react.fragment"), _ = Symbol.for("react.strict_mode"), V = Symbol.for("react.profiler"), v = Symbol.for("react.consumer"), m = Symbol.for("react.context"), g = Symbol.for("react.forward_ref"), y = Symbol.for("react.suspense"), E = Symbol.for("react.suspense_list"), ae = Symbol.for("react.memo"), N = Symbol.for("react.lazy"), U = Symbol.for("react.activity"), Y = Symbol.for("react.client.reference"), L = ee.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, c = Object.prototype.hasOwnProperty, J = Array.isArray, z = console.createTask ? console.createTask : function() {
+    var V = Be, K = Symbol.for("react.transitional.element"), Z = Symbol.for("react.portal"), P = Symbol.for("react.fragment"), m = Symbol.for("react.strict_mode"), B = Symbol.for("react.profiler"), b = Symbol.for("react.consumer"), d = Symbol.for("react.context"), x = Symbol.for("react.forward_ref"), M = Symbol.for("react.suspense"), T = Symbol.for("react.suspense_list"), ce = Symbol.for("react.memo"), X = Symbol.for("react.lazy"), Q = Symbol.for("react.activity"), H = Symbol.for("react.client.reference"), U = V.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, w = Object.prototype.hasOwnProperty, S = Array.isArray, i = console.createTask ? console.createTask : function() {
       return null;
     };
-    ee = {
+    V = {
       react_stack_bottom_frame: function(t) {
         return t();
       }
     };
-    var re, W = {}, F = ee.react_stack_bottom_frame.bind(
-      ee,
-      I
-    )(), ce = z(u(I)), le = {};
-    Te.Fragment = j, Te.jsx = function(t, l, w) {
-      var A = 1e4 > L.recentlyCreatedOwnerStacks++;
-      return H(
+    var k, j = {}, $ = V.react_stack_bottom_frame.bind(
+      V,
+      y
+    )(), re = i(l(y)), ie = {};
+    be.Fragment = P, be.jsx = function(t, a, E) {
+      var L = 1e4 > U.recentlyCreatedOwnerStacks++;
+      return W(
         t,
-        l,
-        w,
+        a,
+        E,
         !1,
-        A ? Error("react-stack-top-frame") : F,
-        A ? z(u(t)) : ce
+        L ? Error("react-stack-top-frame") : $,
+        L ? i(l(t)) : re
       );
-    }, Te.jsxs = function(t, l, w) {
-      var A = 1e4 > L.recentlyCreatedOwnerStacks++;
-      return H(
+    }, be.jsxs = function(t, a, E) {
+      var L = 1e4 > U.recentlyCreatedOwnerStacks++;
+      return W(
         t,
-        l,
-        w,
+        a,
+        E,
         !0,
-        A ? Error("react-stack-top-frame") : F,
-        A ? z(u(t)) : ce
+        L ? Error("react-stack-top-frame") : $,
+        L ? i(l(t)) : re
       );
     };
-  })()), Te;
+  })()), be;
 }
 var Pe;
 function lt() {
-  return Pe || (Pe = 1, process.env.NODE_ENV === "production" ? Me.exports = at() : Me.exports = ut()), Me.exports;
+  return Pe || (Pe = 1, process.env.NODE_ENV === "production" ? Te.exports = ut() : Te.exports = at()), Te.exports;
 }
-var a = lt();
-const dt = 520, ft = () => /* @__PURE__ */ a.jsxs("svg", { width: "14", height: "16", viewBox: "0 0 14 16", fill: "currentColor", "aria-hidden": "true", children: [
-  /* @__PURE__ */ a.jsx("rect", { x: "1", y: "0", width: "4", height: "16", rx: "1" }),
-  /* @__PURE__ */ a.jsx("rect", { x: "9", y: "0", width: "4", height: "16", rx: "1" })
-] }), Je = () => /* @__PURE__ */ a.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ a.jsx("polyline", { points: "3,5 7,9 11,5" }) }), Ne = () => /* @__PURE__ */ a.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ a.jsx("polyline", { points: "3,9 7,5 11,9" }) }), mt = ({
+var u = lt();
+const dt = 520, ft = () => /* @__PURE__ */ u.jsxs("svg", { width: "14", height: "16", viewBox: "0 0 14 16", fill: "currentColor", "aria-hidden": "true", children: [
+  /* @__PURE__ */ u.jsx("rect", { x: "1", y: "0", width: "4", height: "16", rx: "1" }),
+  /* @__PURE__ */ u.jsx("rect", { x: "9", y: "0", width: "4", height: "16", rx: "1" })
+] }), Ne = () => /* @__PURE__ */ u.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ u.jsx("polyline", { points: "3,5 7,9 11,5" }) }), Je = () => /* @__PURE__ */ u.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ u.jsx("polyline", { points: "3,9 7,5 11,9" }) }), mt = ({
   currentTime: D,
-  isPlaying: k,
-  multiplier: X,
-  dateTimeFormat: u,
-  isLive: b,
-  hasStartTime: I,
-  hasEndTime: q,
-  onPlayPause: P,
-  onJumpToStart: B,
-  onRewind: R,
-  onFastForward: H,
-  onJumpToEnd: ne,
-  onJumpToLive: Q,
-  onResetSpeed: ee,
-  onDateTimeClick: G,
-  theme: x,
-  swimLanesVisible: j,
-  onToggleSwimLanes: _
+  isPlaying: A,
+  multiplier: J,
+  dateTimeFormat: l,
+  isLive: g,
+  hasStartTime: y,
+  hasEndTime: I,
+  showJumpToStart: O = !0,
+  showJumpToEnd: z = !0,
+  onPlayPause: R,
+  onJumpToStart: W,
+  onRewind: ee,
+  onFastForward: te,
+  onJumpToEnd: V,
+  onJumpToLive: K,
+  onResetSpeed: Z,
+  onDateTimeClick: P,
+  theme: m,
+  swimLanesVisible: B,
+  onToggleSwimLanes: b
 }) => {
-  const V = X < 0, v = X > 1, m = X === 1, g = Math.abs(X), y = T(null), [E, ae] = ve(!1);
-  $(() => {
-    const c = y.current;
-    if (!c) return;
-    const J = new ResizeObserver(([z]) => {
-      ae(z.contentRect.width < dt);
+  const d = J < 0, x = J > 1, M = J === 1, T = Math.abs(J), ce = v(null), [X, Q] = xe(!1);
+  Y(() => {
+    const i = ce.current;
+    if (!i) return;
+    const k = new ResizeObserver(([j]) => {
+      Q(j.contentRect.width < dt);
     });
-    return J.observe(c), () => J.disconnect();
+    return k.observe(i), () => k.disconnect();
   }, []);
-  const N = {
+  const H = {
     background: "none",
     border: "1px solid transparent",
     cursor: "pointer",
@@ -330,64 +332,64 @@ const dt = 520, ft = () => /* @__PURE__ */ a.jsxs("svg", { width: "14", height:
     fontFamily: "system-ui, -apple-system, sans-serif",
     flexShrink: 0,
     lineHeight: 1
-  }, U = (c) => ({
-    ...N,
-    color: c ? x.buttonActiveColor : x.buttonColor,
-    borderColor: c ? `${x.buttonActiveColor}33` : "transparent"
-  }), Y = (c, J) => {
-    c.currentTarget.style.backgroundColor = J ? `${x.buttonActiveColor}22` : x.buttonHoverColor + "44";
-  }, L = (c) => {
-    c.currentTarget.style.backgroundColor = "transparent";
+  }, U = (i) => ({
+    ...H,
+    color: i ? m.buttonActiveColor : m.buttonColor,
+    borderColor: i ? `${m.buttonActiveColor}33` : "transparent"
+  }), w = (i, k) => {
+    i.currentTarget.style.backgroundColor = k ? `${m.buttonActiveColor}22` : m.buttonHoverColor + "44";
+  }, S = (i) => {
+    i.currentTarget.style.backgroundColor = "transparent";
   };
-  return /* @__PURE__ */ a.jsxs(
+  return /* @__PURE__ */ u.jsxs(
     "div",
     {
-      ref: y,
+      ref: ce,
       style: {
-        display: E ? "flex" : "grid",
-        gridTemplateColumns: E ? void 0 : "1fr auto 1fr",
+        display: X ? "flex" : "grid",
+        gridTemplateColumns: X ? void 0 : "1fr auto 1fr",
         alignItems: "center",
         padding: "6px 16px",
-        backgroundColor: x.controlBarBackground,
-        borderBottom: `1px solid ${x.controlBarBorder}`,
+        backgroundColor: m.controlBarBackground,
+        borderBottom: `1px solid ${m.controlBarBorder}`,
         fontFamily: "system-ui, -apple-system, sans-serif"
       },
       children: [
-        /* @__PURE__ */ a.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px", flexShrink: 0 }, children: [
-          /* @__PURE__ */ a.jsx(
+        /* @__PURE__ */ u.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px", flexShrink: 0 }, children: [
+          /* @__PURE__ */ u.jsx(
             "div",
             {
-              onClick: G,
-              title: G ? "Click to jump to a date/time" : void 0,
+              onClick: P,
+              title: P ? "Click to jump to a date/time" : void 0,
               style: {
-                color: x.labelColor,
+                color: m.labelColor,
                 fontFamily: "monospace",
                 lineHeight: 1.15,
-                cursor: G ? "pointer" : "default",
+                cursor: P ? "pointer" : "default",
                 borderRadius: "4px",
                 padding: "2px 4px",
                 transition: "background 0.15s"
               },
-              onMouseEnter: (c) => {
-                G && (c.currentTarget.style.background = x.buttonHoverColor + "44");
+              onMouseEnter: (i) => {
+                P && (i.currentTarget.style.background = m.buttonHoverColor + "44");
               },
-              onMouseLeave: (c) => c.currentTarget.style.background = "transparent",
+              onMouseLeave: (i) => i.currentTarget.style.background = "transparent",
               children: (() => {
-                const { timeFormat: c, dateFormat: J } = Ge(u);
-                return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-                  c && /* @__PURE__ */ a.jsx("div", { style: { fontSize: "2em", fontWeight: "bold", letterSpacing: "0.02em" }, children: ke(D, c) }),
-                  J && /* @__PURE__ */ a.jsx("div", { style: { fontSize: "1.15em", letterSpacing: "0.03em", color: x.buttonActiveColor }, children: ke(D, J) })
+                const { timeFormat: i, dateFormat: k } = Ge(l);
+                return /* @__PURE__ */ u.jsxs(u.Fragment, { children: [
+                  i && /* @__PURE__ */ u.jsx("div", { style: { fontSize: "2em", fontWeight: "bold", letterSpacing: "0.02em" }, children: ke(D, i) }),
+                  k && /* @__PURE__ */ u.jsx("div", { style: { fontSize: "1.15em", letterSpacing: "0.03em", color: m.buttonActiveColor }, children: ke(D, k) })
                 ] });
               })()
             }
           ),
-          /* @__PURE__ */ a.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "2px", justifyContent: "center" }, children: [
-            /* @__PURE__ */ a.jsx(
+          /* @__PURE__ */ u.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "2px", justifyContent: "center" }, children: [
+            /* @__PURE__ */ u.jsx(
               "button",
               {
-                onClick: Q,
+                onClick: K,
                 style: {
-                  ...N,
+                  ...H,
                   fontSize: "11px",
                   fontWeight: "bold",
                   letterSpacing: "0.05em",
@@ -395,500 +397,502 @@ const dt = 520, ft = () => /* @__PURE__ */ a.jsxs("svg", { width: "14", height:
                   minWidth: "52px",
                   height: "20px",
                   borderRadius: "3px",
-                  color: b ? x.controlBarBackground : x.buttonActiveColor,
-                  backgroundColor: b ? x.buttonActiveColor : "transparent",
-                  borderColor: x.buttonActiveColor,
-                  opacity: b ? 1 : 0.55
+                  color: g ? m.controlBarBackground : m.buttonActiveColor,
+                  backgroundColor: g ? m.buttonActiveColor : "transparent",
+                  borderColor: m.buttonActiveColor,
+                  opacity: g ? 1 : 0.55
                 },
-                onMouseEnter: (c) => {
-                  c.currentTarget.style.opacity = "1";
+                onMouseEnter: (i) => {
+                  i.currentTarget.style.opacity = "1";
                 },
-                onMouseLeave: (c) => {
-                  c.currentTarget.style.opacity = b ? "1" : "0.55";
+                onMouseLeave: (i) => {
+                  i.currentTarget.style.opacity = g ? "1" : "0.55";
                 },
-                title: b ? "Currently live" : "Jump to live (now)",
-                children: b ? "● LIVE" : "LIVE"
+                title: g ? "Currently live" : "Jump to live (now)",
+                children: g ? "● LIVE" : "LIVE"
               }
             ),
-            /* @__PURE__ */ a.jsx("div", { style: { height: "20px", display: "flex", alignItems: "center" }, children: !m && /* @__PURE__ */ a.jsx(
+            /* @__PURE__ */ u.jsx("div", { style: { height: "20px", display: "flex", alignItems: "center" }, children: !M && /* @__PURE__ */ u.jsx(
               "button",
               {
-                onClick: () => ee(),
+                onClick: () => Z(),
                 style: {
-                  ...N,
+                  ...H,
                   fontSize: "11px",
-                  color: x.buttonActiveColor,
-                  borderColor: `${x.buttonActiveColor}44`,
+                  color: m.buttonActiveColor,
+                  borderColor: `${m.buttonActiveColor}44`,
                   width: "52px",
                   minWidth: "52px",
                   height: "20px"
                 },
-                onMouseEnter: (c) => Y(c, !0),
-                onMouseLeave: L,
+                onMouseEnter: (i) => w(i, !0),
+                onMouseLeave: S,
                 title: "Reset to 1× speed",
-                children: V ? `◀ ${g}×` : `${g}× ▶`
+                children: d ? `◀ ${T}×` : `${T}× ▶`
               }
             ) })
           ] })
         ] }),
-        /* @__PURE__ */ a.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "2px", ...E ? { flex: 1, justifyContent: "center" } : {} }, children: [
-          I && /* @__PURE__ */ a.jsx(
+        /* @__PURE__ */ u.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "2px", ...X ? { flex: 1, justifyContent: "center" } : {} }, children: [
+          O && /* @__PURE__ */ u.jsx(
             "button",
             {
-              onClick: B,
-              style: U(!1),
-              onMouseEnter: (c) => Y(c, !1),
-              onMouseLeave: L,
-              title: "Jump to start",
+              onClick: y ? W : void 0,
+              disabled: !y,
+              style: { ...U(!1), opacity: y ? 1 : 0.3, cursor: y ? "pointer" : "default" },
+              onMouseEnter: y ? (i) => w(i, !1) : void 0,
+              onMouseLeave: y ? S : void 0,
+              title: y ? "Jump to start" : "No start time set",
               children: "⏮"
             }
           ),
-          /* @__PURE__ */ a.jsx(
+          /* @__PURE__ */ u.jsx(
             "button",
             {
-              onClick: R,
-              style: { ...U(V), width: "64px", minWidth: "64px", gap: "3px" },
-              onMouseEnter: (c) => Y(c, V),
-              onMouseLeave: L,
-              title: V ? `Reverse ${g}× — click to speed up, press play to stop` : "Rewind",
-              children: V ? /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-                /* @__PURE__ */ a.jsxs("span", { style: { fontSize: "11px", fontWeight: "bold" }, children: [
-                  g,
+              onClick: ee,
+              style: { ...U(d), width: "64px", minWidth: "64px", gap: "3px" },
+              onMouseEnter: (i) => w(i, d),
+              onMouseLeave: S,
+              title: d ? `Reverse ${T}× — click to speed up, press play to stop` : "Rewind",
+              children: d ? /* @__PURE__ */ u.jsxs(u.Fragment, { children: [
+                /* @__PURE__ */ u.jsxs("span", { style: { fontSize: "11px", fontWeight: "bold" }, children: [
+                  T,
                   "×"
                 ] }),
                 "◀◀"
               ] }) : "◀◀"
             }
           ),
-          /* @__PURE__ */ a.jsx(
+          /* @__PURE__ */ u.jsx(
             "button",
             {
-              onClick: () => P(!k),
+              onClick: () => R(!A),
               style: {
-                ...N,
-                color: x.buttonActiveColor,
+                ...H,
+                color: m.buttonActiveColor,
                 fontSize: "18px",
                 width: "40px",
                 minWidth: "40px",
                 height: "40px",
-                borderColor: `${x.buttonActiveColor}55`,
+                borderColor: `${m.buttonActiveColor}55`,
                 borderRadius: "50%",
-                paddingLeft: k ? "0" : "2px"
+                paddingLeft: A ? "0" : "2px"
               },
-              onMouseEnter: (c) => Y(c, !0),
-              onMouseLeave: L,
-              title: k ? "Pause" : V ? "Play (reset to 1×)" : "Play",
-              children: k ? /* @__PURE__ */ a.jsx(ft, {}) : "▶"
+              onMouseEnter: (i) => w(i, !0),
+              onMouseLeave: S,
+              title: A ? "Pause" : d ? "Play (reset to 1×)" : "Play",
+              children: A ? /* @__PURE__ */ u.jsx(ft, {}) : "▶"
             }
           ),
-          /* @__PURE__ */ a.jsx(
+          /* @__PURE__ */ u.jsx(
             "button",
             {
-              onClick: H,
-              style: { ...U(v), width: "64px", minWidth: "64px", gap: "3px" },
-              onMouseEnter: (c) => Y(c, v),
-              onMouseLeave: L,
-              title: v ? `${g}× speed — click to increase, click again at max to reset` : "Fast forward",
-              children: v ? /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+              onClick: te,
+              style: { ...U(x), width: "64px", minWidth: "64px", gap: "3px" },
+              onMouseEnter: (i) => w(i, x),
+              onMouseLeave: S,
+              title: x ? `${T}× speed — click to increase, click again at max to reset` : "Fast forward",
+              children: x ? /* @__PURE__ */ u.jsxs(u.Fragment, { children: [
                 "▶▶",
-                /* @__PURE__ */ a.jsxs("span", { style: { fontSize: "11px", fontWeight: "bold" }, children: [
-                  g,
+                /* @__PURE__ */ u.jsxs("span", { style: { fontSize: "11px", fontWeight: "bold" }, children: [
+                  T,
                   "×"
                 ] })
               ] }) : "▶▶"
             }
           ),
-          q && /* @__PURE__ */ a.jsx(
+          z && /* @__PURE__ */ u.jsx(
             "button",
             {
-              onClick: ne,
-              style: U(!1),
-              onMouseEnter: (c) => Y(c, !1),
-              onMouseLeave: L,
-              title: "Jump to end",
+              onClick: I ? V : void 0,
+              disabled: !I,
+              style: { ...U(!1), opacity: I ? 1 : 0.3, cursor: I ? "pointer" : "default" },
+              onMouseEnter: I ? (i) => w(i, !1) : void 0,
+              onMouseLeave: I ? S : void 0,
+              title: I ? "Jump to end" : "No end time set",
               children: "⏭"
             }
           )
         ] }),
-        !E && /* @__PURE__ */ a.jsx("div", { style: { display: "flex", justifyContent: "flex-end", alignItems: "center" }, children: _ != null && j != null && /* @__PURE__ */ a.jsx(
+        !X && /* @__PURE__ */ u.jsx("div", { style: { display: "flex", justifyContent: "flex-end", alignItems: "center" }, children: b != null && B != null && /* @__PURE__ */ u.jsx(
           "button",
           {
-            onClick: _,
+            onClick: b,
             style: {
-              ...N,
-              color: x.buttonActiveColor,
-              borderColor: `${x.buttonActiveColor}33`
+              ...H,
+              color: m.buttonActiveColor,
+              borderColor: `${m.buttonActiveColor}33`
             },
-            onMouseEnter: (c) => Y(c, j),
-            onMouseLeave: L,
-            title: j ? "Collapse swim lanes" : "Expand swim lanes",
-            children: j ? /* @__PURE__ */ a.jsx(Je, {}) : /* @__PURE__ */ a.jsx(Ne, {})
+            onMouseEnter: (i) => w(i, B),
+            onMouseLeave: S,
+            title: B ? "Collapse swim lanes" : "Expand swim lanes",
+            children: B ? /* @__PURE__ */ u.jsx(Ne, {}) : /* @__PURE__ */ u.jsx(Je, {})
           }
         ) }),
-        E && _ != null && j != null && /* @__PURE__ */ a.jsx(
+        X && b != null && B != null && /* @__PURE__ */ u.jsx(
           "button",
           {
-            onClick: _,
+            onClick: b,
             style: {
-              ...N,
-              color: x.buttonActiveColor,
-              borderColor: `${x.buttonActiveColor}33`,
+              ...H,
+              color: m.buttonActiveColor,
+              borderColor: `${m.buttonActiveColor}33`,
               marginLeft: "4px"
             },
-            onMouseEnter: (c) => Y(c, j),
-            onMouseLeave: L,
-            title: j ? "Collapse swim lanes" : "Expand swim lanes",
-            children: j ? /* @__PURE__ */ a.jsx(Je, {}) : /* @__PURE__ */ a.jsx(Ne, {})
+            onMouseEnter: (i) => w(i, B),
+            onMouseLeave: S,
+            title: B ? "Collapse swim lanes" : "Expand swim lanes",
+            children: B ? /* @__PURE__ */ u.jsx(Ne, {}) : /* @__PURE__ */ u.jsx(Je, {})
           }
         )
       ]
     }
   );
 }, We = He(
-  (D, k) => {
+  (D, A) => {
     const {
-      currentTime: X,
-      defaultStartMs: u,
-      defaultEndMs: b,
-      theme: I,
-      maxTicks: q,
-      onTimeChange: P,
-      onDragStart: B,
+      currentTime: J,
+      defaultStartMs: l,
+      defaultEndMs: g,
+      theme: y,
+      maxTicks: I,
+      onTimeChange: O,
+      onDragStart: z,
       onDragEnd: R,
-      swimLanes: H,
-      showSwimLanes: ne,
-      onSwimLaneItemClick: Q,
-      onSwimLaneItemHover: ee,
-      onSwimLaneItemDoubleClick: G,
-      onSwimLaneItemContextMenu: x,
-      onSwimLaneReorder: j
-    } = D, _ = T(null), V = T(I), v = T(q), m = T(u), g = T(b), y = T(C.JulianDate.toDate(X).getTime());
-    $(() => {
-      V.current = I;
-    }, [I]), $(() => {
-      v.current = q;
-    }, [q]);
-    const E = T(H ?? []), ae = T(ne ?? (H != null && H.length > 0)), N = T(0), U = T(null), Y = T(null), L = T(Q), c = T(ee), J = T(G), z = T(x), re = T(j);
-    $(() => {
-      L.current = Q;
-    }, [Q]), $(() => {
-      c.current = ee;
-    }, [ee]), $(() => {
-      J.current = G;
-    }, [G]), $(() => {
-      z.current = x;
-    }, [x]), $(() => {
-      re.current = j;
-    }, [j]), $(() => {
-      E.current = H ?? [], i();
-    }, [H]), $(() => {
-      ae.current = ne ?? (H != null && H.length > 0), i();
-    }, [ne, H]);
-    const W = T(null), F = T(null), ce = T(!1), le = T(0), t = T("none"), l = T(0), w = T(0), A = T(0), te = T("none"), de = T(0), S = T(0), ue = (e, n) => Math.hypot(n.clientX - e.clientX, n.clientY - e.clientY), K = oe(() => ({
-      startMs: m.current,
-      endMs: g.current,
-      currentMs: y.current,
-      theme: V.current,
-      maxTicks: v.current,
-      swimLanes: E.current,
-      showSwimLanes: ae.current,
-      scrollTop: N.current,
-      reorderState: Y.current
+      swimLanes: W,
+      showSwimLanes: ee,
+      onSwimLaneItemClick: te,
+      onSwimLaneItemHover: V,
+      onSwimLaneItemDoubleClick: K,
+      onSwimLaneItemContextMenu: Z,
+      onSwimLaneReorder: P
+    } = D, m = v(null), B = v(y), b = v(I), d = v(l), x = v(g), M = v(C.JulianDate.toDate(J).getTime());
+    Y(() => {
+      B.current = y;
+    }, [y]), Y(() => {
+      b.current = I;
+    }, [I]);
+    const T = v(W ?? []), ce = v(ee ?? (W != null && W.length > 0)), X = v(0), Q = v(null), H = v(null), U = v(te), w = v(V), S = v(K), i = v(Z), k = v(P);
+    Y(() => {
+      U.current = te;
+    }, [te]), Y(() => {
+      w.current = V;
+    }, [V]), Y(() => {
+      S.current = K;
+    }, [K]), Y(() => {
+      i.current = Z;
+    }, [Z]), Y(() => {
+      k.current = P;
+    }, [P]), Y(() => {
+      T.current = W ?? [], h();
+    }, [W]), Y(() => {
+      ce.current = ee ?? (W != null && W.length > 0), h();
+    }, [ee, W]);
+    const j = v(null), $ = v(null), re = v(!1), ie = v(0), t = v("none"), a = v(0), E = v(0), L = v(0), q = v("none"), ue = v(0), _ = v(0), ae = (e, n) => Math.hypot(n.clientX - e.clientX, n.clientY - e.clientY), oe = ne(() => ({
+      startMs: d.current,
+      endMs: x.current,
+      currentMs: M.current,
+      theme: B.current,
+      maxTicks: b.current,
+      swimLanes: T.current,
+      showSwimLanes: ce.current,
+      scrollTop: X.current,
+      reorderState: H.current
     }), []);
-    Ue(k, () => ({
+    Ue(A, () => ({
       zoomTo(e, n, r) {
-        const s = Math.max(nt, Math.min(rt, n - e)), o = (e + n) / 2;
-        m.current = o - s / 2, g.current = o + s / 2, r !== void 0 && (y.current = r), i();
+        const c = Math.max(nt, Math.min(rt, n - e)), o = (e + n) / 2;
+        d.current = o - c / 2, x.current = o + c / 2, r !== void 0 && (M.current = r), h();
       },
       getVisibleRange() {
-        return { startMs: m.current, endMs: g.current };
+        return { startMs: d.current, endMs: x.current };
       },
       startFollow(e) {
-        if (le.current = e, F.current !== null) return;
-        ce.current = !0;
+        if (ie.current = e, $.current !== null) return;
+        re.current = !0;
         let n = performance.now();
         const r = () => {
-          const s = performance.now(), o = s - n;
-          n = s;
-          const f = o * le.current;
-          m.current += f, g.current += f, y.current += f, i(), F.current = requestAnimationFrame(r);
+          const c = performance.now(), o = c - n;
+          n = c;
+          const s = o * ie.current;
+          d.current += s, x.current += s, M.current += s, h(), $.current = requestAnimationFrame(r);
         };
-        F.current = requestAnimationFrame(r);
+        $.current = requestAnimationFrame(r);
       },
       stopFollow() {
-        ce.current = !1, F.current !== null && (cancelAnimationFrame(F.current), F.current = null);
+        re.current = !1, $.current !== null && (cancelAnimationFrame($.current), $.current = null);
       },
       correctFollow(e) {
-        if (!ce.current) return;
-        const n = e - y.current;
-        y.current = e, m.current += n, g.current += n;
+        if (!re.current) return;
+        const n = e - M.current;
+        M.current = e, d.current += n, x.current += n;
       },
       // ── Swim lane CRUD ──────────────────────────────────────────────
       appendSwimLane(e) {
-        E.current = [...E.current, e], i();
+        T.current = [...T.current, e], h();
       },
       updateSwimLane(e, n) {
-        E.current = E.current.map(
+        T.current = T.current.map(
           (r) => r.id === e ? { ...r, ...n, id: r.id } : r
-        ), i();
+        ), h();
       },
       removeSwimLane(e) {
-        E.current = E.current.filter((n) => n.id !== e), i();
+        T.current = T.current.filter((n) => n.id !== e), h();
       },
       reorderSwimLanes(e) {
-        const n = new Map(E.current.map((s) => [s.id, s])), r = [];
-        for (const s of e) {
-          const o = n.get(s);
+        const n = new Map(T.current.map((c) => [c.id, c])), r = [];
+        for (const c of e) {
+          const o = n.get(c);
           o && r.push(o);
         }
-        E.current = r, i();
+        T.current = r, h();
       }
     }));
-    const i = oe(() => {
-      const e = _.current;
+    const h = ne(() => {
+      const e = m.current;
       if (!e) return;
       const n = e.getContext("2d");
       if (!n) return;
-      const r = e.getBoundingClientRect(), s = r.width, o = r.height;
-      if (s === 0 || o === 0) return;
-      const f = window.devicePixelRatio || 1, h = Math.round(s * f), p = Math.round(o * f);
-      (e.width !== h || e.height !== p) && (e.width = h, e.height = p), n.save(), n.scale(f, f);
-      const O = Ve(n, s, o, K());
-      O !== N.current && (N.current = O), n.restore();
-    }, [K]);
+      const r = e.getBoundingClientRect(), c = r.width, o = r.height;
+      if (c === 0 || o === 0) return;
+      const s = window.devicePixelRatio || 1, f = Math.round(c * s), p = Math.round(o * s);
+      (e.width !== f || e.height !== p) && (e.width = f, e.height = p), n.save(), n.scale(s, s);
+      const F = Ve(n, c, o, oe());
+      F !== X.current && (X.current = F), n.restore();
+    }, [oe]);
     qe(() => {
-      i();
-      const e = _.current;
+      h();
+      const e = m.current;
       if (!e) return;
-      const n = new ResizeObserver(() => i());
+      const n = new ResizeObserver(() => h());
       return n.observe(e), () => n.disconnect();
-    }, [i]), $(() => {
-      if (ce.current) return;
-      const e = C.JulianDate.toDate(X).getTime();
-      y.current !== e && (y.current = e, i());
-    }, [X, i]);
-    const me = oe((e) => {
-      if (W.current !== null) return;
+    }, [h]), Y(() => {
+      if (re.current) return;
+      const e = C.JulianDate.toDate(J).getTime();
+      M.current !== e && (M.current = e, h());
+    }, [J, h]);
+    const le = ne((e) => {
+      if (j.current !== null) return;
       const n = () => {
-        const r = _.current, s = g.current - m.current, o = e * s * 0.01;
-        if (m.current += o, g.current += o, r) {
-          const f = r.getBoundingClientRect(), h = Math.max(0, Math.min(f.width, w.current - f.left)), p = m.current + h / f.width * (g.current - m.current);
-          y.current = p, P(C.JulianDate.fromDate(new Date(p)));
+        const r = m.current, c = x.current - d.current, o = e * c * 0.01;
+        if (d.current += o, x.current += o, r) {
+          const s = r.getBoundingClientRect(), f = Math.max(0, Math.min(s.width, E.current - s.left)), p = d.current + f / s.width * (x.current - d.current);
+          M.current = p, O(C.JulianDate.fromDate(new Date(p)));
         }
-        i(), W.current = requestAnimationFrame(n);
+        h(), j.current = requestAnimationFrame(n);
       };
-      W.current = requestAnimationFrame(n);
-    }, [i, P]), ie = oe(() => {
-      W.current !== null && (cancelAnimationFrame(W.current), W.current = null);
-    }, []), se = oe((e, n, r, s) => Ke(e, n, r, s, K()), [K]), xe = oe((e, n, r) => Ze(e, n, r, K()), [K]), he = oe((e, n) => Qe(e, n, K()), [K]), Re = oe((e) => {
+      j.current = requestAnimationFrame(n);
+    }, [h, O]), N = ne(() => {
+      j.current !== null && (cancelAnimationFrame(j.current), j.current = null);
+    }, []), se = ne((e, n, r, c) => Ke(e, n, r, c, oe()), [oe]), de = ne((e, n, r) => Ze(e, n, r, oe()), [oe]), me = ne((e, n) => Qe(e, n, oe()), [oe]), ye = ne((e) => {
       e.preventDefault();
-      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, s = e.clientY - n.top;
-      if (e.button === 0 && re.current) {
-        const o = xe(r, s, n.height);
+      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, c = e.clientY - n.top;
+      if (e.button === 0 && k.current) {
+        const o = de(r, c, n.height);
         if (o) {
-          const h = E.current.findIndex((p) => p.id === o.id);
-          Y.current = {
+          const f = T.current.findIndex((p) => p.id === o.id);
+          H.current = {
             dragging: !0,
             dragLaneId: o.id,
             dragStartY: e.clientY,
             currentY: e.clientY,
-            insertIndex: h
+            insertIndex: f
           }, e.currentTarget.style.cursor = "grabbing";
           return;
         }
       }
-      if (e.button === 0 && he(s, n.height)) {
-        const o = (y.current - m.current) / (g.current - m.current) * n.width;
-        if (!(Math.abs(r - o) <= 10) && se(r, s, n.width, n.height)) {
-          A.current = performance.now();
+      if (e.button === 0 && me(c, n.height)) {
+        const o = (M.current - d.current) / (x.current - d.current) * n.width;
+        if (!(Math.abs(r - o) <= 10) && se(r, c, n.width, n.height)) {
+          L.current = performance.now();
           return;
         }
       }
       if (e.button === 0) {
-        t.current = "scrub", w.current = e.clientX, e.currentTarget.style.cursor = "grabbing", B == null || B();
-        const o = m.current + r / n.width * (g.current - m.current);
-        y.current = o, i(), P(C.JulianDate.fromDate(new Date(o)));
+        t.current = "scrub", E.current = e.clientX, e.currentTarget.style.cursor = "grabbing", z == null || z();
+        const o = d.current + r / n.width * (x.current - d.current);
+        M.current = o, h(), O(C.JulianDate.fromDate(new Date(o)));
       } else if (e.button === 1)
-        t.current = "slide", l.current = e.clientX;
+        t.current = "slide", a.current = e.clientX;
       else if (e.button === 2) {
-        if (z.current && he(s, n.height))
+        if (i.current && me(c, n.height))
           return;
-        t.current = "zoom", l.current = e.clientX;
+        t.current = "zoom", a.current = e.clientX;
       }
-    }, [i, P, B, xe, he, se]);
-    $(() => {
+    }, [h, O, z, de, me, se]);
+    Y(() => {
       const e = (r) => {
-        const s = Y.current;
-        if (s && s.dragging) {
-          s.currentY = r.clientY;
-          const p = _.current;
+        const c = H.current;
+        if (c && c.dragging) {
+          c.currentY = r.clientY;
+          const p = m.current;
           if (p) {
-            const O = p.getBoundingClientRect(), Z = r.clientY - O.top;
-            let Ee = -N.current;
-            const _e = E.current;
+            const F = p.getBoundingClientRect(), G = r.clientY - F.top;
+            let we = -X.current;
+            const _e = T.current;
             let je = _e.length;
-            for (let ye = 0; ye < _e.length; ye++) {
-              const Ae = _e[ye].height ?? Le, $e = Ee + Ae / 2;
-              if (Z < $e) {
-                je = ye;
+            for (let Ee = 0; Ee < _e.length; Ee++) {
+              const Ae = _e[Ee].height ?? Le, $e = we + Ae / 2;
+              if (G < $e) {
+                je = Ee;
                 break;
               }
-              Ee += Ae + Ie;
+              we += Ae + Ie;
             }
-            s.insertIndex = je;
+            c.insertIndex = je;
           }
-          i();
+          h();
           return;
         }
         if (t.current === "none") return;
-        const o = _.current;
+        const o = m.current;
         if (!o) return;
-        const f = o.getBoundingClientRect(), h = f.width;
+        const s = o.getBoundingClientRect(), f = s.width;
         if (t.current === "scrub") {
-          w.current = r.clientX;
-          const p = r.clientX - f.left, O = h * 0.08;
-          p < O ? me(-1) : p > h - O ? me(1) : ie();
-          const Z = Math.max(0, Math.min(h, p)), fe = m.current + Z / h * (g.current - m.current);
-          y.current = fe, i(), P(C.JulianDate.fromDate(new Date(fe)));
+          E.current = r.clientX;
+          const p = r.clientX - s.left, F = f * 0.08;
+          p < F ? le(-1) : p > f - F ? le(1) : N();
+          const G = Math.max(0, Math.min(f, p)), fe = d.current + G / f * (x.current - d.current);
+          M.current = fe, h(), O(C.JulianDate.fromDate(new Date(fe)));
         } else if (t.current === "slide") {
-          const p = l.current - r.clientX;
-          if (l.current = r.clientX, p !== 0) {
-            const O = p / h * (g.current - m.current);
-            m.current += O, g.current += O, i();
+          const p = a.current - r.clientX;
+          if (a.current = r.clientX, p !== 0) {
+            const F = p / f * (x.current - d.current);
+            d.current += F, x.current += F, h();
           }
         } else if (t.current === "zoom") {
-          const p = l.current - r.clientX;
-          l.current = r.clientX, p !== 0 && pe(Math.pow(1.01, p));
+          const p = a.current - r.clientX;
+          a.current = r.clientX, p !== 0 && pe(Math.pow(1.01, p));
         }
       }, n = () => {
-        var s;
-        const r = Y.current;
+        var c;
+        const r = H.current;
         if (r && r.dragging) {
-          const o = Math.abs(r.currentY - r.dragStartY), f = E.current, h = f.findIndex((p) => p.id === r.dragLaneId);
-          if (o > 5 && h >= 0 && r.insertIndex !== h && r.insertIndex !== h + 1) {
-            const p = [...f], [O] = p.splice(h, 1), Z = r.insertIndex > h ? r.insertIndex - 1 : r.insertIndex;
-            p.splice(Z, 0, O), E.current = p, (s = re.current) == null || s.call(re, p.map((fe) => fe.id));
+          const o = Math.abs(r.currentY - r.dragStartY), s = T.current, f = s.findIndex((p) => p.id === r.dragLaneId);
+          if (o > 5 && f >= 0 && r.insertIndex !== f && r.insertIndex !== f + 1) {
+            const p = [...s], [F] = p.splice(f, 1), G = r.insertIndex > f ? r.insertIndex - 1 : r.insertIndex;
+            p.splice(G, 0, F), T.current = p, (c = k.current) == null || c.call(k, p.map((fe) => fe.id));
           }
-          Y.current = null, _.current && (_.current.style.cursor = "default"), i();
+          H.current = null, m.current && (m.current.style.cursor = "default"), h();
           return;
         }
-        ie(), t.current = "none", _.current && (_.current.style.cursor = "default"), R == null || R();
+        N(), t.current = "none", m.current && (m.current.style.cursor = "default"), R == null || R();
       };
       return document.addEventListener("mousemove", e), document.addEventListener("mouseup", n), () => {
         document.removeEventListener("mousemove", e), document.removeEventListener("mouseup", n);
       };
-    }, [i, P, R, me, ie]);
-    const pe = oe((e) => {
-      const n = et(m.current, g.current, e);
-      m.current = n.startMs, g.current = n.endMs, i();
-    }, [i]), be = oe((e) => {
+    }, [h, O, R, le, N]);
+    const pe = ne((e) => {
+      const n = et(d.current, x.current, e);
+      d.current = n.startMs, x.current = n.endMs, h();
+    }, [h]), ge = ne((e) => {
       e.preventDefault();
-      const n = _.current;
+      const n = m.current;
       if (!n) return;
-      const r = n.getBoundingClientRect(), s = e.clientY - r.top, o = ae.current, f = E.current;
-      if (o && f.length > 0) {
-        const h = Math.max(0, r.height - ze);
-        if (s >= 0 && s < h) {
+      const r = n.getBoundingClientRect(), c = e.clientY - r.top, o = ce.current, s = T.current;
+      if (o && s.length > 0) {
+        const f = Math.max(0, r.height - ze);
+        if (c >= 0 && c < f) {
           let p = 0;
-          for (const Z of f) p += (Z.height ?? Le) + Ie;
-          const O = Math.max(0, p - h);
-          if (O > 0) {
-            N.current = Math.max(0, Math.min(O, N.current + e.deltaY * tt)), i();
+          for (const G of s) p += (G.height ?? Le) + Ie;
+          const F = Math.max(0, p - f);
+          if (F > 0) {
+            X.current = Math.max(0, Math.min(F, X.current + e.deltaY * tt)), h();
             return;
           }
         }
       }
       pe(Math.pow(1.05, e.deltaY > 0 ? -1 : 1));
-    }, [pe, i]);
-    $(() => {
-      const e = _.current;
+    }, [pe, h]);
+    Y(() => {
+      const e = m.current;
       if (e)
-        return e.addEventListener("wheel", be, { passive: !1 }), () => e.removeEventListener("wheel", be);
-    }, [be]), $(() => {
-      const e = _.current;
+        return e.addEventListener("wheel", ge, { passive: !1 }), () => e.removeEventListener("wheel", ge);
+    }, [ge]), Y(() => {
+      const e = m.current;
       if (!e) return;
       const n = (o) => {
         o.preventDefault();
-        const f = e.getBoundingClientRect();
+        const s = e.getBoundingClientRect();
         if (o.touches.length === 1) {
-          const h = o.touches[0].clientX - f.left, p = Math.max(0, Math.min(f.width, h)), O = m.current + p / f.width * (g.current - m.current);
-          te.current = "scrub", de.current = o.touches[0].clientX, w.current = o.touches[0].clientX, y.current = O, i(), B == null || B(), P(C.JulianDate.fromDate(new Date(O)));
-        } else o.touches.length >= 2 && (te.current = "pinch", S.current = ue(o.touches[0], o.touches[1]));
+          const f = o.touches[0].clientX - s.left, p = Math.max(0, Math.min(s.width, f)), F = d.current + p / s.width * (x.current - d.current);
+          q.current = "scrub", ue.current = o.touches[0].clientX, E.current = o.touches[0].clientX, M.current = F, h(), z == null || z(), O(C.JulianDate.fromDate(new Date(F)));
+        } else o.touches.length >= 2 && (q.current = "pinch", _.current = ae(o.touches[0], o.touches[1]));
       }, r = (o) => {
         o.preventDefault();
-        const f = e.getBoundingClientRect();
-        if (te.current === "scrub" && o.touches.length >= 1) {
-          const h = o.touches[0].clientX - f.left, p = f.width * 0.08;
-          if (w.current = o.touches[0].clientX, h < p) me(-1);
-          else if (h > f.width - p) me(1);
+        const s = e.getBoundingClientRect();
+        if (q.current === "scrub" && o.touches.length >= 1) {
+          const f = o.touches[0].clientX - s.left, p = s.width * 0.08;
+          if (E.current = o.touches[0].clientX, f < p) le(-1);
+          else if (f > s.width - p) le(1);
           else {
-            ie();
-            const O = Math.max(0, Math.min(f.width, h)), Z = m.current + O / f.width * (g.current - m.current);
-            y.current = Z, i(), P(C.JulianDate.fromDate(new Date(Z)));
+            N();
+            const F = Math.max(0, Math.min(s.width, f)), G = d.current + F / s.width * (x.current - d.current);
+            M.current = G, h(), O(C.JulianDate.fromDate(new Date(G)));
           }
-        } else if (te.current === "slide" && o.touches.length >= 1) {
-          const h = de.current - o.touches[0].clientX;
-          if (de.current = o.touches[0].clientX, h !== 0) {
-            const p = h / f.width * (g.current - m.current);
-            m.current += p, g.current += p, i();
+        } else if (q.current === "slide" && o.touches.length >= 1) {
+          const f = ue.current - o.touches[0].clientX;
+          if (ue.current = o.touches[0].clientX, f !== 0) {
+            const p = f / s.width * (x.current - d.current);
+            d.current += p, x.current += p, h();
           }
-        } else if (te.current === "pinch" && o.touches.length >= 2) {
-          const h = ue(o.touches[0], o.touches[1]);
-          h > 0 && S.current > 0 && pe(S.current / h), S.current = h;
+        } else if (q.current === "pinch" && o.touches.length >= 2) {
+          const f = ae(o.touches[0], o.touches[1]);
+          f > 0 && _.current > 0 && pe(_.current / f), _.current = f;
         }
-      }, s = (o) => {
-        ie(), te.current === "scrub" && (R == null || R()), o.touches.length === 0 ? te.current = "none" : o.touches.length === 1 && (te.current = "slide", de.current = o.touches[0].clientX);
+      }, c = (o) => {
+        N(), q.current === "scrub" && (R == null || R()), o.touches.length === 0 ? q.current = "none" : o.touches.length === 1 && (q.current = "slide", ue.current = o.touches[0].clientX);
       };
-      return e.addEventListener("touchstart", n, { passive: !1 }), e.addEventListener("touchmove", r, { passive: !1 }), e.addEventListener("touchend", s, { passive: !1 }), () => {
-        e.removeEventListener("touchstart", n), e.removeEventListener("touchmove", r), e.removeEventListener("touchend", s);
+      return e.addEventListener("touchstart", n, { passive: !1 }), e.addEventListener("touchmove", r, { passive: !1 }), e.addEventListener("touchend", c, { passive: !1 }), () => {
+        e.removeEventListener("touchstart", n), e.removeEventListener("touchmove", r), e.removeEventListener("touchend", c);
       };
-    }, [i, B, R, P, pe, me, ie]);
-    const Ce = oe((e) => {
-      var h, p, O;
+    }, [h, z, R, O, pe, le, N]);
+    const Me = ne((e) => {
+      var f, p, F;
       if (t.current !== "none") return;
-      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, s = e.clientY - n.top, o = (y.current - m.current) / (g.current - m.current) * n.width, f = Math.abs(r - o) <= 10;
-      if (he(s, n.height)) {
-        const Z = se(r, s, n.width, n.height), fe = U.current;
-        if (Z)
-          e.currentTarget.style.cursor = f ? "grab" : "pointer", (!fe || fe.item.id !== Z.item.id || fe.lane.id !== Z.lane.id) && (U.current = Z, (h = c.current) == null || h.call(c, { laneId: Z.lane.id, item: Z.item, originalEvent: e.nativeEvent }), i());
-        else if (fe && (U.current = null, (p = c.current) == null || p.call(c, null), i()), f)
+      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, c = e.clientY - n.top, o = (M.current - d.current) / (x.current - d.current) * n.width, s = Math.abs(r - o) <= 10;
+      if (me(c, n.height)) {
+        const G = se(r, c, n.width, n.height), fe = Q.current;
+        if (G)
+          e.currentTarget.style.cursor = s ? "grab" : "pointer", (!fe || fe.item.id !== G.item.id || fe.lane.id !== G.lane.id) && (Q.current = G, (f = w.current) == null || f.call(w, { laneId: G.lane.id, item: G.item, originalEvent: e.nativeEvent }), h());
+        else if (fe && (Q.current = null, (p = w.current) == null || p.call(w, null), h()), s)
           e.currentTarget.style.cursor = "grab";
         else {
-          const Ee = xe(r, s, n.height);
-          e.currentTarget.style.cursor = Ee && re.current ? "grab" : "default";
+          const we = de(r, c, n.height);
+          e.currentTarget.style.cursor = we && k.current ? "grab" : "default";
         }
         return;
       }
-      U.current && (U.current = null, (O = c.current) == null || O.call(c, null), i()), e.currentTarget.style.cursor = f ? "grab" : "default";
-    }, [i, se, he, xe]), De = oe((e) => {
-      var h;
-      if (performance.now() - A.current > 300) return;
-      const r = e.currentTarget.getBoundingClientRect(), s = e.clientX - r.left, o = e.clientY - r.top, f = se(s, o, r.width, r.height);
-      f && ((h = L.current) == null || h.call(L, { laneId: f.lane.id, item: f.item, originalEvent: e.nativeEvent }));
-    }, [se]), d = oe((e) => {
+      Q.current && (Q.current = null, (F = w.current) == null || F.call(w, null), h()), e.currentTarget.style.cursor = s ? "grab" : "default";
+    }, [h, se, me, de]), Re = ne((e) => {
       var f;
-      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, s = e.clientY - n.top, o = se(r, s, n.width, n.height);
-      o && ((f = J.current) == null || f.call(J, { laneId: o.lane.id, item: o.item, originalEvent: e.nativeEvent }));
-    }, [se]), M = oe((e) => {
-      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, s = e.clientY - n.top, o = se(r, s, n.width, n.height);
-      o && z.current ? (e.preventDefault(), z.current({ laneId: o.lane.id, item: o.item, originalEvent: e.nativeEvent })) : e.preventDefault();
+      if (performance.now() - L.current > 300) return;
+      const r = e.currentTarget.getBoundingClientRect(), c = e.clientX - r.left, o = e.clientY - r.top, s = se(c, o, r.width, r.height);
+      s && ((f = U.current) == null || f.call(U, { laneId: s.lane.id, item: s.item, originalEvent: e.nativeEvent }));
+    }, [se]), Ce = ne((e) => {
+      var s;
+      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, c = e.clientY - n.top, o = se(r, c, n.width, n.height);
+      o && ((s = S.current) == null || s.call(S, { laneId: o.lane.id, item: o.item, originalEvent: e.nativeEvent }));
+    }, [se]), De = ne((e) => {
+      const n = e.currentTarget.getBoundingClientRect(), r = e.clientX - n.left, c = e.clientY - n.top, o = se(r, c, n.width, n.height);
+      o && i.current ? (e.preventDefault(), i.current({ laneId: o.lane.id, item: o.item, originalEvent: e.nativeEvent })) : e.preventDefault();
     }, [se]);
-    return $(() => () => {
-      W.current !== null && cancelAnimationFrame(W.current), F.current !== null && cancelAnimationFrame(F.current);
-    }, []), /* @__PURE__ */ a.jsx(
+    return Y(() => () => {
+      j.current !== null && cancelAnimationFrame(j.current), $.current !== null && cancelAnimationFrame($.current);
+    }, []), /* @__PURE__ */ u.jsx(
       "canvas",
       {
-        ref: _,
+        ref: m,
         style: { width: "100%", flex: 1, minHeight: 0, display: "block", cursor: "default" },
-        onMouseDown: Re,
-        onMouseMove: Ce,
-        onClick: De,
-        onDoubleClick: d,
+        onMouseDown: ye,
+        onMouseMove: Me,
+        onClick: Re,
+        onDoubleClick: Ce,
         onMouseLeave: () => {
           var e;
-          U.current && (U.current = null, (e = c.current) == null || e.call(c, null), i()), t.current === "none" && _.current && (_.current.style.cursor = "default");
+          Q.current && (Q.current = null, (e = w.current) == null || e.call(w, null), h()), t.current === "none" && m.current && (m.current.style.cursor = "default");
         },
-        onContextMenu: M
+        onContextMenu: De
       }
     );
   }
@@ -896,169 +900,173 @@ const dt = 520, ft = () => /* @__PURE__ */ a.jsxs("svg", { width: "14", height:
 We.displayName = "TimelineCanvas";
 const Xe = [2, 4, 8, 16, 32, 100, 1], Ye = [1, 2, 4, 8, 16, 32, 100], xt = ({
   startTime: D,
-  endTime: k,
-  currentTime: X,
-  clock: u,
-  onTimeChange: b,
-  onPlayPause: I,
-  onMultiplierChange: q,
-  height: P,
-  showControls: B = !0,
-  enableDrag: R = !0,
-  dateTimeFormat: H,
-  onDateTimeClick: ne,
-  jumpToTime: Q,
-  maxTicks: ee,
-  ffSpeeds: G = Xe,
-  rwSpeeds: x = Ye,
-  theme: j,
-  className: _,
-  swimLanes: V,
-  showSwimLanes: v,
-  onShowSwimLanesChange: m,
-  swimLaneTransition: g = "animated",
-  onSwimLaneItemClick: y,
-  onSwimLaneItemHover: E,
-  onSwimLaneItemDoubleClick: ae,
-  onSwimLaneItemContextMenu: N,
+  endTime: A,
+  currentTime: J,
+  clock: l,
+  onTimeChange: g,
+  onPlayPause: y,
+  onMultiplierChange: I,
+  height: O,
+  showControls: z = !0,
+  showJumpToStart: R,
+  showJumpToEnd: W,
+  enableDrag: ee = !0,
+  dateTimeFormat: te,
+  onDateTimeClick: V,
+  jumpToTime: K,
+  maxTicks: Z,
+  ffSpeeds: P = Xe,
+  rwSpeeds: m = Ye,
+  theme: B,
+  className: b,
+  swimLanes: d,
+  showSwimLanes: x,
+  onShowSwimLanesChange: M,
+  swimLaneTransition: T = "animated",
+  onSwimLaneItemClick: ce,
+  onSwimLaneItemHover: X,
+  onSwimLaneItemDoubleClick: Q,
+  onSwimLaneItemContextMenu: H,
   onSwimLaneReorder: U
 }) => {
-  const Y = () => Date.now(), L = D ? C.JulianDate.toDate(ge(D)).getTime() : Y() - 432e5, c = k ? C.JulianDate.toDate(ge(k)).getTime() : Y() + 12 * 3600 * 1e3, [J, z] = ve(
-    () => ge(X ?? D ?? C.JulianDate.fromDate(/* @__PURE__ */ new Date()))
-  ), [re, W] = ve((u == null ? void 0 : u.shouldAnimate) ?? !1), [F, ce] = ve((u == null ? void 0 : u.multiplier) ?? 1), [le, t] = ve(v ?? !0);
-  $(() => {
-    v != null && t(v);
-  }, [v]);
-  const l = () => {
-    const d = !le;
-    t(d), m == null || m(d);
-  }, w = V != null && V.length > 0, A = T(null), [te, de] = ve(0);
-  $(() => {
-    const d = A.current;
-    if (!d) return;
-    const M = new ResizeObserver(([e]) => de(e.borderBoxSize[0].blockSize));
-    return M.observe(d), () => M.disconnect();
-  }, [B]);
-  const ue = w && !le ? `${te + ze}px` : P != null ? `${P}px` : "100%", K = T(!1), i = T(null), me = { ...ot, ...j };
-  $(() => {
-    if (!u) return;
-    const d = () => {
-      if (!K.current) {
-        const M = C.JulianDate.clone(u.currentTime);
-        if (z(M), W(u.shouldAnimate), ce(u.multiplier), i.current) {
-          const { startMs: e, endMs: n } = i.current.getVisibleRange(), r = n - e, s = C.JulianDate.toDate(M).getTime(), o = s - e;
-          o <= r * 0.1 ? i.current.zoomTo(s - r * 0.1, s + r * 0.9, s) : o >= r * 0.9 && i.current.zoomTo(s - r * 0.9, s + r * 0.1, s);
+  const w = () => Date.now(), S = D ? C.JulianDate.toDate(he(D)).getTime() : w() - 432e5, i = A ? C.JulianDate.toDate(he(A)).getTime() : w() + 12 * 3600 * 1e3, [k, j] = xe(
+    () => he(J ?? D ?? C.JulianDate.fromDate(/* @__PURE__ */ new Date()))
+  ), [$, re] = xe((l == null ? void 0 : l.shouldAnimate) ?? !1), [ie, t] = xe((l == null ? void 0 : l.multiplier) ?? 1), [a, E] = xe(x ?? !0);
+  Y(() => {
+    x != null && E(x);
+  }, [x]);
+  const L = () => {
+    const e = !a;
+    E(e), M == null || M(e);
+  }, q = d != null && d.length > 0, ue = v(null), [_, ae] = xe(0);
+  Y(() => {
+    const e = ue.current;
+    if (!e) return;
+    const n = new ResizeObserver(([r]) => ae(r.borderBoxSize[0].blockSize));
+    return n.observe(e), () => n.disconnect();
+  }, [z]);
+  const h = q && !a ? `${_ + ze}px` : O != null ? `${O}px` : "100%", le = v(!1), N = v(null), se = { ...ot, ...B };
+  Y(() => {
+    if (!l) return;
+    const e = () => {
+      if (!le.current) {
+        const n = C.JulianDate.clone(l.currentTime);
+        if (j(n), re(l.shouldAnimate), t(l.multiplier), N.current) {
+          const { startMs: r, endMs: c } = N.current.getVisibleRange(), o = c - r, s = C.JulianDate.toDate(n).getTime(), f = s - r;
+          f <= o * 0.1 ? N.current.zoomTo(s - o * 0.1, s + o * 0.9, s) : f >= o * 0.9 && N.current.zoomTo(s - o * 0.9, s + o * 0.1, s);
         }
       }
     };
-    return u.onTick.addEventListener(d), () => {
-      u.onTick.removeEventListener(d);
+    return l.onTick.addEventListener(e), () => {
+      l.onTick.removeEventListener(e);
     };
-  }, [u]), $(() => {
-    if (u) return;
-    const d = setInterval(() => {
-      if (K.current) return;
-      const M = C.JulianDate.fromDate(/* @__PURE__ */ new Date());
-      if (z(M), i.current) {
-        const { startMs: e, endMs: n } = i.current.getVisibleRange(), r = n - e, s = C.JulianDate.toDate(M).getTime(), o = s - e;
-        o <= r * 0.1 ? i.current.zoomTo(s - r * 0.1, s + r * 0.9, s) : o >= r * 0.9 && i.current.zoomTo(s - r * 0.9, s + r * 0.1, s);
+  }, [l]), Y(() => {
+    if (l) return;
+    const e = setInterval(() => {
+      if (le.current) return;
+      const n = C.JulianDate.fromDate(/* @__PURE__ */ new Date());
+      if (j(n), N.current) {
+        const { startMs: r, endMs: c } = N.current.getVisibleRange(), o = c - r, s = C.JulianDate.toDate(n).getTime(), f = s - r;
+        f <= o * 0.1 ? N.current.zoomTo(s - o * 0.1, s + o * 0.9, s) : f >= o * 0.9 && N.current.zoomTo(s - o * 0.9, s + o * 0.1, s);
       }
     }, 1e3);
-    return () => clearInterval(d);
-  }, [u]), $(() => {
-    if (!Q) return;
-    const d = ge(Q);
-    if (se(d), i.current) {
-      const { startMs: M, endMs: e } = i.current.getVisibleRange(), n = e - M, r = C.JulianDate.toDate(d).getTime();
-      i.current.zoomTo(r - n / 2, r + n / 2);
+    return () => clearInterval(e);
+  }, [l]), Y(() => {
+    if (!K) return;
+    const e = he(K);
+    if (me(e), N.current) {
+      const { startMs: n, endMs: r } = N.current.getVisibleRange(), c = r - n, o = C.JulianDate.toDate(e).getTime();
+      N.current.zoomTo(o - c / 2, o + c / 2);
     }
-  }, [Q]);
-  const ie = (d, M = !0) => {
-    u && (u.multiplier = d, M && (u.shouldAnimate = !0)), ce(d), M && W(!0), q == null || q(d);
-  }, se = (d) => {
-    z(d), u && (u.currentTime = C.JulianDate.clone(d)), b == null || b(d);
-  }, xe = (d) => {
-    d && F < 0 && ie(1, !1), u && (u.shouldAnimate = d), W(d), I == null || I(d);
-  }, he = () => {
-    const d = G.length > 0 ? G : Xe, M = F > 1 ? F : 1, e = d.indexOf(M), n = d[e < 0 || e === d.length - 1 ? 0 : e + 1];
-    ie(n);
-  }, Re = () => {
-    const d = x.length > 0 ? x : Ye, M = F < 0 ? Math.abs(F) : 0, e = d.indexOf(M), n = -d[e < 0 || e === d.length - 1 ? 0 : e + 1];
-    ie(n);
+  }, [K]);
+  const de = (e, n = !0) => {
+    l && (l.multiplier = e, n && (l.shouldAnimate = !0)), t(e), n && re(!0), I == null || I(e);
+  }, me = (e) => {
+    j(e), l && (l.currentTime = C.JulianDate.clone(e)), g == null || g(e);
+  }, ye = (e) => {
+    e && ie < 0 && de(1, !1), l && (l.shouldAnimate = e), re(e), y == null || y(e);
   }, pe = () => {
-    var M;
-    const d = ge(D ?? C.JulianDate.fromDate(new Date(L)));
-    u && (u.currentTime = C.JulianDate.clone(d)), z(d), (M = i.current) == null || M.zoomTo(L, c);
-  }, be = () => {
-    var M;
-    const d = ge(k ?? C.JulianDate.fromDate(new Date(c)));
-    u && (u.currentTime = C.JulianDate.clone(d)), z(d), (M = i.current) == null || M.zoomTo(L, c);
+    const e = P.length > 0 ? P : Xe, n = ie > 1 ? ie : 1, r = e.indexOf(n), c = e[r < 0 || r === e.length - 1 ? 0 : r + 1];
+    de(c);
+  }, ge = () => {
+    const e = m.length > 0 ? m : Ye, n = ie < 0 ? Math.abs(ie) : 0, r = e.indexOf(n), c = -e[r < 0 || r === e.length - 1 ? 0 : r + 1];
+    de(c);
+  }, Me = () => {
+    var n;
+    const e = he(D ?? C.JulianDate.fromDate(new Date(S)));
+    l && (l.currentTime = C.JulianDate.clone(e)), j(e), (n = N.current) == null || n.zoomTo(S, i);
+  }, Re = () => {
+    var n;
+    const e = he(A ?? C.JulianDate.fromDate(new Date(i)));
+    l && (l.currentTime = C.JulianDate.clone(e)), j(e), (n = N.current) == null || n.zoomTo(S, i);
   }, Ce = () => {
-    var e;
-    const d = C.JulianDate.fromDate(/* @__PURE__ */ new Date());
-    u && (u.currentTime = C.JulianDate.clone(d)), z(d), ie(1);
-    const M = Date.now();
-    (e = i.current) == null || e.zoomTo(M - 12 * 3600 * 1e3, M + 12 * 3600 * 1e3);
-  }, De = Math.abs(C.JulianDate.toDate(J).getTime() - Date.now()) < 1e4;
-  return /* @__PURE__ */ a.jsxs(
+    var r;
+    const e = C.JulianDate.fromDate(/* @__PURE__ */ new Date());
+    l && (l.currentTime = C.JulianDate.clone(e)), j(e), de(1);
+    const n = Date.now();
+    (r = N.current) == null || r.zoomTo(n - 12 * 3600 * 1e3, n + 12 * 3600 * 1e3);
+  }, De = Math.abs(C.JulianDate.toDate(k).getTime() - Date.now()) < 1e4;
+  return /* @__PURE__ */ u.jsxs(
     "div",
     {
-      className: _,
+      className: b,
       style: {
         width: "100%",
-        height: ue,
+        height: h,
         overflow: "hidden",
         display: "flex",
         flexDirection: "column",
         fontFamily: "system-ui, -apple-system, sans-serif",
-        transition: g === "animated" ? "height 0.2s ease" : void 0
+        transition: T === "animated" ? "height 0.2s ease" : void 0
       },
       children: [
-        B && /* @__PURE__ */ a.jsx("div", { ref: A, children: /* @__PURE__ */ a.jsx(
+        z && /* @__PURE__ */ u.jsx("div", { ref: ue, children: /* @__PURE__ */ u.jsx(
           mt,
           {
-            currentTime: J,
-            isPlaying: re,
-            multiplier: F,
+            currentTime: k,
+            isPlaying: $,
+            multiplier: ie,
             isLive: De,
             hasStartTime: D != null,
-            hasEndTime: k != null,
-            onPlayPause: xe,
-            onJumpToStart: pe,
-            onRewind: Re,
-            onFastForward: he,
-            onJumpToEnd: be,
+            hasEndTime: A != null,
+            showJumpToStart: R,
+            showJumpToEnd: W,
+            onPlayPause: ye,
+            onJumpToStart: Me,
+            onRewind: ge,
+            onFastForward: pe,
+            onJumpToEnd: Re,
             onJumpToLive: Ce,
-            onResetSpeed: () => ie(1),
-            onDateTimeClick: ne,
-            dateTimeFormat: H,
-            theme: me,
-            swimLanesVisible: w ? le : void 0,
-            onToggleSwimLanes: w ? l : void 0
+            onResetSpeed: () => de(1),
+            onDateTimeClick: V,
+            dateTimeFormat: te,
+            theme: se,
+            swimLanesVisible: q ? a : void 0,
+            onToggleSwimLanes: q ? L : void 0
           }
         ) }),
-        R !== !1 && /* @__PURE__ */ a.jsx(
+        ee !== !1 && /* @__PURE__ */ u.jsx(
           We,
           {
-            ref: i,
-            currentTime: J,
-            defaultStartMs: L,
-            defaultEndMs: c,
-            theme: me,
-            maxTicks: ee,
-            onTimeChange: se,
+            ref: N,
+            currentTime: k,
+            defaultStartMs: S,
+            defaultEndMs: i,
+            theme: se,
+            maxTicks: Z,
+            onTimeChange: me,
             onDragStart: () => {
-              K.current = !0;
+              le.current = !0;
             },
             onDragEnd: () => {
-              K.current = !1;
+              le.current = !1;
             },
-            swimLanes: V,
-            showSwimLanes: le,
-            onSwimLaneItemClick: y,
-            onSwimLaneItemHover: E,
-            onSwimLaneItemDoubleClick: ae,
-            onSwimLaneItemContextMenu: N,
+            swimLanes: d,
+            showSwimLanes: a,
+            onSwimLaneItemClick: ce,
+            onSwimLaneItemHover: X,
+            onSwimLaneItemDoubleClick: Q,
+            onSwimLaneItemContextMenu: H,
             onSwimLaneReorder: U
           }
         )
@@ -1067,127 +1075,127 @@ const Xe = [2, 4, 8, 16, 32, 100, 1], Ye = [1, 2, 4, 8, 16, 32, 100], xt = ({
   );
 }, gt = ({
   startTime: D,
-  endTime: k,
-  currentTime: X,
-  width: u,
-  height: b,
-  tickInterval: I,
-  showLabels: q,
-  snapToTicks: P,
-  enableDrag: B,
+  endTime: A,
+  currentTime: J,
+  width: l,
+  height: g,
+  tickInterval: y,
+  showLabels: I,
+  snapToTicks: O,
+  enableDrag: z,
   theme: R,
-  onTimeChange: H,
-  onVisibleRangeChange: ne,
-  onDragStart: Q,
-  onDragEnd: ee
+  onTimeChange: W,
+  onVisibleRangeChange: ee,
+  onDragStart: te,
+  onDragEnd: V
 }) => {
-  const G = Se(
-    () => st(D, k, I, u),
-    [D, k, I, u]
-  ), x = Se(
-    () => ct(X, D, k, u),
-    [X, D, k, u]
-  ), j = T(null), _ = (v) => {
-    if (!B) return;
-    const m = v.currentTarget.getBoundingClientRect(), g = v.clientX - m.left, y = Math.max(0, Math.min(u, g));
-    if (!(Math.abs(y - x) <= 10)) {
-      let W = y;
-      P && (W = it(y, G, 10));
-      const F = new Date(D).getTime(), ce = new Date(k).getTime();
-      H(C.JulianDate.fromDate(new Date(F + W / u * (ce - F))));
+  const K = Se(
+    () => st(D, A, y, l),
+    [D, A, y, l]
+  ), Z = Se(
+    () => ct(J, D, A, l),
+    [J, D, A, l]
+  ), P = v(null), m = (b) => {
+    if (!z) return;
+    const d = b.currentTarget.getBoundingClientRect(), x = b.clientX - d.left, M = Math.max(0, Math.min(l, x));
+    if (!(Math.abs(M - Z) <= 10)) {
+      let j = M;
+      O && (j = it(M, K, 10));
+      const $ = new Date(D).getTime(), re = new Date(A).getTime();
+      W(C.JulianDate.fromDate(new Date($ + j / l * (re - $))));
       return;
     }
-    Q == null || Q();
-    const ae = v.clientX, N = new Date(X).getTime(), U = new Date(D).getTime(), L = (new Date(k).getTime() - U) / u;
-    let c = 0, J = !1;
-    const z = (W) => {
-      c = W.clientX - ae, J = !0, j.current || (j.current = requestAnimationFrame(() => {
-        if (J) {
-          const F = N + c * L;
-          H(C.JulianDate.fromDate(new Date(F))), J = !1;
+    te == null || te();
+    const ce = b.clientX, X = new Date(J).getTime(), Q = new Date(D).getTime(), U = (new Date(A).getTime() - Q) / l;
+    let w = 0, S = !1;
+    const i = (j) => {
+      w = j.clientX - ce, S = !0, P.current || (P.current = requestAnimationFrame(() => {
+        if (S) {
+          const $ = X + w * U;
+          W(C.JulianDate.fromDate(new Date($))), S = !1;
         }
-        j.current = null;
+        P.current = null;
       }));
-    }, re = () => {
-      document.removeEventListener("mousemove", z), document.removeEventListener("mouseup", re), j.current !== null && (cancelAnimationFrame(j.current), j.current = null), ee == null || ee();
+    }, k = () => {
+      document.removeEventListener("mousemove", i), document.removeEventListener("mouseup", k), P.current !== null && (cancelAnimationFrame(P.current), P.current = null), V == null || V();
     };
-    document.addEventListener("mousemove", z), document.addEventListener("mouseup", re);
-  }, V = (v) => {
-    v.preventDefault();
-    const m = v.shiftKey ? v.deltaY : v.deltaX !== 0 ? v.deltaX : v.deltaY;
-    if (Math.abs(m) < 1) return;
-    const g = new Date(D).getTime(), y = new Date(k).getTime(), E = m / u * (y - g) * 0.5;
-    ne == null || ne(
-      C.JulianDate.fromDate(new Date(g + E)),
-      C.JulianDate.fromDate(new Date(y + E))
+    document.addEventListener("mousemove", i), document.addEventListener("mouseup", k);
+  }, B = (b) => {
+    b.preventDefault();
+    const d = b.shiftKey ? b.deltaY : b.deltaX !== 0 ? b.deltaX : b.deltaY;
+    if (Math.abs(d) < 1) return;
+    const x = new Date(D).getTime(), M = new Date(A).getTime(), T = d / l * (M - x) * 0.5;
+    ee == null || ee(
+      C.JulianDate.fromDate(new Date(x + T)),
+      C.JulianDate.fromDate(new Date(M + T))
     );
   };
-  return /* @__PURE__ */ a.jsxs(
+  return /* @__PURE__ */ u.jsxs(
     "svg",
     {
       width: "100%",
-      height: b,
+      height: g,
       style: { backgroundColor: R.backgroundColor, display: "block", cursor: "default" },
-      onMouseDown: _,
-      onWheel: V,
+      onMouseDown: m,
+      onWheel: B,
       children: [
-        /* @__PURE__ */ a.jsx("rect", { width: u, height: b, fill: R.backgroundColor }),
-        G.map((v, m) => /* @__PURE__ */ a.jsxs("g", { children: [
-          /* @__PURE__ */ a.jsx(
+        /* @__PURE__ */ u.jsx("rect", { width: l, height: g, fill: R.backgroundColor }),
+        K.map((b, d) => /* @__PURE__ */ u.jsxs("g", { children: [
+          /* @__PURE__ */ u.jsx(
             "line",
             {
-              x1: v.position,
-              y1: b - (v.isMajor ? R.majorTickHeight : R.minorTickHeight),
-              x2: v.position,
-              y2: b,
-              stroke: v.isMajor ? R.majorTickColor : R.tickColor,
+              x1: b.position,
+              y1: g - (b.isMajor ? R.majorTickHeight : R.minorTickHeight),
+              x2: b.position,
+              y2: g,
+              stroke: b.isMajor ? R.majorTickColor : R.tickColor,
               strokeWidth: "1"
             }
           ),
-          q && v.isMajor && v.label && /* @__PURE__ */ a.jsx(
+          I && b.isMajor && b.label && /* @__PURE__ */ u.jsx(
             "text",
             {
-              x: v.position,
-              y: b - R.majorTickHeight - 5,
+              x: b.position,
+              y: g - R.majorTickHeight - 5,
               textAnchor: "middle",
               fill: R.labelColor,
               fontSize: R.fontSize,
               fontFamily: "monospace",
-              children: v.label
+              children: b.label
             }
           )
-        ] }, m)),
-        /* @__PURE__ */ a.jsx(
+        ] }, d)),
+        /* @__PURE__ */ u.jsx(
           "line",
           {
-            x1: x,
+            x1: Z,
             y1: 0,
-            x2: x,
-            y2: b,
+            x2: Z,
+            y2: g,
             stroke: R.indicatorColor,
             strokeWidth: R.indicatorLineWidth,
             pointerEvents: "none"
           }
         ),
-        B && /* @__PURE__ */ a.jsx(
+        z && /* @__PURE__ */ u.jsx(
           "rect",
           {
-            x: Math.max(0, x - 10),
+            x: Math.max(0, Z - 10),
             y: 0,
             width: 20,
-            height: b,
+            height: g,
             fill: "transparent",
             style: { cursor: "ew-resize" },
             pointerEvents: "visiblePainted"
           }
         ),
-        /* @__PURE__ */ a.jsx("circle", { cx: x, cy: 5, r: 4, fill: R.indicatorColor, pointerEvents: "none" })
+        /* @__PURE__ */ u.jsx("circle", { cx: Z, cy: 5, r: 4, fill: R.indicatorColor, pointerEvents: "none" })
       ]
     }
   );
 };
 export {
-  Tt as TICK_AREA_HEIGHT,
+  Et as TICK_AREA_HEIGHT,
   xt as Timeline,
   We as TimelineCanvas,
   mt as TimelineControls,