@kteneyck/cesium-timeline-core 0.1.0

package/dist/cesium-timeline-core.js

@@ -0,0 +1,447 @@
+import * as k from "cesium";
+const ye = {
+  backgroundColor: "#1a1a1a",
+  tickColor: "#666666",
+  majorTickColor: "#999999",
+  labelColor: "#cccccc",
+  indicatorColor: "#d69826",
+  indicatorLineWidth: 5,
+  majorTickHeight: 10,
+  minorTickHeight: 5,
+  fontSize: 12,
+  controlBarBackground: "#242424",
+  controlBarBorder: "#333333",
+  buttonColor: "#666666",
+  buttonHoverColor: "#888888",
+  buttonActiveColor: "#d69826",
+  swimLaneItemBorderColor: "#666666",
+  swimLaneItemBorderWidth: 0
+};
+var ae = /* @__PURE__ */ ((e) => (e[e.FIFTEEN_MIN = 15] = "FIFTEEN_MIN", e[e.THIRTY_MIN = 30] = "THIRTY_MIN", e[e.HOURLY = 60] = "HOURLY", e[e.CUSTOM = -1] = "CUSTOM", e))(ae || {});
+const w = {
+  color: "#4da6ff",
+  borderColor: "#2980b9",
+  borderWidth: 1,
+  opacity: 0.8,
+  markerShape: "diamond",
+  markerSize: 10,
+  labelColor: "#cccccc",
+  backgroundColor: "transparent"
+}, R = 24;
+function He(e) {
+  return e instanceof k.JulianDate ? k.JulianDate.clone(e) : k.JulianDate.fromDate(e);
+}
+function ce(e) {
+  return e instanceof k.JulianDate ? k.JulianDate.toDate(e) : e;
+}
+function W(e) {
+  return ce(e).getTime();
+}
+function ke(e) {
+  return k.JulianDate.fromDate(new Date(e));
+}
+function ue(e, t) {
+  return W(t) - W(e);
+}
+const he = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], Me = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], me = {
+  /** e.g. "Feb 24 2026 14:04:07" — default */
+  DEFAULT: "MMM DD YYYY HH:mm:ss",
+  /** e.g. "Feb 24 2026 02:04:07 PM" */
+  TWELVE_HR: "MMM DD YYYY hh:mm:ss A",
+  /** e.g. "2026-02-24 14:04:07" */
+  ISO: "YYYY-MM-DD HH:mm:ss",
+  /** e.g. "02/24/2026 14:04" */
+  US: "MM/DD/YYYY HH:mm",
+  /** e.g. "24/02/2026 14:04" */
+  EU: "DD/MM/YYYY HH:mm",
+  /** e.g. "14:04:07" */
+  TIME_ONLY: "HH:mm:ss",
+  /** e.g. "02:04:07 PM" */
+  TIME_12: "hh:mm:ss A"
+};
+function ge(e, t = me.DEFAULT) {
+  const o = ce(e), l = o.getFullYear(), r = o.getMonth(), s = o.getDate(), a = o.getHours(), i = a % 12 || 12, u = o.getMinutes(), c = o.getSeconds(), d = o.getMilliseconds(), M = a < 12 ? "AM" : "PM", m = (Y) => String(Y).padStart(2, "0"), f = (Y) => String(Y).padStart(3, "0"), T = {
+    YYYY: String(l),
+    YY: String(l).slice(-2),
+    MMMM: Me[r],
+    MMM: he[r],
+    MM: m(r + 1),
+    M: String(r + 1),
+    DD: m(s),
+    D: String(s),
+    HH: m(a),
+    H: String(a),
+    hh: m(i),
+    h: String(i),
+    mm: m(u),
+    ss: m(c),
+    SSS: f(d),
+    A: M,
+    a: M.toLowerCase()
+  };
+  return t.replace(
+    /YYYY|YY|MMMM|MMM|MM|M|DD|D|HH|H|hh|h|mm|ss|SSS|A|a/g,
+    (Y) => T[Y] ?? Y
+  );
+}
+function Le(e = me.DEFAULT) {
+  const t = ["YYYY", "YY", "MMMM", "MMM", "MM", "M", "DD", "D"], o = ["HH", "H", "hh", "h", "mm", "ss", "SSS", "A", "a"], l = (a) => a.replace(/\s{2,}/g, " ").trim().replace(/^[\s\W]+|[\s\W]+$/g, "").trim();
+  let r = e;
+  for (const a of t) r = r.replace(a, "");
+  let s = e;
+  for (const a of o) s = s.replace(a, "");
+  return { timeFormat: l(r), dateFormat: l(s) };
+}
+function Ye(e, t = !1) {
+  return ge(e, t ? "HH:mm:ss" : "HH:mm");
+}
+function de(e, t, o, l) {
+  const r = W(e), s = W(t), a = W(o);
+  if (a === s) return 0;
+  const i = (r - s) / (a - s);
+  return Math.max(0, Math.min(1, i)) * l;
+}
+function Ce(e, t, o, l) {
+  const r = Math.max(0, Math.min(1, e / l)), s = W(t), a = W(o), i = s + r * (a - s);
+  return k.JulianDate.fromDate(new Date(i));
+}
+function Ae(e, t, o, l) {
+  const r = [], s = ue(e, t), a = W(e);
+  let i;
+  typeof o == "number" && o in ae || typeof o == "number" ? i = o * 60 * 1e3 : i = 3600 * 1e3;
+  const u = i * 4;
+  let c = a, d = 0;
+  for (; c <= a + s; ) {
+    const M = d * i % u === 0, m = de(
+      new Date(c),
+      e,
+      t,
+      l
+    );
+    let f;
+    if (M) {
+      const T = new Date(c), Y = T.getHours().toString().padStart(2, "0"), b = T.getMinutes().toString().padStart(2, "0");
+      f = `${Y}:${b}`;
+    }
+    r.push({
+      position: m,
+      isMajor: M,
+      label: f
+    }), c += i, d++;
+  }
+  return r;
+}
+function Ee(e, t, o = 10) {
+  let l = t[0], r = Math.abs(l.position - e);
+  for (const s of t) {
+    const a = Math.abs(s.position - e);
+    a < r && (r = a, l = s);
+  }
+  return r <= o ? l.position : e;
+}
+const Se = 1e3, Te = 31536e9, S = [
+  1e-3,
+  2e-3,
+  5e-3,
+  0.01,
+  0.02,
+  0.05,
+  0.1,
+  0.25,
+  0.5,
+  1,
+  2,
+  5,
+  10,
+  15,
+  30,
+  60,
+  120,
+  300,
+  600,
+  900,
+  1800,
+  3600,
+  7200,
+  14400,
+  21600,
+  43200,
+  86400,
+  172800,
+  345600,
+  604800,
+  1296e3,
+  2592e3,
+  5184e3,
+  7776e3,
+  15552e3,
+  31536e3,
+  63072e3,
+  126144e3,
+  15768e4,
+  31536e4,
+  63072e4,
+  126144e4,
+  15768e5,
+  31536e5,
+  63072e5,
+  126144e5,
+  15768e6,
+  31536e6
+], G = 36, P = 1, be = 6, Z = 6, _e = 0.3, x = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+function A(e) {
+  return e < 10 ? `0${e}` : `${e}`;
+}
+function le(e, t) {
+  const o = new Date(e), l = o.getFullYear(), r = o.getMonth(), s = o.getDate(), a = o.getHours(), i = o.getMinutes(), u = o.getSeconds(), c = o.getMilliseconds();
+  if (t > 31536e4) return `${l}`;
+  if (t > 31536e3) return `${x[r]} ${l}`;
+  if (t > 604800) return `${x[r]} ${s}`;
+  if (t > 86400) return `${x[r]} ${s} ${A(a)}:${A(i)}`;
+  if (t > 3600) return `${A(a)}:${A(i)}`;
+  if (t > 60) return `${A(a)}:${A(i)}:${A(u)}`;
+  const d = c > 0 ? `.${String(c).padStart(3, "0")}` : "";
+  return `${A(a)}:${A(i)}:${A(u)}${d}`;
+}
+function pe(e, t) {
+  const o = new Date(e), l = o.getFullYear(), r = o.getMonth(), s = o.getDate();
+  return t > 31536e4 ? new Date(Math.floor(l / 100) * 100, 0).getTime() : t > 31536e3 ? new Date(Math.floor(l / 10) * 10, 0).getTime() : t > 86400 ? new Date(l, 0).getTime() : new Date(l, r, s).getTime();
+}
+function ee(e, t) {
+  return Math.ceil(e / t + 0.5) * t;
+}
+function fe(e, t, o) {
+  var l, r, s, a, i, u, c, d, M, m, f, T;
+  return {
+    color: ((l = t.style) == null ? void 0 : l.color) ?? ((r = e.style) == null ? void 0 : r.color) ?? w.color,
+    borderColor: ((s = t.style) == null ? void 0 : s.borderColor) ?? ((a = e.style) == null ? void 0 : a.borderColor) ?? (o == null ? void 0 : o.swimLaneItemBorderColor) ?? w.borderColor,
+    borderWidth: ((i = t.style) == null ? void 0 : i.borderWidth) ?? ((u = e.style) == null ? void 0 : u.borderWidth) ?? (o == null ? void 0 : o.swimLaneItemBorderWidth) ?? w.borderWidth,
+    opacity: ((c = t.style) == null ? void 0 : c.opacity) ?? ((d = e.style) == null ? void 0 : d.opacity) ?? w.opacity,
+    markerShape: ((M = t.style) == null ? void 0 : M.markerShape) ?? ((m = e.style) == null ? void 0 : m.markerShape) ?? w.markerShape,
+    markerSize: ((f = t.style) == null ? void 0 : f.markerSize) ?? ((T = e.style) == null ? void 0 : T.markerSize) ?? w.markerSize
+  };
+}
+function De(e) {
+  return Math.max(Se, Math.min(Te, e));
+}
+function $e(e, t, o) {
+  const l = t - e, r = (e + t) / 2, s = De(l * o);
+  return {
+    startMs: r - s / 2,
+    endMs: r + s / 2
+  };
+}
+function we(e) {
+  let t = 0;
+  for (const o of e) t += (o.height ?? R) + P;
+  return t;
+}
+function Re(e, t, o, l, r) {
+  const { swimLanes: s, showSwimLanes: a, scrollTop: i, startMs: u, endMs: c, theme: d } = r;
+  if (!a || s.length === 0) return null;
+  const M = Math.max(0, l - G);
+  if (t < 0 || t >= M) return null;
+  let m = -i;
+  for (const f of s) {
+    const T = f.height ?? R, Y = m, b = m + T;
+    if (m += T + P, !(t < Y || t >= b)) {
+      for (const y of f.items) {
+        if (y.interval) {
+          const F = k.JulianDate.toDate(y.interval.start).getTime(), O = k.JulianDate.toDate(y.interval.stop).getTime(), B = (F - u) / (c - u) * o, X = (O - u) / (c - u) * o;
+          if (e >= Math.max(0, B) && e <= Math.min(o, X))
+            return { lane: f, item: y };
+        }
+        if (y.instant) {
+          const O = (k.JulianDate.toDate(y.instant).getTime() - u) / (c - u) * o, B = fe(f, y, d);
+          if (Math.abs(e - O) <= B.markerSize / 2 + 2)
+            return { lane: f, item: y };
+        }
+      }
+      return null;
+    }
+  }
+  return null;
+}
+function We(e, t, o, l) {
+  const { swimLanes: r, showSwimLanes: s, scrollTop: a } = l;
+  if (!s || r.length === 0 || e > 80) return null;
+  const i = Math.max(0, o - G);
+  if (t < 0 || t >= i) return null;
+  let u = -a;
+  for (const c of r) {
+    const d = c.height ?? R;
+    if (t >= u && t < u + d) return c;
+    u += d + P;
+  }
+  return null;
+}
+function Je(e, t, o) {
+  if (!o.showSwimLanes || o.swimLanes.length === 0) return !1;
+  const l = Math.max(0, t - G);
+  return e >= 0 && e < l;
+}
+function Ne(e, t, o, l) {
+  const {
+    startMs: r,
+    endMs: s,
+    currentMs: a,
+    theme: i,
+    maxTicks: u,
+    swimLanes: c,
+    showSwimLanes: d,
+    reorderState: M
+  } = l;
+  let { scrollTop: m } = l;
+  const f = (s - r) / 1e3;
+  if (f <= 0) return m;
+  e.fillStyle = i.backgroundColor, e.fillRect(0, 0, t, o);
+  const T = d && c.length > 0, b = T ? Math.max(0, o - G) : 0;
+  let y = 0;
+  if (T)
+    for (const n of c) y += (n.height ?? R) + P;
+  const F = Math.max(0, y - b);
+  if (m > F && (m = F), m < 0 && (m = 0), T && b > 0) {
+    e.save(), e.beginPath(), e.rect(0, 0, t, b), e.clip();
+    let n = -m;
+    const p = (D) => (D - r) / (s - r) * t;
+    for (const D of c) {
+      const g = D.height ?? R, L = n + g;
+      if (L > 0 && n < b) {
+        const h = D.style, I = (h == null ? void 0 : h.backgroundColor) ?? w.backgroundColor;
+        I && I !== "transparent" && (e.fillStyle = I, e.fillRect(0, n, t, g)), e.strokeStyle = i.tickColor + "44", e.lineWidth = 0.5, e.beginPath(), e.moveTo(0, L), e.lineTo(t, L), e.stroke();
+        for (const E of D.items) {
+          const H = fe(D, E, i);
+          if (E.interval) {
+            const V = k.JulianDate.toDate(E.interval.start).getTime(), C = k.JulianDate.toDate(E.interval.stop).getTime(), J = p(V), N = p(C), q = Math.max(0, J), Q = Math.min(t, N) - q;
+            if (Q > 0) {
+              e.globalAlpha = H.opacity, e.fillStyle = H.color;
+              const re = 3, ie = n + re, se = g - re * 2;
+              e.fillRect(q, ie, Q, se), H.borderWidth > 0 && (e.strokeStyle = H.borderColor, e.lineWidth = H.borderWidth, e.strokeRect(q, ie, Q, se)), e.globalAlpha = 1;
+            }
+          }
+          if (E.instant) {
+            const V = k.JulianDate.toDate(E.instant).getTime(), C = p(V);
+            if (C >= -H.markerSize && C <= t + H.markerSize) {
+              const J = n + g / 2, N = H.markerSize;
+              e.globalAlpha = H.opacity, e.fillStyle = H.color, H.markerShape === "diamond" ? (e.beginPath(), e.moveTo(C, J - N / 2), e.lineTo(C + N / 2, J), e.lineTo(C, J + N / 2), e.lineTo(C - N / 2, J), e.closePath(), e.fill()) : H.markerShape === "circle" ? (e.beginPath(), e.arc(C, J, N / 2, 0, Math.PI * 2), e.fill()) : (e.strokeStyle = H.color, e.lineWidth = 2, e.beginPath(), e.moveTo(C, n + 2), e.lineTo(C, n + g - 2), e.stroke()), e.globalAlpha = 1;
+            }
+          }
+        }
+        e.font = `${Math.min(11, g - 4)}px system-ui, sans-serif`, e.textAlign = "left", e.textBaseline = "middle", e.fillStyle = (h == null ? void 0 : h.labelColor) ?? w.labelColor, e.fillText(D.label, be, n + g / 2);
+      }
+      if (n += g + P, n >= b) break;
+    }
+    if (M && M.dragging) {
+      const D = M.currentY - M.dragStartY;
+      let g = -m;
+      for (let h = 0; h < c.length && h < M.insertIndex; h++)
+        g += (c[h].height ?? R) + P;
+      e.strokeStyle = i.indicatorColor, e.lineWidth = 2, e.beginPath(), e.moveTo(0, g), e.lineTo(t, g), e.stroke();
+      const L = c.find((h) => h.id === M.dragLaneId);
+      if (L) {
+        const h = L.height ?? R;
+        let I = -m;
+        for (const E of c) {
+          if (E.id === M.dragLaneId) break;
+          I += (E.height ?? R) + P;
+        }
+        e.globalAlpha = 0.4, e.fillStyle = i.indicatorColor, e.fillRect(0, I + D, t, h), e.globalAlpha = 1;
+      }
+    }
+    if (y > b) {
+      const D = t - Z - 2, g = b / y, L = Math.max(20, b * g), h = m / F * (b - L);
+      e.fillStyle = i.tickColor + "22", e.fillRect(D, 0, Z, b), e.fillStyle = i.tickColor + "88", e.fillRect(D, h, Z, L);
+    }
+    e.restore();
+  }
+  e.font = `${i.fontSize}px monospace`;
+  const O = le(r + f * 500, f), B = e.measureText(O).width + 24, X = Math.max(B / t * f, f / 1e3);
+  let _ = S[S.length - 1], z = S.length - 1;
+  for (let n = 0; n < S.length; n++)
+    if (S[n] > X) {
+      _ = S[n], z = n;
+      break;
+    }
+  if (u != null && u > 0)
+    for (; z < S.length - 1 && f / _ > u; )
+      z++, _ = S[z];
+  let $ = 0;
+  for (let n = z - 1; n >= 0; n--)
+    if (_ % S[n] < 1e-4) {
+      t * (S[n] / f) >= 3 && ($ = S[n]);
+      break;
+    }
+  let U = 0;
+  if ($ > 0) {
+    for (let n = 0; n < S.length && S[n] < $; n++)
+      if ($ % S[n] < 1e-4 && t * (S[n] / f) >= 3) {
+        U = S[n];
+        break;
+      }
+  }
+  const te = pe(r, f), j = (r - te) / 1e3, K = j + f, v = (n) => t * ((n - j) / f);
+  if (U > 0) {
+    e.strokeStyle = i.tickColor, e.lineWidth = 1;
+    for (let n = Math.floor(j / U) * U; n <= K; n = ee(n, U)) {
+      const p = v(n);
+      e.beginPath(), e.moveTo(p, o - i.minorTickHeight), e.lineTo(p, o), e.stroke();
+    }
+  }
+  if ($ > 0) {
+    e.strokeStyle = i.tickColor, e.lineWidth = 1;
+    for (let n = Math.floor(j / $) * $; n <= K; n = ee(n, $)) {
+      const p = v(n);
+      e.beginPath(), e.moveTo(p, o - i.minorTickHeight), e.lineTo(p, o), e.stroke();
+    }
+  }
+  e.textAlign = "center", e.textBaseline = "bottom";
+  let oe = -1 / 0;
+  for (let n = Math.floor(j / _) * _; n <= K + _; n = ee(n, _)) {
+    const p = v(n), D = te + n * 1e3;
+    e.strokeStyle = i.majorTickColor, e.lineWidth = 1, e.beginPath(), e.moveTo(p, o - i.majorTickHeight), e.lineTo(p, o), e.stroke();
+    const g = le(D, f), L = e.measureText(g).width, h = p - L / 2;
+    h > oe && (e.fillStyle = i.labelColor, e.fillText(g, p, o - i.majorTickHeight - 4), oe = h + L + 5);
+  }
+  const ne = (a - r) / (s - r) * t;
+  return e.strokeStyle = i.indicatorColor, e.lineWidth = i.indicatorLineWidth, e.beginPath(), e.moveTo(ne, 0), e.lineTo(ne, o), e.stroke(), m;
+}
+export {
+  R as DEFAULT_LANE_HEIGHT,
+  me as DateTimeFormats,
+  be as LABEL_PAD_LEFT,
+  P as LANE_GAP,
+  Te as MAX_SPAN_MS,
+  Se as MIN_SPAN_MS,
+  x as MONTHS,
+  Z as SCROLLBAR_WIDTH,
+  _e as SWIM_LANE_SCROLL_SPEED,
+  G as TICK_AREA_HEIGHT,
+  S as TIC_SCALES,
+  ae as TickInterval,
+  pe as calcEpochMs,
+  De as clampSpan,
+  w as defaultSwimLaneStyle,
+  ye as defaultTheme,
+  Ne as drawTimeline,
+  ge as formatDateTime,
+  Ye as formatTime,
+  ke as fromMilliseconds,
+  Ae as generateTicks,
+  ue as getDurationMs,
+  We as hitTestLaneLabel,
+  Re as hitTestSwimLane,
+  Je as isInSwimLaneRegion,
+  le as makeLabel,
+  ee as nextTic,
+  Ce as positionToTime,
+  fe as resolveItemStyle,
+  Ee as snapToTick,
+  Le as splitForDisplay,
+  de as timeToPosition,
+  ce as toDate,
+  He as toJulianDate,
+  W as toMilliseconds,
+  we as totalSwimLaneHeight,
+  A as twoD,
+  $e as zoomRange
+};

