@canplot/react 0.5.8 → 0.5.10

package/dist/canplot.mjs

@@ -1,30 +1,30 @@
 var Be = Object.defineProperty;
 var ze = (e, t, n) => t in e ? Be(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
-var O = (e, t, n) => ze(e, typeof t != "symbol" ? t + "" : t, n);
+var K = (e, t, n) => ze(e, typeof t != "symbol" ? t + "" : t, n);
 import { jsxs as pe, jsx as R, Fragment as Ne } from "react/jsx-runtime";
-import D, { version as $e, createContext as ye, forwardRef as je, useRef as k, useState as B, useMemo as Z, useLayoutEffect as $, useCallback as Ve, useContext as q, useEffect as ke, useId as He } from "react";
-const ie = (e, t, n) => Math.min(Math.max(e, t), n), kt = (e) => e.reduce((t, n) => t + (n ?? 0), 0), Rt = (e, t) => {
+import D, { version as $e, createContext as ye, forwardRef as je, useRef as k, useState as B, useMemo as Q, useLayoutEffect as $, useCallback as He, useContext as G, useEffect as ke, useId as Ve } from "react";
+const re = (e, t, n) => Math.min(Math.max(e, t), n), kt = (e) => e.reduce((t, n) => t + (n ?? 0), 0), Rt = (e, t) => {
   let n = 0;
   for (let s = 0; s < e.length; s++)
     Math.abs(e[s] - t) < Math.abs(e[n] - t) && (n = s);
   return n;
 }, We = (e, t, n, s) => {
-  const o = X(e, n);
+  const o = F(e, n);
   if (!o)
     return null;
   const i = s === "canvas" ? e.chartAreaCanvasPX : e.chartAreaCSS, r = (o.origin === "x" ? i.width : i.height) / (o.max - o.min);
   return t / r;
-}, X = (e, t) => e.scales.find((n) => n.id === t) ?? null, U = (e, t) => {
+}, F = (e, t) => e.scales.find((n) => n.id === t) ?? null, U = (e, t) => {
   const n = window.devicePixelRatio || 1;
   e.lineCap = t?.lineCap ?? "butt", e.lineDashOffset = n * (t?.lineDashOffset ?? 0), e.lineJoin = t?.lineJoin ?? "miter", e.lineWidth = n * (t?.lineWidth ?? 1), e.miterLimit = n * (t?.miterLimit ?? 10), e.strokeStyle = t?.strokeStyle ?? "black", e.fillStyle = t?.fillStyle ?? e.strokeStyle, e.font = t?.font ?? `${10 * n}px sans-serif`, e.textAlign = t?.textAlign ?? "start", e.direction = t?.direction ?? "inherit", e.textBaseline = t?.textBaseline ?? "alphabetic", e.fontKerning = t?.fontKerning ?? "auto";
 }, ge = (e, t, n, s) => {
-  const o = s === "canvas" ? e.chartAreaCanvasPX : e.chartAreaCSS, i = X(e, n);
+  const o = s === "canvas" ? e.chartAreaCanvasPX : e.chartAreaCSS, i = F(e, n);
   if (!i)
     return null;
   const r = (i.origin === "x" ? o.width : o.height) / (i.max - i.min);
   return t * r;
-}, G = (e, t, n, s) => {
-  const o = X(e, n);
+}, Z = (e, t, n, s) => {
+  const o = F(e, n);
   if (!o)
     return null;
   const i = s === "canvas" ? e.chartAreaCanvasPX : e.chartAreaCSS, r = ge(
@@ -33,11 +33,11 @@ const ie = (e, t, n) => Math.min(Math.max(e, t), n), kt = (e) => e.reduce((t, n)
     n,
     s
   );
-  return r === null ? null : o.origin === "x" ? ie(
+  return r === null ? null : o.origin === "x" ? re(
     i.x + r,
     i.x - 10 * i.width,
     i.x + 11 * i.width
-  ) : ie(
+  ) : re(
     i.y + i.height - r,
     i.y - 10 * i.height,
     i.y + 11 * i.height
@@ -46,36 +46,36 @@ const ie = (e, t, n) => Math.min(Math.max(e, t), n), kt = (e) => e.reduce((t, n)
   if (t === null)
     return null;
   const s = n === "canvas" ? e.chartAreaCanvasPX : e.chartAreaCSS;
-  return ie(t, s.x, s.x + s.width);
-}, H = (e, t, n) => {
+  return re(t, s.x, s.x + s.width);
+}, W = (e, t, n) => {
   if (t === null)
     return null;
   const s = n === "canvas" ? e.chartAreaCanvasPX : e.chartAreaCSS;
-  return ie(t, s.y, s.y + s.height);
-}, fe = (e, t, n) => {
+  return re(t, s.y, s.y + s.height);
+}, de = (e, t, n) => {
   if (t === null)
     return !1;
-  const s = X(e, n);
+  const s = F(e, n);
   return s ? t >= s.min && t <= s.max : !1;
-}, _ = (e, t, n, s) => {
-  const o = X(e, n);
+}, X = (e, t, n, s) => {
+  const o = F(e, n);
   if (!o)
     return null;
   const i = s === "canvas" ? e.chartAreaCanvasPX : e.chartAreaCSS, r = o.origin === "x" ? (t - i.x) / i.width : (i.height - t + i.y) / i.height;
   return o.min + r * (o.max - o.min);
-}, F = (e, t) => {
+}, O = (e, t) => {
   if (e === t) return !0;
   if (e == null || t == null || typeof e != typeof t || typeof e != "object" || Array.isArray(e) !== Array.isArray(t)) return !1;
   if (Array.isArray(e) && Array.isArray(t)) {
     if (e.length !== t.length) return !1;
     for (let o = 0; o < e.length; o++)
-      if (!F(e[o], t[o])) return !1;
+      if (!O(e[o], t[o])) return !1;
     return !0;
   }
   const n = Object.keys(e), s = Object.keys(t);
   if (n.length !== s.length) return !1;
   for (const o of n)
-    if (!Object.prototype.hasOwnProperty.call(t, o) || !F(e[o], t[o])) return !1;
+    if (!Object.prototype.hasOwnProperty.call(t, o) || !O(e[o], t[o])) return !1;
   return !0;
 }, qe = (e) => {
   const { ctx: t, scales: n } = e;
@@ -107,7 +107,7 @@ function Ge(e) {
     for (const n of e) me(n, t);
   };
 }
-function Ze(e) {
+function Je(e) {
   return (t) => {
     const n = [];
     for (const s of e) {
@@ -124,7 +124,7 @@ function me(e, t) {
     return e(t);
   e && (e.current = t);
 }
-var Je = parseInt($e.split(".")[0], 10) >= 19 ? Ze : Ge;
+var Ze = parseInt($e.split(".")[0], 10) >= 19 ? Je : Ge;
 const Re = ye({
   listeners: [],
   subscribe: () => () => {
@@ -149,13 +149,13 @@ const Re = ye({
 };
 class Le {
   constructor() {
-    O(this, "_frame", null);
-    O(this, "clampXPosToChartArea", (t, n = "canvas") => V(this.frame, t, n));
-    O(this, "clampYPosToChartArea", (t, n = "canvas") => H(this.frame, t, n));
-    O(this, "valToPos", (t, n, s = "canvas") => G(this.frame, t, n, s));
-    O(this, "valToPxDistance", (t, n, s = "canvas") => ge(this.frame, t, n, s));
-    O(this, "valFits", (t, n) => fe(this.frame, t, n));
-    O(this, "getScale", (t) => X(this.frame, t));
+    K(this, "_frame", null);
+    K(this, "clampXPosToChartArea", (t, n = "canvas") => V(this.frame, t, n));
+    K(this, "clampYPosToChartArea", (t, n = "canvas") => W(this.frame, t, n));
+    K(this, "valToPos", (t, n, s = "canvas") => Z(this.frame, t, n, s));
+    K(this, "valToPxDistance", (t, n, s = "canvas") => ge(this.frame, t, n, s));
+    K(this, "valFits", (t, n) => de(this.frame, t, n));
+    K(this, "getScale", (t) => F(this.frame, t));
   }
   _updateFrame(t) {
     this._frame = t;
@@ -170,18 +170,18 @@ class Le {
   }
 }
 const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
-  const i = k(null), r = k(null), c = tt(r), [u, l] = B(null), p = Z(
+  const i = k(null), r = k(null), c = tt(r), [u, l] = B(null), p = Q(
     () => nt(e, c, u),
     [e, c, u]
   );
   $(() => {
     l(i.current?.getContext("2d") || null);
   }, [i]);
-  const d = window.devicePixelRatio || 1;
+  const f = window.devicePixelRatio || 1;
   return /* @__PURE__ */ pe(
     "div",
     {
-      ref: Je([o, r]),
+      ref: Ze([o, r]),
       style: {
         position: "relative",
         overflow: "hidden",
@@ -194,8 +194,8 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
           "canvas",
           {
             ref: i,
-            width: c.width * d,
-            height: c.height * d,
+            width: c.width * f,
+            height: c.height * f,
             style: {
               inset: 0,
               position: "absolute",
@@ -212,7 +212,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   frame: e,
   children: t
 }) => {
-  const n = Z(Qe, []), [s, o] = B(0);
+  const n = Q(Qe, []), [s, o] = B(0);
   $(() => {
     e?.ctx.clearRect(0, 0, e.ctx.canvas.width, e.ctx.canvas.height);
   }, [e, s]);
@@ -229,7 +229,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
       c && cancelAnimationFrame(c);
     };
   }, [s, e, n]);
-  const r = Ve(() => {
+  const r = He(() => {
     o((c) => c + 1);
   }, [o]);
   return /* @__PURE__ */ R(Re.Provider, { value: n, children: /* @__PURE__ */ R(De.Provider, { value: r, children: /* @__PURE__ */ R(ve.Provider, { value: e, children: t }) }) });
@@ -326,7 +326,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         case "bottom":
           throw new Error("Invalid axis position for y origin");
       }
-    const f = {
+    const d = {
       x: g.x * s,
       y: g.y * s,
       width: g.width * s,
@@ -337,7 +337,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
       axis: {
         ...a.axis,
         cssRect: g,
-        canvasRect: f
+        canvasRect: d
       }
     });
   }
@@ -350,7 +350,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
     chartAreaCanvasPX: i
   };
 }, j = (e, t, n) => {
-  const s = q(ve), o = q(De), i = q(Re);
+  const s = G(ve), o = G(De), i = G(Re);
   if (!s || !o)
     throw new Error("useFrame must be used within a CanPlot component");
   const [r] = B(() => new Le());
@@ -374,10 +374,10 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
     o();
   }, [o]);
 }, Ue = () => {
-  const e = q(ve);
+  const e = G(ve);
   if (!e)
     throw new Error("useFrame must be used within a CanPlot component");
-  return Z(() => {
+  return Q(() => {
     const t = new Le();
     return t._updateFrame(e), t;
   }, [e]);
@@ -386,13 +386,13 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   ({ ctx: r, clampXPosToChartArea: c, clampYPosToChartArea: u, valToPos: l }) => {
     r.save(), r.beginPath(), U(r, o), i !== void 0 && (r.globalAlpha = i);
     for (const p of t) {
-      const d = c(l(p.x, n, "canvas")), a = u(l(p.y, s, "canvas"));
-      d === null || a === null || r.lineTo(d, a);
+      const f = c(l(p.x, n, "canvas")), a = u(l(p.y, s, "canvas"));
+      f === null || a === null || r.lineTo(f, a);
     }
     r.stroke(), r.restore();
   },
   [t, n, s, o, i]
-), null), It = D.memo(st, F), ot = ({
+), null), It = D.memo(st, O), ot = ({
   layer: e = "MIDDLE",
   data: t,
   xScaleId: n,
@@ -407,44 +407,44 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   ({
     ctx: l,
     valToPos: p,
-    valFits: d,
+    valFits: f,
     clampXPosToChartArea: a,
     clampYPosToChartArea: g
   }) => {
     l.save(), U(l, c), u !== void 0 && (l.globalAlpha = u);
-    const f = [];
+    const d = [];
     for (const y of t) {
       let h = null, m = null;
-      const w = p(y.x, n);
-      if (w === null) continue;
+      const v = p(y.x, n);
+      if (v === null) continue;
       if (o === "clip") {
-        if (!d(y.x, n)) continue;
-        h = w;
+        if (!f(y.x, n)) continue;
+        h = v;
       } else
-        h = a(w, "canvas");
+        h = a(v, "canvas");
       const x = p(y.y, s);
       if (x !== null) {
         if (i === "clip") {
-          if (!d(y.y, s)) continue;
+          if (!f(y.y, s)) continue;
           m = x;
         } else
           m = g(x, "canvas");
-        h === null || m === null || f.push({ x: h, y: m });
+        h === null || m === null || d.push({ x: h, y: m });
       }
     }
     if (c?.fillStyle)
-      for (const y of f)
+      for (const y of d)
         l.beginPath(), l.arc(y.x, y.y, r, 0, Math.PI * 2), l.fill();
     if (c?.strokeStyle) {
       l.beginPath();
-      for (const y of f)
+      for (const y of d)
         l.moveTo(y.x + r, y.y), l.arc(y.x, y.y, r, 0, Math.PI * 2);
       l.stroke();
     }
     l.restore();
   },
   [t, n, s, r, c, u]
-), null), Lt = D.memo(ot, F), it = ({
+), null), Lt = D.memo(ot, O), it = ({
   data: e,
   xScaleId: t,
   yScaleId: n,
@@ -459,34 +459,34 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   ({
     ctx: l,
     valToPxDistance: p,
-    valToPos: d,
+    valToPos: f,
     clampXPosToChartArea: a,
     clampYPosToChartArea: g
   }) => {
     if (e.length === 0) return;
-    const f = g(
-      d(0, n, "canvas"),
+    const d = g(
+      f(0, n, "canvas"),
       "canvas"
     );
-    if (f === null)
+    if (d === null)
       return;
     const y = p(o, t, "canvas") ?? 0, h = [];
     for (const m of e) {
-      const w = d(m.x, t, "canvas");
-      if (w === null)
+      const v = f(m.x, t, "canvas");
+      if (v === null)
         continue;
-      const x = w - y / 2 + i * y, T = g(
-        d(m.y, n, "canvas"),
+      const x = v - y / 2 + i * y, T = g(
+        f(m.y, n, "canvas"),
         "canvas"
       );
       if (T === null)
         continue;
-      const v = f - T, b = a(x, "canvas"), S = a(x + y, "canvas") - b;
+      const w = d - T, b = a(x, "canvas"), S = a(x + y, "canvas") - b;
       h.push({
         x: b,
         y: T,
         width: S,
-        height: v
+        height: w
       });
     }
     if (l.save(), U(l, s), r !== void 0 && (l.globalAlpha = r), s?.fillStyle)
@@ -500,57 +500,57 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
     }
     l.restore();
   },
-  [e, t, n, s, o, i, c]
-), null), Ut = D.memo(it, F), rt = ({ layer: e = "MIDDLE", data: t, xScaleId: n, yScaleId: s, style: o }) => (j(
+  [e, t, n, s, o, i, c, r]
+), null), Ut = D.memo(it, O), rt = ({ layer: e = "MIDDLE", data: t, xScaleId: n, yScaleId: s, style: o }) => (j(
   e,
   ({ ctx: i, clampXPosToChartArea: r, clampYPosToChartArea: c, valToPos: u }) => {
     const l = [];
-    for (const d of t) {
-      const a = r(u(d.x, n));
+    for (const f of t) {
+      const a = r(u(f.x, n));
       if (a === null)
         continue;
-      const g = c(u(d.y[0], s));
+      const g = c(u(f.y[0], s));
       if (g === null)
         continue;
-      const f = c(u(d.y[1], s));
-      f !== null && (l.push({ x: a, y: g }), l.unshift({ x: a, y: f }));
+      const d = c(u(f.y[1], s));
+      d !== null && (l.push({ x: a, y: g }), l.unshift({ x: a, y: d }));
     }
     const p = l[0];
     if (p) {
       i.save(), i.beginPath(), U(i, o), i.moveTo(p.x, p.y);
-      for (const d of l)
-        i.lineTo(d.x, d.y);
+      for (const f of l)
+        i.lineTo(f.x, f.y);
       i.closePath(), i.fill(), i.restore();
     }
   },
   [t, n, s, o]
-), null), _t = D.memo(rt, F), ct = ({ layer: e = "MIDDLE", data: t, stroked: n, xScaleId: s, yScaleId: o, style: i }) => (j(
+), null), _t = D.memo(rt, O), ct = ({ layer: e = "MIDDLE", data: t, stroked: n, xScaleId: s, yScaleId: o, style: i }) => (j(
   e,
   ({ ctx: r, clampXPosToChartArea: c, clampYPosToChartArea: u, valToPos: l }) => {
     const p = [];
-    for (const f of t) {
-      const y = c(l(f.x, s)), h = u(l(f.y, o));
+    for (const d of t) {
+      const y = c(l(d.x, s)), h = u(l(d.y, o));
       y === null || h === null || p.push({ x: y, y: h });
     }
-    const d = p.at(0), a = p.at(-1);
-    if (!d || !a)
+    const f = p.at(0), a = p.at(-1);
+    if (!f || !a)
       return;
     const g = u(l(0, o));
     if (g !== null) {
-      r.save(), r.beginPath(), U(r, i), r.moveTo(d.x, g);
-      for (const f of p)
-        r.lineTo(f.x, f.y);
+      r.save(), r.beginPath(), U(r, i), r.moveTo(f.x, g);
+      for (const d of p)
+        r.lineTo(d.x, d.y);
       if (r.lineTo(a.x, g), r.closePath(), r.fill(), n) {
-        r.beginPath(), r.moveTo(d.x, d.y);
-        for (const f of p)
-          r.lineTo(f.x, f.y);
+        r.beginPath(), r.moveTo(f.x, f.y);
+        for (const d of p)
+          r.lineTo(d.x, d.y);
         r.stroke();
       }
       r.restore();
     }
   },
   [t, n, s, o, i]
-), null), Xt = D.memo(ct, F), at = ({
+), null), Xt = D.memo(ct, O), at = ({
   layer: e = "BOTTOM",
   scaleId: t,
   tickStyle: n,
@@ -561,16 +561,16 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
 }) => (j(
   e,
   ({ ctx: c, valToPos: u, getScale: l, frame: p }) => {
-    const d = l(t);
-    if (!d || !d.axis || d.origin !== "x") return;
-    const a = d.axis, g = a.position === "top" ? a.canvasRect.y + a.canvasRect.height : a.canvasRect.y, f = window.devicePixelRatio || 1, y = g, h = (i ?? 6) * f, m = a.position === "top" ? g - h : g + h, w = (o ?? 12) * f;
+    const f = l(t);
+    if (!f || !f.axis || f.origin !== "x") return;
+    const a = f.axis, g = a.position === "top" ? a.canvasRect.y + a.canvasRect.height : a.canvasRect.y, d = window.devicePixelRatio || 1, y = g, h = (i ?? 6) * d, m = a.position === "top" ? g - h : g + h, v = (o ?? 12) * d;
     c.save(), c.fontKerning = "auto", U(c, {
       ...n
     }), c.beginPath();
-    const x = Array.isArray(r) ? r : r({ ...d, axis: a }, p);
+    const x = Array.isArray(r) ? r : r({ ...f, axis: a }, p);
     for (const { value: T } of x) {
-      const v = u(T, t, "canvas");
-      v !== null && (c.moveTo(v, y), c.lineTo(v, m));
+      const w = u(T, t, "canvas");
+      w !== null && (c.moveTo(w, y), c.lineTo(w, m));
     }
     c.stroke(), c.restore(), c.save(), U(c, {
       textBaseline: a.position === "top" ? "bottom" : "top",
@@ -580,19 +580,19 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
       // alter font size for DPR
       font: _e(s?.font ?? n?.font)
     });
-    for (const { value: T, label: v } of x) {
+    for (const { value: T, label: w } of x) {
       const b = u(T, t, "canvas");
       if (b === null)
         continue;
-      const S = v.split(`
+      const S = w.split(`
 `);
       for (let E = 0; E < S.length; E++)
-        c.fillText(S[E], b, m + f * 2 + E * w);
+        c.fillText(S[E], b, m + d * 2 + E * v);
     }
     c.restore();
   },
   [r, t, n, s]
-), null), Ft = D.memo(at, F), lt = ({
+), null), Ft = D.memo(at, O), lt = ({
   layer: e = "BOTTOM",
   scaleId: t,
   tickStyle: n,
@@ -603,13 +603,13 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
 }) => (j(
   e,
   ({ ctx: c, valToPos: u, getScale: l, frame: p }) => {
-    const d = l(t);
-    if (!d || !d.axis || d.origin !== "y") return;
-    const a = d.axis, g = a.position === "left" ? a.canvasRect.x + a.canvasRect.width : a.canvasRect.x, f = g, y = i ?? 6, h = a.position === "left" ? g - y : g + y, m = o ?? 12, w = Array.isArray(r) ? r : r({ ...d, axis: a }, p);
+    const f = l(t);
+    if (!f || !f.axis || f.origin !== "y") return;
+    const a = f.axis, g = a.position === "left" ? a.canvasRect.x + a.canvasRect.width : a.canvasRect.x, d = g, y = i ?? 6, h = a.position === "left" ? g - y : g + y, m = o ?? 12, v = Array.isArray(r) ? r : r({ ...f, axis: a }, p);
     c.save(), c.fontKerning = "auto", U(c, { ...n }), c.beginPath();
-    for (const { value: x } of w) {
+    for (const { value: x } of v) {
       const T = u(x, t, "canvas");
-      T !== null && (c.moveTo(f, T), c.lineTo(h, T));
+      T !== null && (c.moveTo(d, T), c.lineTo(h, T));
     }
     c.stroke(), c.restore(), c.save(), U(c, {
       textBaseline: "middle",
@@ -619,19 +619,19 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
       // alter font size for DPR
       font: _e(s?.font ?? n?.font)
     });
-    for (const { value: x, label: T } of w) {
-      const v = u(x, t, "canvas");
-      if (v === null)
+    for (const { value: x, label: T } of v) {
+      const w = u(x, t, "canvas");
+      if (w === null)
         continue;
       const b = T.split(`
 `);
       for (let S = 0; S < b.length; S++)
-        c.fillText(` ${b[S]} `, h, v + S * m);
+        c.fillText(` ${b[S]} `, h, w + S * m);
     }
     c.restore();
   },
   [r, t, n, s]
-), null), Ot = D.memo(lt, F), _e = (e) => {
+), null), Ot = D.memo(lt, O), _e = (e) => {
   if (e)
     try {
       return e.replace(/(\d+)px/, (t, n) => `${parseInt(n) * window.devicePixelRatio || 1}px`);
@@ -677,33 +677,33 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   return L(e, n, t);
 }, ut = (e, t, n, s, o) => {
   if (!t) return;
-  const i = s ?? n.scales.find((d) => d.origin === "x")?.id, r = o ?? n.scales.find((d) => d.origin === "y")?.id, c = e.clientX - t.left, u = i ? {
+  const i = s ?? n.scales.find((f) => f.origin === "x")?.id, r = o ?? n.scales.find((f) => f.origin === "y")?.id, c = e.clientX - t.left, u = i ? {
     scaleId: i,
-    value: _(n, c, i, "css")
+    value: X(n, c, i, "css")
   } : null, l = e.clientY - t.top, p = r ? {
     scaleId: r,
-    value: _(n, l, r, "css")
+    value: X(n, l, r, "css")
   } : null;
   return { pointerSyncPosition: { x: u, y: p }, cssX: c, cssY: l };
 }, N = (e, t) => {
-  const { x: n, y: s } = e, o = n && t.scales.some((r) => r.id === n.scaleId) ? G(t, n.value, n.scaleId, "css") : null, i = s && t.scales.some((r) => r.id === s.scaleId) ? G(t, s.value, s.scaleId, "css") : null;
+  const { x: n, y: s } = e, o = n && t.scales.some((r) => r.id === n.scaleId) ? Z(t, n.value, n.scaleId, "css") : null, i = s && t.scales.some((r) => r.id === s.scaleId) ? Z(t, s.value, s.scaleId, "css") : null;
   return {
     cssX: o,
     cssY: i,
     scaled: Object.fromEntries(
       t.scales.flatMap((r) => {
         const c = r.origin === "y" ? i : o;
-        return c === null ? [] : [[r.id, _(t, c, r.id, "css")]];
+        return c === null ? [] : [[r.id, X(t, c, r.id, "css")]];
       })
     )
   };
 }, Ee = (e, t, n) => {
-  const s = G(
+  const s = Z(
     n,
     t.from,
     t.scaleId,
     "css"
-  ), o = G(
+  ), o = Z(
     n,
     t.to,
     t.scaleId,
@@ -715,7 +715,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
     (r) => {
       if (r.origin !== e)
         return [];
-      const c = _(n, s, r.id, "css"), u = _(n, o, r.id, "css");
+      const c = X(n, s, r.id, "css"), u = X(n, o, r.id, "css");
       return c === null || u === null ? [] : [
         {
           scaleId: r.id,
@@ -742,35 +742,35 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   onContextMenu: u,
   className: l,
   style: p,
-  sync: d,
+  sync: f,
   innerChildren: a,
   children: g
 }) => {
-  const f = He();
-  return L("dblclick", f, (y) => {
+  const d = Ve();
+  return L("dblclick", d, (y) => {
     n?.(y);
-  }), L("click", f, (y) => {
+  }), L("click", d, (y) => {
     t?.(y);
-  }), L("move", f, (y) => {
+  }), L("move", d, (y) => {
     s?.(y);
-  }), L("mousedown", f, (y) => {
+  }), L("mousedown", d, (y) => {
     o?.(y);
-  }), L("mouseup", f, (y) => {
+  }), L("mouseup", d, (y) => {
     i?.(y);
-  }), L("documentmouseup", f, (y) => {
+  }), L("documentmouseup", d, (y) => {
     r?.(y);
-  }), L("spanselect", f, (y) => {
+  }), L("spanselect", d, (y) => {
     c?.(y);
-  }), L("contextmenu", f, (y) => {
+  }), L("contextmenu", d, (y) => {
     u?.(y);
-  }), /* @__PURE__ */ pe(we.Provider, { value: f, children: [
+  }), /* @__PURE__ */ pe(we.Provider, { value: d, children: [
     /* @__PURE__ */ R(
       ht,
       {
         id: e,
         className: l,
         style: p,
-        sync: d,
+        sync: f,
         children: a
       }
     ),
@@ -779,7 +779,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
 }, ht = ({ id: e, className: t, style: n, sync: s, children: o }) => {
   const i = k(null), r = Ue().frame, c = k(r);
   c.current = r;
-  const u = q(we), l = s?.key || u, p = k(null), d = k(null), a = k(null), g = () => {
+  const u = G(we), l = s?.key || u, p = k(null), f = k(null), a = k(null), g = () => {
     const h = i.current?.parentElement;
     if (h) {
       if (h.dataset.canplotroot === void 0)
@@ -788,17 +788,17 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         );
       return h.getBoundingClientRect();
     }
-  }, f = (h, m) => {
-    const w = ut(
+  }, d = (h, m) => {
+    const v = ut(
       h,
       g(),
       c.current,
       s?.xViaScaleId,
       s?.yViaScaleId
     );
-    w && m(
-      w.pointerSyncPosition,
-      { cssX: w.cssX, cssY: w.cssY },
+    v && m(
+      v.pointerSyncPosition,
+      { cssX: v.cssX, cssY: v.cssY },
       {
         ctrlKey: h.ctrlKey,
         altKey: h.altKey,
@@ -806,28 +806,28 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         metaKey: h.metaKey
       }
     );
-  }, y = k(f);
-  return y.current = f, ke(() => {
-    const h = (v) => {
-      const b = d.current;
+  }, y = k(d);
+  return y.current = d, ke(() => {
+    const h = (w) => {
+      const b = f.current;
       b && M.spanselect.dispatchEvent(u, {
         ...b,
         completed: !0
       }), M.documentmouseup.dispatchEvent(u, {
         frame: c.current,
         keys: {
-          ctrlKey: v.ctrlKey,
-          altKey: v.altKey,
-          shiftKey: v.shiftKey,
-          metaKey: v.metaKey
+          ctrlKey: w.ctrlKey,
+          altKey: w.altKey,
+          shiftKey: w.shiftKey,
+          metaKey: w.metaKey
         }
       });
-    }, m = (v) => {
+    }, m = (w) => {
       const b = {
-        ctrlKey: v.ctrlKey,
-        altKey: v.altKey,
-        shiftKey: v.shiftKey,
-        metaKey: v.metaKey
+        ctrlKey: w.ctrlKey,
+        altKey: w.altKey,
+        shiftKey: w.shiftKey,
+        metaKey: w.metaKey
       }, S = a.current;
       if (S && Object.entries(b).some(
         ([C, P]) => S.keys[C] !== P
@@ -835,120 +835,120 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         const C = { ...S, keys: b };
         a.current = C, M.sync_move.dispatchEvent(l, C);
       }
-      const E = d.current;
+      const E = f.current;
       if (E && Object.entries(b).some(
         ([C, P]) => E.keys[C] !== P
       )) {
-        v.stopPropagation(), v.preventDefault();
+        w.stopPropagation(), w.preventDefault();
         const C = { ...E, keys: b };
-        d.current = C, M.spanselect.dispatchEvent(u, C);
+        f.current = C, M.spanselect.dispatchEvent(u, C);
       }
-    }, w = (v) => {
+    }, v = (w) => {
       y.current(
-        v,
+        w,
         (b, { cssX: S, cssY: E }, C) => {
           const P = p.current;
           if (!P || !b.x || !b.y) return;
-          const A = c.current, z = P.xRangeCss.start, ae = S, le = P.yRangeCss.start, ue = E, J = X(A, b.x.scaleId);
-          if (!J) return;
-          const Q = X(A, b.y.scaleId);
-          if (!Q) return;
+          const A = c.current, z = P.xRangeCss.start, ae = S, le = P.yRangeCss.start, ue = E, ee = F(A, b.x.scaleId);
+          if (!ee) return;
+          const te = F(A, b.y.scaleId);
+          if (!te) return;
           p.current = {
             xRangeCss: { start: z, end: ae },
             yRangeCss: { start: le, end: ue }
           };
-          let W = "below_threshold";
-          const he = Math.abs(le - ue), de = Math.abs(z - ae);
-          he < 10 && de < 10 ? W = "below_threshold" : he > 30 && de > 30 ? W = "box" : he > de ? W = "y" : W = "x";
-          const Te = _(
+          let q = "below_threshold";
+          const he = Math.abs(le - ue), fe = Math.abs(z - ae);
+          he < 10 && fe < 10 ? q = "below_threshold" : he > 30 && fe > 30 ? q = "box" : he > fe ? q = "y" : q = "x";
+          const Te = X(
             A,
             V(c.current, z, "css"),
-            J.id,
+            ee.id,
             "css"
           );
           if (Te === null) return;
-          const Se = _(
+          const Se = X(
             A,
             V(c.current, ae, "css"),
-            J.id,
+            ee.id,
             "css"
           );
           if (Se === null) return;
-          const Ce = _(
+          const Ce = X(
             A,
-            H(c.current, le, "css"),
-            Q.id,
+            W(c.current, le, "css"),
+            te.id,
             "css"
           );
           if (Ce === null) return;
-          const Pe = _(
+          const Pe = X(
             A,
-            H(c.current, ue, "css"),
-            Q.id,
+            W(c.current, ue, "css"),
+            te.id,
             "css"
           );
           if (Pe === null) return;
-          const ee = Ee(
+          const ne = Ee(
             "x",
-            { scaleId: J.id, from: Te, to: Se },
+            { scaleId: ee.id, from: Te, to: Se },
             c.current
-          ), te = Ee(
+          ), se = Ee(
             "y",
-            { scaleId: Q.id, from: Ce, to: Pe },
+            { scaleId: te.id, from: Ce, to: Pe },
             c.current
-          ), Ke = ee?.scaled, Ye = te?.scaled, Me = {
-            mode: W,
+          ), Ke = ne?.scaled, Ye = se?.scaled, Me = {
+            mode: q,
             frame: c.current,
             completed: !1,
             x: {
-              css: ee ? {
-                from: ee.fromCSS,
-                to: ee.toCSS
+              css: ne ? {
+                from: ne.fromCSS,
+                to: ne.toCSS
               } : void 0,
               scaled: Ke ?? []
             },
             y: {
-              css: te ? {
-                from: te.fromCSS,
-                to: te.toCSS
+              css: se ? {
+                from: se.fromCSS,
+                to: se.toCSS
               } : void 0,
               scaled: Ye ?? []
             },
             keys: C
           };
-          d.current = Me, M.spanselect.dispatchEvent(
+          f.current = Me, M.spanselect.dispatchEvent(
             u,
             Me
           );
         }
       );
-    }, x = (v) => {
-      y.current(v, (b, S, E) => {
+    }, x = (w) => {
+      y.current(w, (b, S, E) => {
         const C = N(
           b,
           c.current
         );
         if (!C) return;
         if (Object.values(E).some((A) => A)) {
-          v.preventDefault();
-          const A = Math.abs(v.deltaY) > Math.abs(v.deltaX) ? v.deltaY : v.deltaX;
+          w.preventDefault();
+          const A = Math.abs(w.deltaY) > Math.abs(w.deltaX) ? w.deltaY : w.deltaX;
           M.pressandwheel.dispatchEvent(u, {
             pointer: C,
             frame: c.current,
             keys: E,
-            deltaX: v.deltaX,
-            deltaY: v.deltaY,
+            deltaX: w.deltaX,
+            deltaY: w.deltaY,
             deltaAbs: A
           });
         }
       });
     };
-    document.addEventListener("mouseup", h), document.addEventListener("keydown", m), document.addEventListener("keyup", m), document.addEventListener("mousemove", w);
+    document.addEventListener("mouseup", h), document.addEventListener("keydown", m), document.addEventListener("keyup", m), document.addEventListener("mousemove", v);
     const T = i.current;
     return T?.addEventListener("wheel", x, {
       passive: !1
     }), () => {
-      document.removeEventListener("mouseup", h), document.removeEventListener("keydown", m), document.removeEventListener("keyup", m), document.removeEventListener("mousemove", w), T?.removeEventListener("wheel", x);
+      document.removeEventListener("mouseup", h), document.removeEventListener("keydown", m), document.removeEventListener("keyup", m), document.removeEventListener("mousemove", v), T?.removeEventListener("wheel", x);
     };
   }, [c, u, l, y]), L("sync_move", l, (h) => {
     const m = h.positions ? N(
@@ -980,7 +980,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         h.preventDefault();
       },
       onClick: (h) => {
-        f(h, (m, w, x) => {
+        d(h, (m, v, x) => {
           const T = N(
             m,
             c.current
@@ -993,7 +993,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         });
       },
       onMouseLeave: (h) => {
-        f(h, (m, w, x) => {
+        d(h, (m, v, x) => {
           M.sync_move.dispatchEvent(l, {
             positions: null,
             keys: x,
@@ -1002,7 +1002,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         });
       },
       onMouseMove: (h) => {
-        f(h, (m, w, x) => {
+        d(h, (m, v, x) => {
           M.sync_move.dispatchEvent(l, {
             positions: m,
             keys: x,
@@ -1011,23 +1011,23 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         });
       },
       onMouseDown: (h) => {
-        f(h, (m, { cssX: w, cssY: x }, T) => {
-          const v = N(
+        d(h, (m, { cssX: v, cssY: x }, T) => {
+          const w = N(
             m,
             c.current
           );
-          v && (M.mousedown.dispatchEvent(u, {
-            pointer: v,
+          w && (M.mousedown.dispatchEvent(u, {
+            pointer: w,
             frame: c.current,
             keys: T
           }), p.current = {
-            xRangeCss: { start: w, end: w },
+            xRangeCss: { start: v, end: v },
             yRangeCss: { start: x, end: x }
           });
         });
       },
       onMouseUp: (h) => {
-        f(h, (m, w, x) => {
+        d(h, (m, v, x) => {
           const T = N(
             m,
             c.current
@@ -1038,16 +1038,16 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
             pointer: T,
             keys: x
           });
-          const v = d.current;
-          d.current = null;
+          const w = f.current;
+          f.current = null;
           const b = p.current;
-          if (p.current = null, b && v) {
+          if (p.current = null, b && w) {
             const S = {
-              ...v,
+              ...w,
               keys: x,
               completed: !0
             };
-            d.current = null, M.spanselect.dispatchEvent(
+            f.current = null, M.spanselect.dispatchEvent(
               u,
               S
             );
@@ -1055,7 +1055,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         });
       },
       onContextMenu: (h) => {
-        h.preventDefault(), f(h, (m, w, x) => {
+        h.preventDefault(), d(h, (m, v, x) => {
           const T = N(
             m,
             c.current
@@ -1068,7 +1068,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
         });
       },
       onDoubleClick: (h) => {
-        f(h, (m, w, x) => {
+        d(h, (m, v, x) => {
           const T = N(
             m,
             c.current
@@ -1088,35 +1088,35 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   xe("move", (r) => {
     o(r);
   });
-  const i = Z(() => {
+  const i = Q(() => {
     if (!s)
       return null;
     const { frame: r, pointer: c } = s, u = c?.scaled[n];
-    if (u === void 0 || !X(r, n))
+    if (u === void 0 || !F(r, n))
       return null;
     const p = [];
-    let d = u;
+    let f = u;
     for (const a of e) {
-      let g = null, f = 1 / 0;
-      for (const [m, w] of a.points.entries()) {
-        if (!fe(r, w.x, n) || !fe(r, w.y, a.yScaleId))
+      let g = null, d = 1 / 0;
+      for (const [m, v] of a.points.entries()) {
+        if (!de(r, v.x, n) || !de(r, v.y, a.yScaleId))
           continue;
-        const x = Math.abs(w.x - u);
-        x < f && (f = x, g = m);
+        const x = Math.abs(v.x - u);
+        x < d && (d = x, g = m);
       }
-      const y = a.points[g ?? -1], h = ge(r, f, n, "css");
+      const y = a.points[g ?? -1], h = ge(r, d, n, "css");
       if (!y || h === null || h > 30) {
         p.push({ seriesId: a.seriesId, y: null });
         continue;
       }
-      d = y.x, p.push({
+      f = y.x, p.push({
         seriesId: a.seriesId,
         y: y.y
       });
     }
     return {
       frame: r,
-      x: d,
+      x: f,
       points: p
     };
   }, [e, s, n]);
@@ -1127,7 +1127,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
     i(a);
   }), !o)
     return null;
-  const { frame: r, pointer: c } = o, u = c?.cssX ?? null, l = c?.cssY ?? null, p = u ? V(r, u, "css") : 0, d = l ? H(r, l, "css") : 0;
+  const { frame: r, pointer: c } = o, u = c?.cssX ?? null, l = c?.cssY ?? null, p = u ? V(r, u, "css") : 0, f = l ? W(r, l, "css") : 0;
   return /* @__PURE__ */ pe(Ne, { children: [
     /* @__PURE__ */ R(
       "div",
@@ -1165,7 +1165,7 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
           width: r.chartAreaCSS.width,
           pointerEvents: "none",
           opacity: c ? 1 : 0,
-          transform: `translateY(${d}px)`,
+          transform: `translateY(${f}px)`,
           ...n?.(o)
         }
       }
@@ -1178,11 +1178,11 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
       i.mode === "below_threshold" || i.completed ? null : i
     );
   });
-  const o = Z(() => {
+  const o = Q(() => {
     if (!n || n.mode === "below_threshold")
       return null;
-    const i = n.mode === "y" ? -1 / 0 : n.x.css?.from ?? -1 / 0, r = n.mode === "y" ? 1 / 0 : n.x.css?.to ?? 1 / 0, c = n.mode === "x" ? -1 / 0 : n.y.css?.from ?? -1 / 0, u = n.mode === "x" ? 1 / 0 : n.y.css?.to ?? 1 / 0, l = V(n.frame, i, "css"), p = V(n.frame, r, "css"), d = H(n.frame, c, "css"), a = H(n.frame, u, "css"), g = Math.min(l, p), f = Math.min(d, a), y = Math.abs(p - l), h = Math.abs(a - d);
-    return { leftPx: g, topPx: f, widthPx: y, heightPx: h };
+    const i = n.mode === "y" ? -1 / 0 : n.x.css?.from ?? -1 / 0, r = n.mode === "y" ? 1 / 0 : n.x.css?.to ?? 1 / 0, c = n.mode === "x" ? -1 / 0 : n.y.css?.from ?? -1 / 0, u = n.mode === "x" ? 1 / 0 : n.y.css?.to ?? 1 / 0, l = V(n.frame, i, "css"), p = V(n.frame, r, "css"), f = W(n.frame, c, "css"), a = W(n.frame, u, "css"), g = Math.min(l, p), d = Math.min(f, a), y = Math.abs(p - l), h = Math.abs(a - f);
+    return { leftPx: g, topPx: d, widthPx: y, heightPx: h };
   }, [n]);
   return /* @__PURE__ */ R(
     "div",
@@ -1218,12 +1218,12 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
       children: t
     }
   ) : null;
-}, Xe = 60, dt = 30, Fe = "UTC", ft = "en-GB", $t = ({
+}, Xe = 60, ft = 30, Fe = "UTC", dt = "en-GB", $t = ({
   space: e,
   formatter: t,
   acceptableIncrements: n
 } = {}) => (s, o) => {
-  const { min: i, max: r } = s, c = [], u = window.devicePixelRatio || 1, l = (e ?? (s.origin === "x" ? Xe : dt)) * u, p = We(
+  const { min: i, max: r } = s, c = [], u = window.devicePixelRatio || 1, l = (e ?? (s.origin === "x" ? Xe : ft)) * u, p = We(
     o,
     l,
     s.id,
@@ -1231,11 +1231,11 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
   );
   if (p === null)
     return [];
-  const d = n ?? ne, a = d.find((f) => f > p) ?? d.at(-1) ?? 1;
+  const f = n ?? oe, a = f.find((d) => d > p) ?? f.at(-1) ?? 1;
   let g = i;
   if (Math.abs(g % a) > Number.EPSILON) {
-    const f = (a - g % a) % a;
-    g += f;
+    const d = (a - g % a) % a;
+    g += d;
   }
   for (; g <= r && c.length < 1e3; )
     c.push(g), g += a;
@@ -1243,10 +1243,10 @@ const Dt = je(({ configuration: e, children: t, style: n, ...s }, o) => {
 }, mt = (e) => {
   const t = Math.max(0, Math.ceil(-Math.log10(e[1] - e[0])));
   return e.map((n) => ({ value: n, label: n.toFixed(t) }));
-}, ne = [];
+}, oe = [];
 for (let e = -12; e <= 12; e++)
-  ne.push(1 * 10 ** e), ne.push(2 * 10 ** e), ne.push(5 * 10 ** e);
-const pt = 1, Oe = 1e3 * pt, be = 60 * Oe, re = 60 * be, ce = 24 * re, yt = 30 * ce, gt = 365 * ce, vt = [
+  oe.push(1 * 10 ** e), oe.push(2 * 10 ** e), oe.push(5 * 10 ** e);
+const pt = 1, Oe = 1e3 * pt, be = 60 * Oe, J = 60 * be, ce = 24 * J, yt = 30 * ce, gt = 365 * ce, vt = [
   // second divisors
   [1, "milliseconds"],
   [2, "milliseconds"],
@@ -1298,7 +1298,7 @@ const pt = 1, Oe = 1e3 * pt, be = 60 * Oe, re = 60 * be, ce = 24 * re, yt = 30 *
   [25, "years"],
   [50, "years"],
   [100, "years"]
-], se = (e) => {
+], ie = (e) => {
   const [t, n] = e;
   switch (n) {
     case "milliseconds":
@@ -1308,7 +1308,7 @@ const pt = 1, Oe = 1e3 * pt, be = 60 * Oe, re = 60 * be, ce = 24 * re, yt = 30 *
     case "minutes":
       return t * be;
     case "hours":
-      return t * re;
+      return t * J;
     case "days":
       return t * ce;
     case "months":
@@ -1334,7 +1334,7 @@ const pt = 1, Oe = 1e3 * pt, be = 60 * Oe, re = 60 * be, ce = 24 * re, yt = 30 *
 }, Ae = (e, t) => {
   const n = new Date(e);
   return n.setUTCMonth(n.getUTCMonth() + t), n.getTime();
-}, Y = (e, t) => {
+}, _ = (e, t) => {
   const [n, s] = t;
   switch (s) {
     case "milliseconds":
@@ -1353,7 +1353,7 @@ const pt = 1, Oe = 1e3 * pt, be = 60 * Oe, re = 60 * be, ce = 24 * re, yt = 30 *
       return Ae(e, n * 12);
   }
 };
-function oe(e, t) {
+function H(e, t) {
   const n = new Date(e), s = new Date(n.toLocaleString("en-US", { timeZone: t })), o = new Date(n.toLocaleString("en-US", { timeZone: "UTC" }));
   return (s.getTime() - o.getTime()) / (3600 * 1e3);
 }
@@ -1361,7 +1361,7 @@ const Ct = (e, t, n = "UTC") => {
   const [s, o] = t;
   let i = new Date(e);
   const r = () => {
-    i.setUTCHours(-oe(i, n), 0, 0, 0);
+    i.setUTCHours(-H(i, n), 0, 0, 0);
   };
   switch (o) {
     case "milliseconds":
@@ -1377,23 +1377,27 @@ const Ct = (e, t, n = "UTC") => {
       break;
     case "minutes":
       i.setUTCMinutes(
-        Math.ceil(i.getTime() % re / be / s) * s,
+        Math.ceil(i.getTime() % J / be / s) * s,
         0,
         0
       );
       break;
-    case "hours":
+    case "hours": {
+      const c = H(i, n);
       i.setUTCHours(
-        Math.ceil(i.getTime() % ce / re / s) * s,
+        Math.ceil(
+          (i.getTime() + c * J) % ce / J / s
+        ) * s - c,
         0,
         0,
         0
       );
       break;
+    }
     case "days":
     case "months":
     case "years":
-      o === "months" ? i.setUTCDate(1) : o === "years" && i.setUTCMonth(0, 1), r(), i.getTime() < e && (i = new Date(Y(i, [1, o])));
+      o === "months" ? i.setUTCDate(1) : o === "years" && i.setUTCMonth(0, 1), r(), i.getTime() < e && (i = new Date(_(i, [1, o])));
       break;
   }
   return i.getTime();
@@ -1407,44 +1411,55 @@ const Ct = (e, t, n = "UTC") => {
   const { min: c, max: u } = i;
   if (!Number.isFinite(c) || !Number.isFinite(u))
     return [];
-  const l = Math.floor(r.chartAreaCanvasPX.width / t) + 1, d = (u - c) / l, [a, g] = vt.find(
-    (w) => se(w) >= d
+  const l = Math.floor(r.chartAreaCanvasPX.width / t) + 1, f = (u - c) / l, [a, g] = vt.find(
+    (v) => ie(v) >= f
   ) ?? [1, "milliseconds"];
   if (!a || !g)
     return [];
-  const f = Ct(c, [a, g], e), y = oe(f, e), h = [f];
+  const d = Ct(c, [a, g], e), y = H(d, e);
+  console.log(y, new Date(d));
+  const h = [d];
   let m;
-  for (; !(h.length > 1e3); ) {
+  for (; ; ) {
+    if (h.length > 100)
+      return [];
     switch (g) {
       case "milliseconds":
       case "seconds":
       case "minutes":
       case "hours": {
-        m = Y(f, [h.length * a, g]);
+        const v = _(d, [
+          h.length * a,
+          g
+        ]);
+        m = _(v, [
+          y - H(v, e),
+          "hours"
+        ]);
         break;
       }
       case "days": {
-        const w = Y(f, [
+        const v = _(d, [
           h.length * a,
           g
         ]);
-        m = Y(w, [
-          y - oe(w, e),
+        m = _(v, [
+          y - H(v, e),
           "hours"
         ]);
         break;
       }
       case "months":
       case "years": {
-        const w = Y(
-          Y(Y(f, [y, "hours"]), [
+        const v = _(
+          _(_(d, [y, "hours"]), [
             h.length * a,
             g
           ]),
           [-y, "hours"]
         );
-        m = Y(w, [
-          y - oe(w, e),
+        m = _(v, [
+          y - H(v, e),
           "hours"
         ]);
         break;
@@ -1452,16 +1467,16 @@ const Ct = (e, t, n = "UTC") => {
     }
     if (m > u)
       break;
-    h.push(m);
+    h[h.length - 1] !== m && h.push(m);
   }
   return (n ?? Pt({
     locale: s,
     showTimezone: o,
     timeZone: e
   }))(h);
-}, K = (e, t, n) => e.find((s) => s.type === n)?.value !== t.find((s) => s.type === n)?.value, Pt = ({
+}, Y = (e, t, n) => e.find((s) => s.type === n)?.value !== t.find((s) => s.type === n)?.value, Pt = ({
   timeZone: e = Fe,
-  locale: t = ft,
+  locale: t = dt,
   showTimezone: n = !0
 }) => {
   const s = new Intl.DateTimeFormat(t, {
@@ -1477,10 +1492,10 @@ const Ct = (e, t, n = "UTC") => {
     timeZone: e
   });
   return (o) => {
-    const i = o[1] - o[0], r = i < se([1, "days"]), c = i < se([1, "minutes"]), u = i < se([1, "seconds"]);
-    return o.map((l) => ({ value: l, label: s.formatToParts(new Date(l)) })).map((l, p, d) => {
-      const a = d[p - 1], g = p === 0 || K(l.label, a.label, "year"), f = p === 0 || K(l.label, a.label, "day"), y = p === 0 || K(l.label, a.label, "month"), h = p === 0 || K(l.label, a.label, "hour"), m = p === 0 || K(l.label, a.label, "timeZoneName"), w = p === 0 || K(l.label, a.label, "minute"), x = p === 0 || K(l.label, a.label, "second"), T = p === 0 || K(l.label, a.label, "fractionalSecond"), v = [];
-      if (r && (h || w || m || x || T)) {
+    const i = o[1] - o[0], r = i < ie([1, "days"]), c = i < ie([1, "minutes"]), u = i < ie([1, "seconds"]);
+    return o.map((l) => ({ value: l, label: s.formatToParts(new Date(l)) })).map((l, p, f) => {
+      const a = f[p - 1], g = p === 0 || Y(l.label, a.label, "year"), d = p === 0 || Y(l.label, a.label, "day"), y = p === 0 || Y(l.label, a.label, "month"), h = p === 0 || Y(l.label, a.label, "hour"), m = p === 0 || Y(l.label, a.label, "timeZoneName"), v = p === 0 || Y(l.label, a.label, "minute"), x = p === 0 || Y(l.label, a.label, "second"), T = p === 0 || Y(l.label, a.label, "fractionalSecond"), w = [];
+      if (r && (h || v || m || x || T)) {
         const b = l.label.find((P) => P.type === "hour")?.value, S = l.label.find((P) => P.type === "minute")?.value, E = l.label.find((P) => P.type === "timeZoneName")?.value;
         let C = "";
         if (c) {
@@ -1489,18 +1504,18 @@ const Ct = (e, t, n = "UTC") => {
           )?.value;
           C = `:${P}` + (u ? `.${A}` : "");
         }
-        v.push(
+        w.push(
           `${b}:${S}${C}` + (n && m ? ` ${E}` : "")
         );
       }
-      return (f || y) && v.push(
+      return (d || y) && w.push(
         [
           l.label.find((b) => b.type === "month")?.value,
-          f && l.label.find((b) => b.type === "day")?.value
+          d && l.label.find((b) => b.type === "day")?.value
         ].filter(Boolean).join(" ")
-      ), g && v.push(l.label.find((b) => b.type === "year")?.value), {
+      ), g && w.push(l.label.find((b) => b.type === "year")?.value), {
         value: l.value,
-        label: v.filter((b) => b).join(`
+        label: w.filter((b) => b).join(`
 `)
       };
     });
@@ -1523,24 +1538,24 @@ export {
   Ft as XTicks,
   Ot as YTicks,
   U as applyStyles,
-  ie as clamp,
+  re as clamp,
   V as clampXPosToChartArea,
-  H as clampYPosToChartArea,
-  F as deepEqual,
+  W as clampYPosToChartArea,
+  O as deepEqual,
   mt as defaultNumericalTicksFormatter,
   Rt as findClosestIndex,
-  X as getScale,
+  F as getScale,
   $t as makeLinearTicks,
   Pt as makeTimeTickFormat,
   jt as makeTimeTicks,
-  _ as posToVal,
+  X as posToVal,
   We as pxToValDistance,
   kt as sum,
   j as useDrawEffect,
   Ue as useFrameState,
   xe as useInteractionsEvent,
-  fe as valFits,
-  G as valToPos,
+  de as valFits,
+  Z as valToPos,
   ge as valToPxDistance
 };
 //# sourceMappingURL=canplot.mjs.map