package/dist/cesium-timeline-core.umd.cjs

@@ -0,0 +1 @@
+(function(r,B){typeof exports=="object"&&typeof module<"u"?B(exports,require("cesium")):typeof define=="function"&&define.amd?define(["exports","cesium"],B):(r=typeof globalThis<"u"?globalThis:r||self,B(r.CesiumTimelineCore={},r.Cesium))})(this,(function(r,B){"use strict";function Le(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,a.get?a:{enumerable:!0,get:()=>e[o]})}}return t.default=e,Object.freeze(t)}const H=Le(B),He={backgroundColor:"#1a1a1a",tickColor:"#666666",majorTickColor:"#999999",labelColor:"#cccccc",indicatorColor:"#d69826",indicatorLineWidth:5,majorTickHeight:10,minorTickHeight:5,fontSize:12,controlBarBackground:"#242424",controlBarBorder:"#333333",buttonColor:"#666666",buttonHoverColor:"#888888",buttonActiveColor:"#d69826",swimLaneItemBorderColor:"#666666",swimLaneItemBorderWidth:0};var Q=(e=>(e[e.FIFTEEN_MIN=15]="FIFTEEN_MIN",e[e.THIRTY_MIN=30]="THIRTY_MIN",e[e.HOURLY=60]="HOURLY",e[e.CUSTOM=-1]="CUSTOM",e))(Q||{});const E={color:"#4da6ff",borderColor:"#2980b9",borderWidth:1,opacity:.8,markerShape:"diamond",markerSize:10,labelColor:"#cccccc",backgroundColor:"transparent"},w=24;function ke(e){return e instanceof H.JulianDate?H.JulianDate.clone(e):H.JulianDate.fromDate(e)}function Z(e){return e instanceof H.JulianDate?H.JulianDate.toDate(e):e}function I(e){return Z(e).getTime()}function pe(e){return H.JulianDate.fromDate(new Date(e))}function se(e,t){return I(t)-I(e)}const Ae=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],Ce=["January","February","March","April","May","June","July","August","September","October","November","December"],x={DEFAULT:"MMM DD YYYY HH:mm:ss",TWELVE_HR:"MMM DD YYYY hh:mm:ss A",ISO:"YYYY-MM-DD HH:mm:ss",US:"MM/DD/YYYY HH:mm",EU:"DD/MM/YYYY HH:mm",TIME_ONLY:"HH:mm:ss",TIME_12:"hh:mm:ss A"};function ce(e,t=x.DEFAULT){const o=Z(e),a=o.getFullYear(),i=o.getMonth(),s=o.getDate(),c=o.getHours(),l=c%12||12,M=o.getMinutes(),m=o.getSeconds(),T=o.getMilliseconds(),g=c<12?"AM":"PM",f=_=>String(_).padStart(2,"0"),u=_=>String(_).padStart(3,"0"),b={YYYY:String(a),YY:String(a).slice(-2),MMMM:Ce[i],MMM:Ae[i],MM:f(i+1),M:String(i+1),DD:f(s),D:String(s),HH:f(c),H:String(c),hh:f(l),h:String(l),mm:f(M),ss:f(m),SSS:u(T),A:g,a:g.toLowerCase()};return t.replace(/YYYY|YY|MMMM|MMM|MM|M|DD|D|HH|H|hh|h|mm|ss|SSS|A|a/g,_=>b[_]??_)}function _e(e=x.DEFAULT){const t=["YYYY","YY","MMMM","MMM","MM","M","DD","D"],o=["HH","H","hh","h","mm","ss","SSS","A","a"],a=c=>c.replace(/\s{2,}/g," ").trim().replace(/^[\s\W]+|[\s\W]+$/g,"").trim();let i=e;for(const c of t)i=i.replace(c,"");let s=e;for(const c of o)s=s.replace(c,"");return{timeFormat:a(i),dateFormat:a(s)}}function Ye(e,t=!1){return ce(e,t?"HH:mm:ss":"HH:mm")}function me(e,t,o,a){const i=I(e),s=I(t),c=I(o);if(c===s)return 0;const l=(i-s)/(c-s);return Math.max(0,Math.min(1,l))*a}function Ee(e,t,o,a){const i=Math.max(0,Math.min(1,e/a)),s=I(t),c=I(o),l=s+i*(c-s);return H.JulianDate.fromDate(new Date(l))}function we(e,t,o,a){const i=[],s=se(e,t),c=I(e);let l;typeof o=="number"&&o in Q||typeof o=="number"?l=o*60*1e3:l=3600*1e3;const M=l*4;let m=c,T=0;for(;m<=c+s;){const g=T*l%M===0,f=me(new Date(m),e,t,a);let u;if(g){const b=new Date(m),_=b.getHours().toString().padStart(2,"0"),D=b.getMinutes().toString().padStart(2,"0");u=`${_}:${D}`}i.push({position:f,isMajor:g,label:u}),m+=l,T++}return i}function Ie(e,t,o=10){let a=t[0],i=Math.abs(a.position-e);for(const s of t){const c=Math.abs(s.position-e);c<i&&(i=c,a=s)}return i<=o?a.position:e}const fe=1e3,ue=31536e9,d=[.001,.002,.005,.01,.02,.05,.1,.25,.5,1,2,5,10,15,30,60,120,300,600,900,1800,3600,7200,14400,21600,43200,86400,172800,345600,604800,1296e3,2592e3,5184e3,7776e3,15552e3,31536e3,63072e3,126144e3,15768e4,31536e4,63072e4,126144e4,15768e5,31536e5,63072e5,126144e5,15768e6,31536e6],z=36,R=1,Me=6,K=6,Pe=.3,q=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];function C(e){return e<10?`0${e}`:`${e}`}function ee(e,t){const o=new Date(e),a=o.getFullYear(),i=o.getMonth(),s=o.getDate(),c=o.getHours(),l=o.getMinutes(),M=o.getSeconds(),m=o.getMilliseconds();if(t>31536e4)return`${a}`;if(t>31536e3)return`${q[i]} ${a}`;if(t>604800)return`${q[i]} ${s}`;if(t>86400)return`${q[i]} ${s} ${C(c)}:${C(l)}`;if(t>3600)return`${C(c)}:${C(l)}`;if(t>60)return`${C(c)}:${C(l)}:${C(M)}`;const T=m>0?`.${String(m).padStart(3,"0")}`:"";return`${C(c)}:${C(l)}:${C(M)}${T}`}function he(e,t){const o=new Date(e),a=o.getFullYear(),i=o.getMonth(),s=o.getDate();return t>31536e4?new Date(Math.floor(a/100)*100,0).getTime():t>31536e3?new Date(Math.floor(a/10)*10,0).getTime():t>86400?new Date(a,0).getTime():new Date(a,i,s).getTime()}function V(e,t){return Math.ceil(e/t+.5)*t}function te(e,t,o){var a,i,s,c,l,M,m,T,g,f,u,b;return{color:((a=t.style)==null?void 0:a.color)??((i=e.style)==null?void 0:i.color)??E.color,borderColor:((s=t.style)==null?void 0:s.borderColor)??((c=e.style)==null?void 0:c.borderColor)??(o==null?void 0:o.swimLaneItemBorderColor)??E.borderColor,borderWidth:((l=t.style)==null?void 0:l.borderWidth)??((M=e.style)==null?void 0:M.borderWidth)??(o==null?void 0:o.swimLaneItemBorderWidth)??E.borderWidth,opacity:((m=t.style)==null?void 0:m.opacity)??((T=e.style)==null?void 0:T.opacity)??E.opacity,markerShape:((g=t.style)==null?void 0:g.markerShape)??((f=e.style)==null?void 0:f.markerShape)??E.markerShape,markerSize:((u=t.style)==null?void 0:u.markerSize)??((b=e.style)==null?void 0:b.markerSize)??E.markerSize}}function ge(e){return Math.max(fe,Math.min(ue,e))}function Re(e,t,o){const a=t-e,i=(e+t)/2,s=ge(a*o);return{startMs:i-s/2,endMs:i+s/2}}function Ne(e){let t=0;for(const o of e)t+=(o.height??w)+R;return t}function Oe(e,t,o,a,i){const{swimLanes:s,showSwimLanes:c,scrollTop:l,startMs:M,endMs:m,theme:T}=i;if(!c||s.length===0)return null;const g=Math.max(0,a-z);if(t<0||t>=g)return null;let f=-l;for(const u of s){const b=u.height??w,_=f,D=f+b;if(f+=b+R,!(t<_||t>=D)){for(const k of u.items){if(k.interval){const F=H.JulianDate.toDate(k.interval.start).getTime(),j=H.JulianDate.toDate(k.interval.stop).getTime(),U=(F-M)/(m-M)*o,oe=(j-M)/(m-M)*o;if(e>=Math.max(0,U)&&e<=Math.min(o,oe))return{lane:u,item:k}}if(k.instant){const j=(H.JulianDate.toDate(k.instant).getTime()-M)/(m-M)*o,U=te(u,k,T);if(Math.abs(e-j)<=U.markerSize/2+2)return{lane:u,item:k}}}return null}}return null}function We(e,t,o,a){const{swimLanes:i,showSwimLanes:s,scrollTop:c}=a;if(!s||i.length===0||e>80)return null;const l=Math.max(0,o-z);if(t<0||t>=l)return null;let M=-c;for(const m of i){const T=m.height??w;if(t>=M&&t<M+T)return m;M+=T+R}return null}function $e(e,t,o){if(!o.showSwimLanes||o.swimLanes.length===0)return!1;const a=Math.max(0,t-z);return e>=0&&e<a}function Fe(e,t,o,a){const{startMs:i,endMs:s,currentMs:c,theme:l,maxTicks:M,swimLanes:m,showSwimLanes:T,reorderState:g}=a;let{scrollTop:f}=a;const u=(s-i)/1e3;if(u<=0)return f;e.fillStyle=l.backgroundColor,e.fillRect(0,0,t,o);const b=T&&m.length>0,D=b?Math.max(0,o-z):0;let k=0;if(b)for(const n of m)k+=(n.height??w)+R;const F=Math.max(0,k-D);if(f>F&&(f=F),f<0&&(f=0),b&&D>0){e.save(),e.beginPath(),e.rect(0,0,t,D),e.clip();let n=-f;const y=L=>(L-i)/(s-i)*t;for(const L of m){const S=L.height??w,A=n+S;if(A>0&&n<D){const h=L.style,J=(h==null?void 0:h.backgroundColor)??E.backgroundColor;J&&J!=="transparent"&&(e.fillStyle=J,e.fillRect(0,n,t,S)),e.strokeStyle=l.tickColor+"44",e.lineWidth=.5,e.beginPath(),e.moveTo(0,A),e.lineTo(t,A),e.stroke();for(const P of L.items){const p=te(L,P,l);if(P.interval){const re=H.JulianDate.toDate(P.interval.start).getTime(),Y=H.JulianDate.toDate(P.interval.stop).getTime(),W=y(re),$=y(Y),le=Math.max(0,W),ae=Math.min(t,$)-le;if(ae>0){e.globalAlpha=p.opacity,e.fillStyle=p.color;const be=3,De=n+be,ye=S-be*2;e.fillRect(le,De,ae,ye),p.borderWidth>0&&(e.strokeStyle=p.borderColor,e.lineWidth=p.borderWidth,e.strokeRect(le,De,ae,ye)),e.globalAlpha=1}}if(P.instant){const re=H.JulianDate.toDate(P.instant).getTime(),Y=y(re);if(Y>=-p.markerSize&&Y<=t+p.markerSize){const W=n+S/2,$=p.markerSize;e.globalAlpha=p.opacity,e.fillStyle=p.color,p.markerShape==="diamond"?(e.beginPath(),e.moveTo(Y,W-$/2),e.lineTo(Y+$/2,W),e.lineTo(Y,W+$/2),e.lineTo(Y-$/2,W),e.closePath(),e.fill()):p.markerShape==="circle"?(e.beginPath(),e.arc(Y,W,$/2,0,Math.PI*2),e.fill()):(e.strokeStyle=p.color,e.lineWidth=2,e.beginPath(),e.moveTo(Y,n+2),e.lineTo(Y,n+S-2),e.stroke()),e.globalAlpha=1}}}e.font=`${Math.min(11,S-4)}px system-ui, sans-serif`,e.textAlign="left",e.textBaseline="middle",e.fillStyle=(h==null?void 0:h.labelColor)??E.labelColor,e.fillText(L.label,Me,n+S/2)}if(n+=S+R,n>=D)break}if(g&&g.dragging){const L=g.currentY-g.dragStartY;let S=-f;for(let h=0;h<m.length&&h<g.insertIndex;h++)S+=(m[h].height??w)+R;e.strokeStyle=l.indicatorColor,e.lineWidth=2,e.beginPath(),e.moveTo(0,S),e.lineTo(t,S),e.stroke();const A=m.find(h=>h.id===g.dragLaneId);if(A){const h=A.height??w;let J=-f;for(const P of m){if(P.id===g.dragLaneId)break;J+=(P.height??w)+R}e.globalAlpha=.4,e.fillStyle=l.indicatorColor,e.fillRect(0,J+L,t,h),e.globalAlpha=1}}if(k>D){const L=t-K-2,S=D/k,A=Math.max(20,D*S),h=f/F*(D-A);e.fillStyle=l.tickColor+"22",e.fillRect(L,0,K,D),e.fillStyle=l.tickColor+"88",e.fillRect(L,h,K,A)}e.restore()}e.font=`${l.fontSize}px monospace`;const j=ee(i+u*500,u),U=e.measureText(j).width+24,oe=Math.max(U/t*u,u/1e3);let N=d[d.length-1],G=d.length-1;for(let n=0;n<d.length;n++)if(d[n]>oe){N=d[n],G=n;break}if(M!=null&&M>0)for(;G<d.length-1&&u/N>M;)G++,N=d[G];let O=0;for(let n=G-1;n>=0;n--)if(N%d[n]<1e-4){t*(d[n]/u)>=3&&(O=d[n]);break}let v=0;if(O>0){for(let n=0;n<d.length&&d[n]<O;n++)if(O%d[n]<1e-4&&t*(d[n]/u)>=3){v=d[n];break}}const de=he(i,u),X=(i-de)/1e3,ne=X+u,ie=n=>t*((n-X)/u);if(v>0){e.strokeStyle=l.tickColor,e.lineWidth=1;for(let n=Math.floor(X/v)*v;n<=ne;n=V(n,v)){const y=ie(n);e.beginPath(),e.moveTo(y,o-l.minorTickHeight),e.lineTo(y,o),e.stroke()}}if(O>0){e.strokeStyle=l.tickColor,e.lineWidth=1;for(let n=Math.floor(X/O)*O;n<=ne;n=V(n,O)){const y=ie(n);e.beginPath(),e.moveTo(y,o-l.minorTickHeight),e.lineTo(y,o),e.stroke()}}e.textAlign="center",e.textBaseline="bottom";let Se=-1/0;for(let n=Math.floor(X/N)*N;n<=ne+N;n=V(n,N)){const y=ie(n),L=de+n*1e3;e.strokeStyle=l.majorTickColor,e.lineWidth=1,e.beginPath(),e.moveTo(y,o-l.majorTickHeight),e.lineTo(y,o),e.stroke();const S=ee(L,u),A=e.measureText(S).width,h=y-A/2;h>Se&&(e.fillStyle=l.labelColor,e.fillText(S,y,o-l.majorTickHeight-4),Se=h+A+5)}const Te=(c-i)/(s-i)*t;return e.strokeStyle=l.indicatorColor,e.lineWidth=l.indicatorLineWidth,e.beginPath(),e.moveTo(Te,0),e.lineTo(Te,o),e.stroke(),f}r.DEFAULT_LANE_HEIGHT=w,r.DateTimeFormats=x,r.LABEL_PAD_LEFT=Me,r.LANE_GAP=R,r.MAX_SPAN_MS=ue,r.MIN_SPAN_MS=fe,r.MONTHS=q,r.SCROLLBAR_WIDTH=K,r.SWIM_LANE_SCROLL_SPEED=Pe,r.TICK_AREA_HEIGHT=z,r.TIC_SCALES=d,r.TickInterval=Q,r.calcEpochMs=he,r.clampSpan=ge,r.defaultSwimLaneStyle=E,r.defaultTheme=He,r.drawTimeline=Fe,r.formatDateTime=ce,r.formatTime=Ye,r.fromMilliseconds=pe,r.generateTicks=we,r.getDurationMs=se,r.hitTestLaneLabel=We,r.hitTestSwimLane=Oe,r.isInSwimLaneRegion=$e,r.makeLabel=ee,r.nextTic=V,r.positionToTime=Ee,r.resolveItemStyle=te,r.snapToTick=Ie,r.splitForDisplay=_e,r.timeToPosition=me,r.toDate=Z,r.toJulianDate=ke,r.toMilliseconds=I,r.totalSwimLaneHeight=Ne,r.twoD=C,r.zoomRange=Re,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})}));

package/dist/index.d.ts

@@ -0,0 +1,429 @@
+import * as Cesium from 'cesium';
+
+/** Pick a round epoch near startMs so tick offsets are clean integers (mirrors Cesium). */
+export declare function calcEpochMs(startMs: number, durationSec: number): number;
+
+/** Clamp a time span to the allowed zoom range. */
+export declare function clampSpan(span: number): number;
+
+/**
+ * Framework-agnostic base props for the transport controls.
+ */
+export declare interface ControlsBaseProps {
+    /** The current time displayed in the control bar (ms since epoch). */
+    currentTimeMs: number;
+    /** Whether playback is currently active. */
+    isPlaying: boolean;
+    /** Current playback speed multiplier (negative = rewind). */
+    multiplier: number;
+    /** @see TimelineBaseProps.dateTimeFormat */
+    dateTimeFormat?: string;
+    /** @see TimelineBaseProps.onDateTimeClick */
+    onDateTimeClick?: () => void;
+    /** Toggle play / pause. */
+    onPlayPause: (isPlaying: boolean) => void;
+    /** Jump to the start of the timeline range. */
+    onJumpToStart: () => void;
+    /** Step to the next rewind speed. */
+    onRewind: () => void;
+    /** Step to the next fast-forward speed. */
+    onFastForward: () => void;
+    /** Jump to the end of the timeline range. */
+    onJumpToEnd: () => void;
+    /** Jump to the current wall-clock time and resume 1× playback. */
+    onJumpToLive: () => void;
+    /** Reset the playback speed to 1×. */
+    onResetSpeed: () => void;
+    /** Whether the needle is near the current wall-clock time (within 10 s). */
+    isLive: boolean;
+    /** Whether to show the ⏮ jump-to-start button (true when startTime prop was provided). */
+    hasStartTime: boolean;
+    /** Whether to show the ⏭ jump-to-end button (true when endTime prop was provided). */
+    hasEndTime: boolean;
+    /** Resolved theme object applied to control bar elements. */
+    theme: TimelineTheme;
+    /** Whether swim lanes are currently visible. When defined, the chevron toggle is rendered. */
+    swimLanesVisible?: boolean;
+    /** Toggle callback for the swim-lane chevron button. */
+    onToggleSwimLanes?: () => void;
+}
+
+/** Built-in format presets. Pass one of these (or any custom string) as `dateTimeFormat`. */
+export declare const DateTimeFormats: {
+    /** e.g. "Feb 24 2026 14:04:07" — default */
+    readonly DEFAULT: "MMM DD YYYY HH:mm:ss";
+    /** e.g. "Feb 24 2026 02:04:07 PM" */
+    readonly TWELVE_HR: "MMM DD YYYY hh:mm:ss A";
+    /** e.g. "2026-02-24 14:04:07" */
+    readonly ISO: "YYYY-MM-DD HH:mm:ss";
+    /** e.g. "02/24/2026 14:04" */
+    readonly US: "MM/DD/YYYY HH:mm";
+    /** e.g. "24/02/2026 14:04" */
+    readonly EU: "DD/MM/YYYY HH:mm";
+    /** e.g. "14:04:07" */
+    readonly TIME_ONLY: "HH:mm:ss";
+    /** e.g. "02:04:07 PM" */
+    readonly TIME_12: "hh:mm:ss A";
+};
+
+export declare const DEFAULT_LANE_HEIGHT = 24;
+
+export declare const defaultSwimLaneStyle: SwimLaneStyle;
+
+export declare const defaultTheme: TimelineTheme;
+
+/**
+ * Render the entire timeline onto a 2D canvas context.
+ *
+ * This is a pure rendering function — it reads from `state` and writes pixels
+ * to `ctx`. It does NOT modify `state` (except returning clamped scrollTop
+ * if the caller wants to update it).
+ *
+ * @param ctx    The 2D rendering context (already DPR-scaled by the caller).
+ * @param w      CSS-pixel width of the canvas.
+ * @param h      CSS-pixel height of the canvas.
+ * @param state  The current render state.
+ * @returns The clamped scrollTop value (caller should update their state if different).
+ */
+export declare function drawTimeline(ctx: CanvasRenderingContext2D, w: number, h: number, state: TimelineRenderState): number;
+
+/**
+ * Format a date using a token-based format string.
+ *
+ * Supported tokens (longest-first to avoid partial matches):
+ *  YYYY  – 4-digit year                 e.g. 2026
+ *  YY    – 2-digit year                 e.g. 26
+ *  MMMM  – full month name              e.g. February
+ *  MMM   – abbreviated month name       e.g. Feb
+ *  MM    – zero-padded month number     e.g. 02
+ *  M     – month number                 e.g. 2
+ *  DD    – zero-padded day              e.g. 05
+ *  D     – day                          e.g. 5
+ *  HH    – 24-hour, zero-padded         e.g. 14
+ *  H     – 24-hour                      e.g. 14
+ *  hh    – 12-hour, zero-padded         e.g. 02
+ *  h     – 12-hour                      e.g. 2
+ *  mm    – minutes, zero-padded         e.g. 04
+ *  ss    – seconds, zero-padded         e.g. 07
+ *  SSS   – milliseconds, zero-padded    e.g. 042
+ *  A     – AM / PM uppercase
+ *  a     – am / pm lowercase
+ */
+export declare function formatDateTime(date: Cesium.JulianDate | Date, format?: string): string;
+
+/** @deprecated Use formatDateTime instead */
+export declare function formatTime(date: Cesium.JulianDate | Date, includeSeconds?: boolean): string;
+
+export declare function fromMilliseconds(ms: number): Cesium.JulianDate;
+
+export declare function generateTicks(startTime: Cesium.JulianDate | Date, endTime: Cesium.JulianDate | Date, tickInterval: TickInterval | number, width: number): Tick[];
+
+export declare function getDurationMs(startTime: Cesium.JulianDate | Date, endTime: Cesium.JulianDate | Date): number;
+
+/** Check if a Y coordinate is in the swim lane label area (leftmost ~80px). */
+export declare function hitTestLaneLabel(canvasX: number, canvasY: number, canvasH: number, state: Pick<TimelineRenderState, 'swimLanes' | 'showSwimLanes' | 'scrollTop'>): SwimLane | null;
+
+/**
+ * Given canvas-local coordinates, find which swim lane item (if any) is under the point.
+ */
+export declare function hitTestSwimLane(canvasX: number, canvasY: number, canvasW: number, canvasH: number, state: Pick<TimelineRenderState, 'swimLanes' | 'showSwimLanes' | 'scrollTop' | 'startMs' | 'endMs' | 'theme'>): SwimLaneHitResult | null;
+
+/** Check if Y is in the swim lane region (above tick area). */
+export declare function isInSwimLaneRegion(canvasY: number, canvasH: number, state: Pick<TimelineRenderState, 'swimLanes' | 'showSwimLanes'>): boolean;
+
+/** Left padding in pixels for lane labels. */
+export declare const LABEL_PAD_LEFT = 6;
+
+/** Gap in pixels between swim lane rows. */
+export declare const LANE_GAP = 1;
+
+export declare function makeLabel(ms: number, durationSec: number): string;
+
+/** Maximum visible span: ~1 000 years — stays within TIC_SCALES range. */
+export declare const MAX_SPAN_MS = 31536000000000;
+
+/** Minimum visible span: 1 second — prevents sub-ms span / blank canvas. */
+export declare const MIN_SPAN_MS = 1000;
+
+/** Abbreviated month names used for tick labels. */
+export declare const MONTHS: string[];
+
+/** Advance to next tick boundary (identical to Cesium's getNextTic). */
+export declare function nextTic(t: number, scale: number): number;
+
+export declare function positionToTime(x: number, startTime: Cesium.JulianDate | Date, endTime: Cesium.JulianDate | Date, width: number): Cesium.JulianDate;
+
+/** Drag-to-reorder visual state. */
+export declare interface ReorderState {
+    dragging: boolean;
+    dragLaneId: string;
+    dragStartY: number;
+    currentY: number;
+    insertIndex: number;
+}
+
+/** Resolve the effective style for a swim lane item (item → lane → theme → defaults). */
+export declare function resolveItemStyle(lane: SwimLane, item: SwimLaneItem, theme?: TimelineTheme): SwimLaneItemStyle;
+
+/** Width in pixels for the thin scrollbar track. */
+export declare const SCROLLBAR_WIDTH = 6;
+
+export declare function snapToTick(x: number, ticks: Tick[], snapDistance?: number): number;
+
+/**
+ * Split a format string into separate time and date parts for two-line display.
+ * Strips date tokens to derive the time format, and time tokens to derive the date format.
+ * Returns empty string for either part if no relevant tokens exist in the format.
+ */
+export declare function splitForDisplay(format?: string): {
+    timeFormat: string;
+    dateFormat: string;
+};
+
+/** Multiplier applied to wheel deltaY for swim lane vertical scrolling.
+ *  Keeps scrolling smooth when the overflow range is small. */
+export declare const SWIM_LANE_SCROLL_SPEED = 0.3;
+
+export declare interface SwimLane {
+    id: string;
+    label: string;
+    items: SwimLaneItem[];
+    /** Lane-level default style applied to all items unless overridden per-item. */
+    style?: Partial<SwimLaneStyle>;
+    /** Height of this lane row in pixels. @default 24 */
+    height?: number;
+}
+
+export declare interface SwimLaneEventInfo {
+    laneId: string;
+    item: SwimLaneItem;
+    originalEvent: MouseEvent;
+}
+
+/** Hit-test result for swim lane items. */
+export declare interface SwimLaneHitResult {
+    lane: SwimLane;
+    item: SwimLaneItem;
+}
+
+export declare interface SwimLaneItem {
+    id: string;
+    /** Provide a TimeInterval for a range (bar). */
+    interval?: Cesium.TimeInterval;
+    /** Provide a JulianDate for a point-in-time (marker). */
+    instant?: Cesium.JulianDate;
+    /** Per-item style overrides. */
+    style?: Partial<SwimLaneItemStyle>;
+    /** Arbitrary user data attached to this item. */
+    data?: unknown;
+}
+
+export declare interface SwimLaneItemStyle {
+    /** Fill color for interval bars / instant markers. */
+    color: string;
+    /** Border color for interval bars. */
+    borderColor: string;
+    /** Border width in pixels. */
+    borderWidth: number;
+    /** Opacity (0–1). */
+    opacity: number;
+    /** Shape used to render instants. */
+    markerShape: 'diamond' | 'circle' | 'line';
+    /** Size in pixels for instant markers. */
+    markerSize: number;
+}
+
+export declare interface SwimLaneStyle extends SwimLaneItemStyle {
+    /** Color of the lane label text. */
+    labelColor: string;
+    /** Background color of the lane row. */
+    backgroundColor: string;
+}
+
+/**
+ * Cesium-derived tick scale table (in seconds).
+ * Used to pick appropriate major / sub / tiny tick intervals.
+ */
+export declare const TIC_SCALES: number[];
+
+export declare interface Tick {
+    position: number;
+    isMajor: boolean;
+    label?: string;
+}
+
+/** Fixed height in pixels for the tick + label area at the bottom of the canvas. */
+export declare const TICK_AREA_HEIGHT = 36;
+
+export declare enum TickInterval {
+    FIFTEEN_MIN = 15,
+    THIRTY_MIN = 30,
+    HOURLY = 60,
+    CUSTOM = -1
+}
+
+/**
+ * Framework-agnostic base props for the timeline component.
+ * Framework wrappers (React, Angular) extend or adapt this interface.
+ */
+export declare interface TimelineBaseProps {
+    /** The start boundary of the timeline range. Defaults to 12 hours before now. */
+    startTime?: Cesium.JulianDate | Date;
+    /** The end boundary of the timeline range. Defaults to 12 hours after now. */
+    endTime?: Cesium.JulianDate | Date;
+    /** Initial current-time position of the needle. Defaults to `startTime` or now. */
+    currentTime?: Cesium.JulianDate | Date;
+    /** Cesium Clock instance to synchronize with. When provided the timeline follows the clock's tick. */
+    clock?: Cesium.Clock;
+    /** Fired whenever the current time changes (scrub, playback, or programmatic jump). */
+    onTimeChange?: (time: Cesium.JulianDate) => void;
+    /** Fired when playback is toggled. Receives the new playing state. */
+    onPlayPause?: (isPlaying: boolean) => void;
+    /** Fired when the playback speed multiplier changes (fast-forward / rewind). */
+    onMultiplierChange?: (multiplier: number) => void;
+    /**
+     * Explicit height in pixels. When omitted the timeline fills its container
+     * (the outer div uses `height: 100%`). When provided, a fixed pixel height
+     * is applied instead.
+     */
+    height?: number;
+    /** Tick interval override. When omitted the timeline auto-selects an appropriate scale. */
+    tickInterval?: TickInterval | number;
+    /** Whether to render tick labels on the time axis. @default true */
+    showLabels?: boolean;
+    /** Whether to render the transport control bar above the canvas. @default true */
+    showControls?: boolean;
+    /** When `true`, ticks snap to round time boundaries during scrub. */
+    snapToTicks?: boolean;
+    /** Whether the user can scrub / drag the timeline. @default true */
+    enableDrag?: boolean;
+    /**
+     * Format string for the time display in the control bar.
+     * Tokens: YYYY YY MMMM MMM MM M DD D HH H hh h mm ss SSS A a
+     * Presets available via the exported `DateTimeFormats` object.
+     * @default 'MMM DD YYYY HH:mm:ss'
+     */
+    dateTimeFormat?: string;
+    /**
+     * Called when the user clicks the datetime display in the control bar.
+     * Use this to open your own date/time picker.
+     */
+    onDateTimeClick?: () => void;
+    /**
+     * Set this to a new Date or JulianDate to programmatically jump the timeline
+     * to that moment (pans the canvas and updates current time).
+     */
+    jumpToTime?: Cesium.JulianDate | Date;
+    /**
+     * Maximum number of major ticks to render on the canvas at one time.
+     * When the computed tick count would exceed this value the tick scale is
+     * coarsened until it fits. Defaults to unlimited.
+     */
+    maxTicks?: number;
+    /**
+     * Speed steps cycled by the fast-forward button.
+     * Each click advances to the next entry; the last entry wraps back to the
+     * first. Defaults to [2, 4, 8, 16, 32, 1].
+     */
+    ffSpeeds?: number[];
+    /**
+     * Absolute-value speed steps cycled by the rewind button (negated internally).
+     * Defaults to [1, 2, 4, 8, 16, 32].
+     */
+    rwSpeeds?: number[];
+    /** Partial theme overrides merged with the default theme. */
+    theme?: Partial<TimelineTheme>;
+    /**
+     * Swim lane definitions. Each lane is a labeled row rendered inside the
+     * timeline canvas showing time intervals (bars) and/or instants (markers).
+     */
+    swimLanes?: SwimLane[];
+    /**
+     * Whether to show swim lanes. Defaults to `true` when `swimLanes` is provided.
+     * When `swimLanes` is provided, a chevron toggle button in the control bar
+     * lets the user expand / collapse the lanes at runtime.
+     */
+    showSwimLanes?: boolean;
+    /**
+     * Fired when the built-in swim-lane toggle button is clicked.
+     * Receives the new visibility value. Use this to keep external state in sync.
+     */
+    onShowSwimLanesChange?: (visible: boolean) => void;
+    /**
+     * Transition used when the timeline expands / collapses swim lanes.
+     * `'animated'` applies a smooth CSS transition (default).
+     * `'instant'` switches height immediately with no animation.
+     */
+    swimLaneTransition?: 'animated' | 'instant';
+    /** Fired when the user clicks a swim lane item. */
+    onSwimLaneItemClick?: (info: SwimLaneEventInfo) => void;
+    /** Fired when the user hovers over (or leaves) a swim lane item. `null` = left. */
+    onSwimLaneItemHover?: (info: SwimLaneEventInfo | null) => void;
+    /** Fired when the user double-clicks a swim lane item. */
+    onSwimLaneItemDoubleClick?: (info: SwimLaneEventInfo) => void;
+    /** Fired when the user right-clicks a swim lane item. */
+    onSwimLaneItemContextMenu?: (info: SwimLaneEventInfo) => void;
+    /** Fired when swim lanes are reordered via drag. Returns the new ordered lane IDs. */
+    onSwimLaneReorder?: (orderedLaneIds: string[]) => void;
+}
+
+/** Mutable state the engine reads during a draw call. */
+export declare interface TimelineRenderState {
+    startMs: number;
+    endMs: number;
+    currentMs: number;
+    theme: TimelineTheme;
+    maxTicks?: number;
+    swimLanes: SwimLane[];
+    showSwimLanes: boolean;
+    scrollTop: number;
+    reorderState: ReorderState | null;
+}
+
+export declare interface TimelineTheme {
+    backgroundColor: string;
+    tickColor: string;
+    majorTickColor: string;
+    labelColor: string;
+    indicatorColor: string;
+    indicatorLineWidth: number;
+    majorTickHeight: number;
+    minorTickHeight: number;
+    fontSize: number;
+    controlBarBackground: string;
+    controlBarBorder: string;
+    buttonColor: string;
+    buttonHoverColor: string;
+    /** Highlight color for active FF/RW buttons. Defaults to indicatorColor. */
+    buttonActiveColor: string;
+    /** Default border color for swim lane items. */
+    swimLaneItemBorderColor: string;
+    /** Default border width for swim lane items (px). Set to 0 to remove borders. */
+    swimLaneItemBorderWidth: number;
+}
+
+export declare interface TimePosition {
+    x: number;
+    time: Cesium.JulianDate;
+}
+
+export declare function timeToPosition(time: Cesium.JulianDate | Date, startTime: Cesium.JulianDate | Date, endTime: Cesium.JulianDate | Date, width: number): number;
+
+export declare function toDate(date: Cesium.JulianDate | Date): Date;
+
+export declare function toJulianDate(date: Cesium.JulianDate | Date): Cesium.JulianDate;
+
+export declare function toMilliseconds(date: Cesium.JulianDate | Date): number;
+
+/** Compute the total content height of all swim lanes. */
+export declare function totalSwimLaneHeight(lanes: SwimLane[]): number;
+
+export declare function twoD(n: number): string;
+
+/** Compute a new visible range after zooming by `amount` around the center. */
+export declare function zoomRange(startMs: number, endMs: number, amount: number): {
+    startMs: number;
+    endMs: number;
+};
+
+export { }

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@kteneyck/cesium-timeline-core",
+  "version": "0.1.0",
+  "description": "Framework-agnostic core logic for the Cesium timeline component",
+  "license": "MIT",
+  "author": "kteneyck",
+  "keywords": ["cesium", "timeline", "cesiumjs", "gis", "3d", "geospatial"],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Hive-Space/cesium-timeline.git",
+    "directory": "packages/core"
+  },
+  "homepage": "https://github.com/Hive-Space/cesium-timeline#readme",
+  "bugs": {
+    "url": "https://github.com/Hive-Space/cesium-timeline/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "main": "./dist/cesium-timeline-core.umd.cjs",
+  "module": "./dist/cesium-timeline-core.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/cesium-timeline-core.js",
+      "require": "./dist/cesium-timeline-core.umd.cjs",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "vite build",
+    "test": "vitest"
+  },
+  "peerDependencies": {
+    "cesium": "^1.100.0"
+  },
+  "devDependencies": {
+    "cesium": "^1.100.0",
+    "typescript": "^5.9.0",
+    "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.0.0",
+    "vitest": "^4.0.0"
+  }
+}