@gearbox-protocol/ui-kit 3.14.0-next.35 → 3.14.0-next.36

package/dist/esm/components/graph/graph.js

@@ -1,30 +1,30 @@
-import { jsxs as te, jsx as y } from "react/jsx-runtime";
-import { createChart as Ye, CrosshairMode as Ue, LineStyle as Ae, LineSeries as et, AreaSeries as tt } from "lightweight-charts";
+import { jsxs as re, jsx as T } from "react/jsx-runtime";
+import { createChart as Ue, CrosshairMode as et, LineStyle as Ge, LineSeries as tt, AreaSeries as ot } from "lightweight-charts";
 import * as Ce from "react";
-import { useRef as $, useState as Se, useEffect as F } from "react";
-import { useIsMobile as ot } from "../../hooks/use-media-query.js";
-import { cn as ae } from "../../utils/cn.js";
-import { resolveCSSColor as ee, generateColorsFromBase as le, hslToHex as rt } from "../../utils/colors.js";
-import { getDefaultOptions as $e, getDefaultSeries as nt, getDefaultVerticalLine as lt } from "./default-config.js";
-import { getXFormatters as Ee, createAdaptiveYAxisFormatter as at, formatExactValue as xe } from "./formatters.js";
-import { GraphCurrentValue as it } from "./graph-current-value.js";
-import { GraphTooltip as st } from "./graph-tooltip.js";
-import { VertLine as ct } from "./plugins/vertical-line.js";
-class ut {
+import { useRef as X, useState as Se, useEffect as W } from "react";
+import { useIsMobile as rt } from "../../hooks/use-media-query.js";
+import { cn as ne } from "../../utils/cn.js";
+import { resolveCSSColor as U, generateColorsFromBase as se, hslToHex as nt } from "../../utils/colors.js";
+import { getDefaultOptions as je, getDefaultSeries as lt, getDefaultVerticalLine as at } from "./default-config.js";
+import { getXFormatters as He, formatExactValue as xe, createAdaptiveYAxisFormatter as it } from "./formatters.js";
+import { GraphCurrentValue as st } from "./graph-current-value.js";
+import { GraphTooltip as ct } from "./graph-tooltip.js";
+import { VertLine as ut } from "./plugins/vertical-line.js";
+class ft {
   _yTop;
   _yBottom;
   _color;
-  constructor(s, f, m) {
-    this._yTop = s, this._yBottom = f, this._color = m;
+  constructor(s, g, m) {
+    this._yTop = s, this._yBottom = g, this._color = m;
   }
   draw(s) {
-    s.useBitmapCoordinateSpace((f) => {
-      const m = f.context, h = f.verticalPixelRatio, w = this._yTop === null ? 0 : this._yTop * h, X = this._yBottom === null ? f.bitmapSize.height : this._yBottom * h, b = Math.min(w, X), V = Math.max(w, X);
-      m.fillStyle = this._color, m.fillRect(0, b, f.bitmapSize.width, V - b);
+    s.useBitmapCoordinateSpace((g) => {
+      const m = g.context, d = g.verticalPixelRatio, N = this._yTop === null ? 0 : this._yTop * d, q = this._yBottom === null ? g.bitmapSize.height : this._yBottom * d, x = Math.min(N, q), k = Math.max(N, q);
+      m.fillStyle = this._color, m.fillRect(0, x, g.bitmapSize.width, k - x);
     });
   }
 }
-class ft {
+class ht {
   _source;
   _yTop = null;
   _yBottom = null;
@@ -40,17 +40,17 @@ class ft {
     return "bottom";
   }
   renderer() {
-    return new ut(this._yTop, this._yBottom, this._source.color);
+    return new ft(this._yTop, this._yBottom, this._source.color);
   }
 }
-class ht {
+class gt {
   series;
   priceTop;
   priceBottom;
   color;
   _paneViews;
-  constructor(s, f, m, h) {
-    this.series = s, this.priceTop = f, this.priceBottom = m, this.color = h, this._paneViews = [new ft(this)];
+  constructor(s, g, m, d) {
+    this.series = s, this.priceTop = g, this.priceBottom = m, this.color = d, this._paneViews = [new ht(this)];
   }
   updateAllViews() {
     for (const s of this._paneViews) s.update();
@@ -59,18 +59,18 @@ class ht {
     return this._paneViews;
   }
 }
-function gt(t, s, f) {
-  const m = t.labelText ?? "", h = t.value, w = h === void 0 ? "" : typeof h == "number" ? s === "$" ? `$${xe(h, void 0, f)}` : s === "%" ? `${xe(h, void 0, f)}%` : xe(
-    h,
+function dt(o, s, g) {
+  const m = o.labelText ?? "", d = o.value, N = d === void 0 ? "" : typeof d == "number" ? s === "$" ? `$${xe(d, void 0, g)}` : s === "%" ? `${xe(d, void 0, g)}%` : xe(
+    d,
     s !== "none" && s !== "%" && s !== "$" ? s : void 0,
-    f
-  ) : String(h);
-  return { labelText: m, valueStr: w };
+    g
+  ) : String(d);
+  return { labelText: m, valueStr: N };
 }
-function mt(t, s) {
-  for (let f = t.length - 1; f >= 0; f--)
-    if (Number(t[f].time) <= s)
-      return t[f].value;
+function mt(o, s) {
+  for (let g = o.length - 1; g >= 0; g--)
+    if (Number(o[g].time) <= s)
+      return o[g].value;
   return 0;
 }
 const ye = [
@@ -188,72 +188,70 @@ const ye = [
     top: "rgba(71, 85, 105, 0.56)",
     bottom: "rgba(71, 85, 105, 0.04)"
   }
-], dt = 137.5;
-function Ge(t) {
-  if (t < ye.length)
-    return ye[t];
-  const f = (t - ye.length) * dt % 360, m = rt(f, 70, 50), { topColor: h, bottomColor: w } = le(m);
-  return { line: m, top: h, bottom: w };
+], pt = 137.5;
+function Xe(o) {
+  if (o < ye.length)
+    return ye[o];
+  const g = (o - ye.length) * pt % 360, m = nt(g, 70, 50), { topColor: d, bottomColor: N } = se(m);
+  return { line: m, top: d, bottom: N };
 }
 function Lt({
-  series: t,
+  series: o,
   className: s,
-  showLegend: f = !1,
+  showLegend: g = !1,
   onUnselectSeries: m,
-  xMeasureUnit: h = "time",
-  yMeasureUnit: w = "token",
-  optionsOverrides: X,
-  verticalLineOptions: b,
-  priceLineOptions: V,
-  zoneOptions: E,
-  currentValueDecimals: ie,
-  useSharedPriceScale: I = !1,
+  xMeasureUnit: d = "time",
+  yMeasureUnit: N = "token",
+  optionsOverrides: q,
+  verticalLineOptions: x,
+  priceLineOptions: k,
+  zoneOptions: A,
+  currentValueDecimals: ce,
+  useSharedPriceScale: $ = !1,
   dualYAxis: L = !1,
   defaultVisiblePriceScaleId: we = "right",
   leftPriceScaleTitle: Te,
-  rightPriceScaleTitle: pt,
-  showCurrentValue: je = !0,
-  graphTitle: se,
+  rightPriceScaleTitle: vt,
+  showCurrentValue: qe = !0,
+  graphTitle: ue,
   yScaleMin: Ne,
   yScaleMinMultiple: Ve,
-  visibleTimeFrom: q,
-  disableZoom: oe = !1,
-  hideDefaultTooltip: ce = !1
+  visibleTimeFrom: Z,
+  disableZoom: le = !1,
+  hideDefaultTooltip: fe = !1
 }) {
-  const k = $(null), p = $(/* @__PURE__ */ new Map()), ue = $(!1), Re = $(!0), fe = $(
-    null
-  ), He = $(null), Z = $(null), he = $(null), re = $(null), T = ot(), G = Ce.useMemo(() => t.flatMap((e) => e.data), [t]), Xe = Ce.useMemo(() => {
-    if (t.length > 0) {
-      const e = t[t.length - 1];
-      if (e.data.length > 0)
-        return e.data[e.data.length - 1];
+  const I = X(null), y = X(/* @__PURE__ */ new Map()), he = X(!1), Re = X(!0), Pe = X([]), K = X(null), ge = X(null), ae = X(null), R = rt(), G = Ce.useMemo(() => o.flatMap((t) => t.data), [o]), Ze = Ce.useMemo(() => {
+    if (o.length > 0) {
+      const t = o[o.length - 1];
+      if (t.data.length > 0)
+        return t.data[t.data.length - 1];
     }
-  }, [t]), [Pe, ge] = Se(() => {
-    if (!Xe) return;
-    const e = /* @__PURE__ */ new Map();
-    for (const a of t)
-      a.data.length > 0 && e.set(a.label, a.data[a.data.length - 1]);
-    return e;
-  }), [Me, j] = Se(null), [_e, Le] = Se([]);
-  F(() => {
-    const e = () => {
+  }, [o]), [Me, de] = Se(() => {
+    if (!Ze) return;
+    const t = /* @__PURE__ */ new Map();
+    for (const a of o)
+      a.data.length > 0 && t.set(a.label, a.data[a.data.length - 1]);
+    return t;
+  }), [ke, j] = Se(null), [Le, _e] = Se([]);
+  W(() => {
+    const t = () => {
       try {
-        if (k.current && Z.current) {
-          const n = Z.current.clientWidth, i = Z.current.clientHeight;
-          k.current.resize(n, i);
+        if (I.current && K.current) {
+          const n = K.current.clientWidth, i = K.current.clientHeight;
+          I.current.resize(n, i);
         }
       } catch {
       }
-    }, a = Z.current, l = a ? new ResizeObserver(e) : null;
-    return re.current = l, a && l?.observe(a), () => {
-      a && l?.unobserve(a), l?.disconnect(), re.current = null;
+    }, a = K.current, l = a ? new ResizeObserver(t) : null;
+    return ae.current = l, a && l?.observe(a), () => {
+      a && l?.unobserve(a), l?.disconnect(), ae.current = null;
     };
-  }, []), F(() => {
-    if (!he.current || ue.current) return;
-    const e = $e(), a = ee(
+  }, []), W(() => {
+    if (!ge.current || he.current) return;
+    const t = je(), a = U(
       "hsl(var(--foreground))",
       "rgb(0, 0, 0)"
-    ), l = oe ? {
+    ), l = le ? {
       handleScale: {
         mouseWheel: !1,
         pinch: !1,
@@ -266,34 +264,34 @@ function Lt({
         horzTouchDrag: !1,
         vertTouchDrag: !1
       }
-    } : {}, n = Ye(he.current, {
-      ...e,
+    } : {}, n = Ue(ge.current, {
+      ...t,
       leftPriceScale: {
-        ...e.leftPriceScale || {},
+        ...t.leftPriceScale || {},
         visible: !1,
         textColor: a
       },
       rightPriceScale: {
-        ...e.rightPriceScale || {},
-        visible: !T,
+        ...t.rightPriceScale || {},
+        visible: !R,
         textColor: a
       },
-      ...T && {
+      ...R && {
         crosshair: {
-          ...e.crosshair,
-          mode: Ue.Magnet
+          ...t.crosshair,
+          mode: et.Magnet
         }
       },
       ...l,
-      ...X
+      ...q
     });
-    return k.current = n, ue.current = !0, () => {
-      re.current?.disconnect(), re.current = null, n.remove(), k.current = null, ue.current = !1, p.current.clear();
+    return I.current = n, he.current = !0, () => {
+      ae.current?.disconnect(), ae.current = null, n.remove(), I.current = null, he.current = !1, y.current.clear();
     };
-  }, [T, X, oe]), F(() => {
-    const e = k.current;
-    e && e.applyOptions(
-      oe ? {
+  }, [R, q, le]), W(() => {
+    const t = I.current;
+    t && t.applyOptions(
+      le ? {
         handleScale: {
           mouseWheel: !1,
           pinch: !1,
@@ -321,58 +319,89 @@ function Lt({
         }
       }
     );
-  }, [oe]), F(() => {
-    const e = k.current;
-    if (!e || t.length === 0) return;
-    const l = t.filter((o) => o.data.length > 0).length <= 1 ? Ne : Ve, n = h === "time" ? Ee(h, G) : Ee(h), i = G.map((o) => o.value), {
-      formatter: c,
-      tickmarksFormatter: g,
-      updateVisibleRange: z,
-      updateLastValues: v
-    } = at(i, w, {
-      yScaleMin: l
-    });
-    fe.current = z, He.current = v;
-    const W = t.filter((o) => o.data.length > 0).map((o) => o.data[o.data.length - 1].value);
-    v(W);
-    const P = $e();
-    e.applyOptions({
+  }, [le]), W(() => {
+    const t = I.current;
+    if (!t || o.length === 0) return;
+    const l = o.filter((r) => r.data.length > 0).length <= 1 ? Ne : Ve, n = d === "time" ? He(d, G) : He(d), i = /* @__PURE__ */ new Map();
+    {
+      let r = 0;
+      for (const e of o)
+        e.data.length !== 0 && (i.set(
+          e.label,
+          e.priceScaleId ?? (r === 0 ? "left" : "right")
+        ), r++);
+    }
+    const f = (r, e, u) => {
+      const {
+        formatter: B,
+        tickmarksFormatter: S,
+        updateVisibleRange: z,
+        updateLastValues: Fe
+      } = it(r, e, {
+        yScaleMin: l
+      }), pe = o.filter((O) => O.data.length > 0 && u.has(O.label)).map((O) => O.data[O.data.length - 1].value);
+      return Fe(pe), { formatter: B, tickmarksFormatter: S, updateVisibleRange: z, labels: u };
+    }, c = [];
+    if (L)
+      for (const r of ["left", "right"]) {
+        const e = /* @__PURE__ */ new Set(), u = [];
+        let B = N;
+        for (const S of o)
+          if (S.data.length !== 0 && i.get(S.label) === r) {
+            e.size === 0 && S.yMeasureUnit && (B = S.yMeasureUnit), e.add(S.label);
+            for (const z of S.data) u.push(z.value);
+          }
+        e.size > 0 && c.push(f(u, B, e));
+      }
+    else {
+      const r = G.map((u) => u.value), e = new Set(
+        o.filter((u) => u.data.length > 0).map((u) => u.label)
+      );
+      c.push(f(r, N, e));
+    }
+    Pe.current = c;
+    const b = /* @__PURE__ */ new Map();
+    for (const r of c)
+      for (const e of r.labels)
+        b.set(e, r);
+    const v = je();
+    t.applyOptions({
       localization: {
-        ...P.localization || {},
+        ...v.localization || {},
         // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
-        timeFormatter: (o) => (
+        timeFormatter: (r) => (
           // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
-          n.timeFormatter(parseFloat(o), void 0)
+          n.timeFormatter(parseFloat(r), void 0)
         )
       },
       timeScale: {
-        ...P.timeScale || {},
+        ...v.timeScale || {},
         // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
         tickMarkFormatter: n.tickMarkFormatter,
         minBarSpacing: 0
       }
     });
-    const d = (G.length > 0 ? Math.min(...G.map((o) => o.value)) : 0) < 0, R = G.some((o) => o.value === 0), C = !d && R, N = !L && t.length > 1 && !I, S = L ? T : t.length > 1 && !I || T, D = ee(
+    const _ = (G.length > 0 ? Math.min(...G.map((r) => r.value)) : 0) < 0, w = G.some((r) => r.value === 0), p = !_ && w, C = !L && o.length > 1 && !$, P = L ? R : o.length > 1 && !$ || R, M = U(
       "hsl(var(--foreground))",
       "rgb(0, 0, 0)"
     );
-    e.applyOptions({
+    t.applyOptions({
       ...L && {
         defaultVisiblePriceScaleId: we
       },
       leftPriceScale: {
-        ...P.leftPriceScale || {},
-        visible: L && !T,
-        textColor: D,
+        ...v.leftPriceScale || {},
+        visible: L && !R,
+        textColor: M,
         ...L && Te && {
           // lightweight-charts uses scale margins; title shown via localization if needed
         }
       },
       rightPriceScale: {
-        ...P.rightPriceScale || {},
-        visible: L ? !T : !S,
-        textColor: D,
-        ...C && !L && {
+        ...v.rightPriceScale || {},
+        visible: L ? !R : !P,
+        textColor: M,
+        ...p && !L && {
           scaleMargins: {
             top: 0.3,
             bottom: 0
@@ -380,129 +409,129 @@ function Lt({
         }
       }
     });
-    const Q = new Set(p.current.keys()), me = new Set(t.map((o) => o.label));
-    for (const o of Q)
-      if (!me.has(o)) {
-        const r = p.current.get(o);
-        r && (e.removeSeries(r), p.current.delete(o));
+    const V = new Set(y.current.keys()), J = new Set(o.map((r) => r.label));
+    for (const r of V)
+      if (!J.has(r)) {
+        const e = y.current.get(r);
+        e && (t.removeSeries(e), y.current.delete(r));
       }
-    const Be = nt(), de = [];
-    let Y = 0;
-    const De = t.find((o) => o.data.length > 0), U = /* @__PURE__ */ new Map();
-    if (V && V.length > 0)
-      for (const o of V) {
-        if (!Number.isFinite(o.price)) continue;
-        const r = o.seriesLabel ?? De?.label;
-        if (!r) continue;
-        const x = U.get(r) ?? [];
-        x.push(o.price), U.set(r, x);
+    const Q = lt(), ee = [];
+    let te = 0;
+    const De = o.find((r) => r.data.length > 0), oe = /* @__PURE__ */ new Map();
+    if (k && k.length > 0)
+      for (const r of k) {
+        if (!Number.isFinite(r.price)) continue;
+        const e = r.seriesLabel ?? De?.label;
+        if (!e) continue;
+        const u = oe.get(e) ?? [];
+        u.push(r.price), oe.set(e, u);
       }
-    if (E && E.length > 0)
-      for (const o of E) {
-        const r = o.seriesLabel ?? De?.label;
-        if (!r) continue;
-        const x = U.get(r) ?? [];
-        Number.isFinite(o.priceTop) && x.push(o.priceTop), Number.isFinite(o.priceBottom) && x.push(o.priceBottom), U.set(r, x);
+    if (A && A.length > 0)
+      for (const r of A) {
+        const e = r.seriesLabel ?? De?.label;
+        if (!e) continue;
+        const u = oe.get(e) ?? [];
+        Number.isFinite(r.priceTop) && u.push(r.priceTop), Number.isFinite(r.priceBottom) && u.push(r.priceBottom), oe.set(e, u);
       }
-    for (let o = 0; o < t.length; o++) {
-      const r = t[o], x = Ge(o), K = r.lineColor ?? r.color ?? x.line;
-      let H, O;
-      if (r.lineColor ?? r.color)
-        if (r.topColor && r.bottomColor)
-          H = r.topColor, O = r.bottomColor;
-        else if (r.topColor) {
-          const u = le(K);
-          H = r.topColor, O = u.bottomColor;
-        } else if (r.bottomColor)
-          H = le(K).topColor, O = r.bottomColor;
+    for (let r = 0; r < o.length; r++) {
+      const e = o[r], u = Xe(r), B = e.lineColor ?? e.color ?? u.line;
+      let S, z;
+      if (e.lineColor ?? e.color)
+        if (e.topColor && e.bottomColor)
+          S = e.topColor, z = e.bottomColor;
+        else if (e.topColor) {
+          const h = se(B);
+          S = e.topColor, z = h.bottomColor;
+        } else if (e.bottomColor)
+          S = se(B).topColor, z = e.bottomColor;
         else {
-          const u = le(K);
-          H = u.topColor, O = u.bottomColor;
+          const h = se(B);
+          S = h.topColor, z = h.bottomColor;
         }
       else
-        H = r.topColor || x.top, O = r.bottomColor || x.bottom;
-      if (r.data.length === 0) {
-        const u = p.current.get(r.label);
-        u && (e.removeSeries(u), p.current.delete(r.label));
+        S = e.topColor || u.top, z = e.bottomColor || u.bottom;
+      if (e.data.length === 0) {
+        const h = y.current.get(e.label);
+        h && (t.removeSeries(h), y.current.delete(e.label));
         continue;
       }
-      const qe = (r.data.length > 0 ? Math.min(...r.data.map((u) => u.value)) : 0) < 0, Ze = r.data.some((u) => u.value === 0), Ke = !qe && Ze, Fe = L ? r.priceScaleId ?? (Y === 0 ? "left" : "right") : I || !N || Y === 0 ? "right" : `scale-${Y}`;
-      N && de.push({
-        priceScaleId: Fe || "right",
+      const pe = (e.data.length > 0 ? Math.min(...e.data.map((h) => h.value)) : 0) < 0, O = e.data.some((h) => h.value === 0), Ke = !pe && O, Ie = L ? e.priceScaleId ?? (te === 0 ? "left" : "right") : $ || !C || te === 0 ? "right" : `scale-${te}`;
+      C && ee.push({
+        priceScaleId: Ie || "right",
         shouldPreventNegativeAxis: Ke,
-        seriesIndex: Y
+        seriesIndex: te
       });
-      const Ie = (I || !N) && l !== void 0 && typeof l == "number", Oe = U.get(r.label) ?? [], Je = (u) => {
-        const _ = u();
-        if (_?.priceRange) {
-          Ie && (_.priceRange.minValue = l);
-          for (const A of Oe)
-            A < _.priceRange.minValue && (_.priceRange.minValue = A), A > _.priceRange.maxValue && (_.priceRange.maxValue = A);
+      const ze = ($ || !C) && l !== void 0 && typeof l == "number", Oe = oe.get(e.label) ?? [], Je = (h) => {
+        const F = h();
+        if (F?.priceRange) {
+          ze && (F.priceRange.minValue = l);
+          for (const E of Oe)
+            E < F.priceRange.minValue && (F.priceRange.minValue = E), E > F.priceRange.maxValue && (F.priceRange.maxValue = E);
         }
-        return _;
-      }, pe = {
-        lineColor: K,
-        topColor: H,
-        bottomColor: O,
-        priceScaleId: Fe,
-        ...r.seriesType === "line" && {
-          lineStyle: r.lineStyle ?? Ae.Solid
+        return F;
+      }, We = b.get(e.label) ?? c[0], $e = We.formatter, Qe = We.tickmarksFormatter, be = {
+        lineColor: B,
+        topColor: S,
+        bottomColor: z,
+        priceScaleId: Ie,
+        ...e.seriesType === "line" && {
+          lineStyle: e.lineStyle ?? Ge.Solid
         },
         priceFormat: {
           type: "custom",
           minMove: 0.01,
-          formatter: Ie && typeof l == "number" ? (u) => c(
-            u < l ? l : u
-          ) : c,
-          tickmarksFormatter: g
+          formatter: ze && typeof l == "number" ? (h) => $e(
+            h < l ? l : h
+          ) : $e,
+          tickmarksFormatter: Qe
         },
         autoscaleInfoProvider: Je
-      }, ze = r.seriesType === "line";
-      let M = p.current.get(r.label);
-      const J = r.data.map((u) => ({
-        ...u,
-        time: u.time
+      }, Ee = e.seriesType === "line";
+      let D = y.current.get(e.label);
+      const Y = e.data.map((h) => ({
+        ...h,
+        time: h.time
       }));
-      if (q !== void 0 && J.length > 0 && Number(J[0].time) > q) {
-        const u = Number(J[0].time), _ = u - q, A = 86400, Qe = _ > 180 * A ? 7 * A : _ > 30 * A ? A : 6 * 3600, We = [];
-        for (let ve = q; ve < u; ve += Qe)
-          We.push({ time: ve });
-        J.unshift(...We);
+      if (Z !== void 0 && Y.length > 0 && Number(Y[0].time) > Z) {
+        const h = Number(Y[0].time), F = h - Z, E = 86400, Ye = F > 180 * E ? 7 * E : F > 30 * E ? E : 6 * 3600, Ae = [];
+        for (let ve = Z; ve < h; ve += Ye)
+          Ae.push({ time: ve });
+        Y.unshift(...Ae);
       }
-      M && M.seriesType() !== (ze ? "Line" : "Area") && (e.removeSeries(M), p.current.delete(r.label), M = void 0), M ? (M.applyOptions(pe), M.setData(J)) : (ze ? M = e.addSeries(et, {
-        ...Be,
-        ...pe
-      }) : M = e.addSeries(tt, {
-        ...Be,
-        ...pe
-      }), M.setData(J), p.current.set(r.label, M)), Y++;
+      D && D.seriesType() !== (Ee ? "Line" : "Area") && (t.removeSeries(D), y.current.delete(e.label), D = void 0), D ? (D.applyOptions(be), D.setData(Y)) : (Ee ? D = t.addSeries(tt, {
+        ...Q,
+        ...be
+      }) : D = t.addSeries(ot, {
+        ...Q,
+        ...be
+      }), D.setData(Y), y.current.set(e.label, D)), te++;
     }
     if (L)
       try {
-        const o = e.priceScale("left"), r = e.priceScale("right"), x = {
-          visible: !T,
+        const r = t.priceScale("left"), e = t.priceScale("right"), u = {
+          visible: !R,
           autoScale: !0,
           scaleMargins: { top: 0.1, bottom: 0.1 },
           alignLabels: !0,
           borderVisible: !0,
           borderColor: "rgba(224, 227, 235, 0.1)",
           entireTextOnly: !1,
-          textColor: D
+          textColor: M
         };
-        o?.applyOptions(x), r?.applyOptions(x);
+        r?.applyOptions(u), e?.applyOptions(u);
       } catch {
       }
-    else if (N && de.length > 0)
-      for (const o of de)
+    else if (C && ee.length > 0)
+      for (const r of ee)
         try {
-          const r = e.priceScale(o.priceScaleId);
-          r && r.applyOptions({
+          const e = t.priceScale(r.priceScaleId);
+          e && e.applyOptions({
             visible: !1,
             autoScale: !0,
             scaleMargins: {
               top: 0.1,
               bottom: 0.1,
-              ...o.shouldPreventNegativeAxis && {
+              ...r.shouldPreventNegativeAxis && {
                 top: 0.3,
                 bottom: 0
               }
@@ -511,25 +540,25 @@ function Lt({
             borderVisible: !0,
             borderColor: "rgba(224, 227, 235, 0.1)",
             entireTextOnly: !1,
-            textColor: D
+            textColor: M
           });
-        } catch (r) {
+        } catch (e) {
           console.warn(
-            `Failed to configure price scale ${o.priceScaleId} for series ${o.seriesIndex}:`,
-            r
+            `Failed to configure price scale ${r.priceScaleId} for series ${r.seriesIndex}:`,
+            e
           );
         }
-    else if (!N)
+    else if (!C)
       try {
-        const o = e.priceScale("right");
-        o && o.applyOptions({
-          visible: !T,
+        const r = t.priceScale("right");
+        r && r.applyOptions({
+          visible: !R,
           autoScale: !0,
           scaleMargins: {
             top: 0.1,
             // No bottom margin when yScaleMin is set so the scale doesn't extend below the minimum (avoids negative labels like -10M)
-            bottom: l !== void 0 || C ? 0 : 0.1,
-            ...C && {
+            bottom: l !== void 0 || p ? 0 : 0.1,
+            ...p && {
               top: 0.3
             }
           },
@@ -537,141 +566,148 @@ function Lt({
           borderVisible: !0,
           borderColor: "rgba(224, 227, 235, 0.1)",
           entireTextOnly: !1,
-          textColor: D
+          textColor: M
         });
       } catch {
       }
-    if (l !== void 0 && !T && (I || !N) && e.applyOptions({
+    if (l !== void 0 && !R && ($ || !C) && t.applyOptions({
       handleScroll: {
         vertTouchDrag: !1
       }
     }), G.length > 0) {
-      const o = G.map((H) => Number(H.time)), r = Math.min(...o), x = q !== void 0 ? Math.min(q, r) : r, K = Math.max(...o);
-      e.timeScale().setVisibleRange({ from: x, to: K });
+      const r = G.map((S) => Number(S.time)), e = Math.min(...r), u = Z !== void 0 ? Math.min(Z, e) : e, B = Math.max(...r);
+      t.timeScale().setVisibleRange({ from: u, to: B });
     }
     Re.current && (Re.current = !1);
-    const be = /* @__PURE__ */ new Map();
-    for (const o of t)
-      o.data.length > 0 && be.set(o.label, o.data[o.data.length - 1]);
-    ge(be.size > 0 ? be : void 0);
+    const me = /* @__PURE__ */ new Map();
+    for (const r of o)
+      r.data.length > 0 && me.set(r.label, r.data[r.data.length - 1]);
+    de(me.size > 0 ? me : void 0);
   }, [
-    t,
+    o,
     G,
-    h,
-    w,
-    T,
-    I,
+    d,
+    N,
+    R,
+    $,
     L,
     we,
     Te,
     Ne,
     Ve,
-    q,
-    V,
-    E
-  ]), F(() => {
-    const e = k.current;
-    if (!e || t.length === 0) return;
-    const a = t.length === 1;
+    Z,
+    k,
+    A
+  ]), W(() => {
+    const t = I.current;
+    if (!t || o.length === 0) return;
+    const a = o.length === 1;
     let l;
-    for (const i of t)
+    for (const i of o)
       if (i.data.length > 0) {
         l = i.data[i.data.length - 1].time;
         break;
       }
     if (!l) return;
     const n = (i) => {
-      const { time: c = l, seriesData: g, point: z } = i || {}, v = Array.from(p.current.values());
-      if (!z || !c) {
-        const B = /* @__PURE__ */ new Map();
-        for (const d of t)
-          d.data.length > 0 && B.set(d.label, d.data[d.data.length - 1]);
-        if (ge(B.size > 0 ? B : void 0), a || I || ce)
+      const { time: f = l, seriesData: c, point: b } = i || {}, v = Array.from(y.current.values());
+      if (!b || !f) {
+        const w = /* @__PURE__ */ new Map();
+        for (const p of o)
+          p.data.length > 0 && w.set(p.label, p.data[p.data.length - 1]);
+        if (de(w.size > 0 ? w : void 0), a || $ || fe)
           j(null);
         else if (v[0] && l) {
-          const R = e.timeScale().timeToCoordinate(l), C = t[0];
-          if (C.data.length > 0) {
-            const N = C.data[C.data.length - 1].value, S = v[0].priceToCoordinate(N);
-            R !== null && S !== null && j({ x: R, y: S });
+          const C = t.timeScale().timeToCoordinate(l), P = o[0];
+          if (P.data.length > 0) {
+            const M = P.data[P.data.length - 1].value, V = v[0].priceToCoordinate(M);
+            C !== null && V !== null && j({ x: C, y: V });
           }
         }
         return;
       }
-      const W = /* @__PURE__ */ new Map();
-      let P;
-      for (let B = 0; B < t.length; B++) {
-        const d = t[B], R = v[B];
-        if (!R) continue;
-        const C = g?.get(R), N = C && "value" in C ? C.value : void 0;
-        let S;
-        if (N !== void 0)
-          S = N;
+      const H = /* @__PURE__ */ new Map();
+      let _;
+      for (let w = 0; w < o.length; w++) {
+        const p = o[w], C = v[w];
+        if (!C) continue;
+        const P = c?.get(C), M = P && "value" in P ? P.value : void 0;
+        let V;
+        if (M !== void 0)
+          V = M;
         else if (a) {
-          const D = Number(c), Q = d.data.length > 0 ? Number(d.data[0].time) : Number.POSITIVE_INFINITY;
-          D < Q ? S = Number.NaN : S = d.data[d.data.length - 1]?.value ?? 0;
+          const J = Number(f), Q = p.data.length > 0 ? Number(p.data[0].time) : Number.POSITIVE_INFINITY;
+          J < Q ? V = Number.NaN : V = p.data[p.data.length - 1]?.value ?? 0;
         } else
-          S = mt(d.data, Number(c));
-        Number.isNaN(S) || (P === void 0 && (P = S), W.set(d.label, { value: S, time: c }));
+          V = mt(p.data, Number(f));
+        Number.isNaN(V) || (_ === void 0 && (_ = V), H.set(p.label, { value: V, time: f }));
       }
-      if (ge(W), P !== void 0 && v[0]) {
-        const d = e.timeScale().timeToCoordinate(c), R = v[0].priceToCoordinate(P);
-        if (d !== null && R !== null) {
-          const C = Z.current;
-          if (C) {
-            const N = C.querySelector(
+      if (de(H), _ !== void 0 && v[0]) {
+        const p = t.timeScale().timeToCoordinate(f), C = v[0].priceToCoordinate(_);
+        if (p !== null && C !== null) {
+          const P = K.current;
+          if (P) {
+            const M = P.querySelector(
               ".LightweightChart"
             );
-            if (N) {
-              const S = N.getBoundingClientRect(), D = C.getBoundingClientRect(), Q = d + (S.left - D.left), me = R + (S.top - D.top);
-              j({ x: Q, y: me });
+            if (M) {
+              const V = M.getBoundingClientRect(), J = P.getBoundingClientRect(), Q = p + (V.left - J.left), ee = C + (V.top - J.top);
+              j({ x: Q, y: ee });
             } else
-              j({ x: d, y: R });
+              j({ x: p, y: C });
           } else
-            j({ x: d, y: R });
+            j({ x: p, y: C });
         } else
           j(null);
       } else
         j(null);
     };
-    return e.subscribeCrosshairMove(n), T && e.subscribeClick(n), !a && !I && !ce && requestAnimationFrame(() => {
-      const i = Array.from(p.current.values());
-      if (i[0] && l && t[0]?.data.length > 0) {
-        const g = e.timeScale().timeToCoordinate(l), z = t[0].data[t[0].data.length - 1].value, v = i[0].priceToCoordinate(z);
-        g !== null && v !== null && j({ x: g, y: v });
+    return t.subscribeCrosshairMove(n), R && t.subscribeClick(n), !a && !$ && !fe && requestAnimationFrame(() => {
+      const i = Array.from(y.current.values());
+      if (i[0] && l && o[0]?.data.length > 0) {
+        const c = t.timeScale().timeToCoordinate(l), b = o[0].data[o[0].data.length - 1].value, v = i[0].priceToCoordinate(b);
+        c !== null && v !== null && j({ x: c, y: v });
       }
     }), () => {
-      e.unsubscribeCrosshairMove(n), T && e.unsubscribeClick(n);
+      t.unsubscribeCrosshairMove(n), R && t.unsubscribeClick(n);
     };
-  }, [t, I, T, ce]), F(() => {
-    const e = k.current;
-    if (!e || t.length === 0) return;
-    const a = e.timeScale(), l = () => {
-      if (!fe.current) return;
-      const n = a.getVisibleRange();
-      if (!n) return;
-      const i = Number(n.from), c = Number(n.to), g = [];
-      for (const z of t)
-        for (const v of z.data) {
-          const W = Number(v.time);
-          W >= i && W <= c && g.push(v.value);
-        }
-      g.length > 0 && fe.current(g);
+  }, [o, $, R, fe]), W(() => {
+    const t = I.current;
+    if (!t || o.length === 0) return;
+    const a = t.timeScale(), l = () => {
+      const n = Pe.current;
+      if (n.length === 0) return;
+      const i = a.getVisibleRange();
+      if (!i) return;
+      const f = Number(i.from), c = Number(i.to);
+      for (const b of n) {
+        const v = [];
+        for (const H of o)
+          if (b.labels.has(H.label))
+            for (const _ of H.data) {
+              const w = Number(_.time);
+              w >= f && w <= c && v.push(_.value);
+            }
+        v.length > 0 && b.updateVisibleRange(v);
+      }
     };
     return a.subscribeVisibleLogicalRangeChange(l), () => {
       a.unsubscribeVisibleLogicalRangeChange(
         l
       );
     };
-  }, [t]), F(() => {
-    const e = k.current, a = Array.from(p.current.values()), l = [];
-    if (e && a.length > 0 && b) {
-      const n = lt(), i = a[0];
-      for (const c of b) {
-        const g = new ct(e, i, c.xCoordinate, {
+  }, [o]), W(() => {
+    const t = I.current, a = Array.from(y.current.values()), l = [];
+    if (t && a.length > 0 && x) {
+      const n = at(), i = a[0];
+      for (const f of x) {
+        const c = {
           ...n,
-          ...c.options || {}
-        });
-        i.attachPrimitive(g), l.push(g);
+          ...f.options || {}
+        };
+        c.color && (c.color = U(c.color, c.color));
+        const b = new ut(t, i, f.xCoordinate, c);
+        i.attachPrimitive(b), l.push(b);
       }
     }
     return () => {
@@ -681,153 +717,164 @@ function Lt({
           n.detachPrimitive(i);
       }
     };
-  }, [b, t]), F(() => {
-    const e = [];
-    if (V && V.length > 0) {
-      const a = Array.from(p.current.values())[0], l = ee(
+  }, [x, o]), W(() => {
+    const t = [];
+    if (k && k.length > 0) {
+      const a = Array.from(y.current.values())[0], l = U(
         "hsl(var(--destructive))",
         "rgb(239, 68, 68)"
       );
-      for (const n of V) {
+      for (const n of k) {
         if (!Number.isFinite(n.price)) continue;
-        const i = n.seriesLabel ? p.current.get(n.seriesLabel) : a;
+        const i = n.seriesLabel ? y.current.get(n.seriesLabel) : a;
         if (!i) continue;
-        const c = i.createPriceLine({
+        const f = i.createPriceLine({
           price: n.price,
-          color: n.color ? ee(n.color, n.color) : l,
+          color: n.color ? U(n.color, n.color) : l,
           lineWidth: n.lineWidth ?? 1,
-          lineStyle: n.lineStyle ?? Ae.Dashed,
+          lineStyle: n.lineStyle ?? Ge.Dashed,
           axisLabelVisible: n.axisLabelVisible ?? !0,
           title: n.title ?? ""
         });
-        e.push({ series: i, line: c });
+        t.push({ series: i, line: f });
       }
     }
     return () => {
-      for (const { series: a, line: l } of e)
+      for (const { series: a, line: l } of t)
         try {
           a.removePriceLine(l);
         } catch {
         }
     };
-  }, [V, t]), F(() => {
-    const e = [];
-    if (E && E.length > 0) {
-      const a = Array.from(p.current.values())[0], l = "rgba(239, 68, 68, 0.12)";
-      for (const n of E) {
-        const i = n.seriesLabel ? p.current.get(n.seriesLabel) : a;
+  }, [k, o]), W(() => {
+    const t = [];
+    if (A && A.length > 0) {
+      const a = Array.from(y.current.values())[0], l = "rgba(239, 68, 68, 0.12)";
+      for (const n of A) {
+        const i = n.seriesLabel ? y.current.get(n.seriesLabel) : a;
         if (!i) continue;
-        const c = n.color ? ee(n.color, l) : l, g = new ht(
+        const f = n.color ? U(n.color, l) : l, c = new gt(
           i,
           n.priceTop,
           n.priceBottom,
-          c
+          f
         );
-        i.attachPrimitive(g), e.push({ series: i, zone: g });
+        i.attachPrimitive(c), t.push({ series: i, zone: c });
       }
     }
     return () => {
-      for (const { series: a, zone: l } of e)
+      for (const { series: a, zone: l } of t)
         try {
           a.detachPrimitive(l);
         } catch {
         }
     };
-  }, [E, t]), F(() => {
-    const e = k.current;
-    if (!e || !b?.length) {
-      Le([]);
+  }, [A, o]), W(() => {
+    const t = I.current;
+    if (!t || !x?.length) {
+      _e([]);
       return;
     }
     const a = () => {
-      const i = e.timeScale(), c = b.map((g) => i.timeToCoordinate(g.xCoordinate) ?? null);
-      Le(c);
+      const i = t.timeScale(), f = x.map((c) => i.timeToCoordinate(c.xCoordinate) ?? null);
+      _e(f);
     };
     a();
-    const l = e.timeScale(), n = () => {
+    const l = t.timeScale(), n = () => {
       a();
     };
     return l.subscribeVisibleLogicalRangeChange(n), () => {
       l.unsubscribeVisibleLogicalRangeChange(n);
     };
-  }, [b, t]);
-  const ne = t.length === 1, ke = Ce.useMemo(() => {
-    if (ne && t.length > 0) {
-      const e = t[0];
-      if (e.data.length > 0)
-        return e.data[e.data.length - 1];
+  }, [x, o]);
+  const ie = o.length === 1, Be = Ce.useMemo(() => {
+    if (ie && o.length > 0) {
+      const t = o[0];
+      if (t.data.length > 0)
+        return t.data[t.data.length - 1];
     }
-  }, [ne, t]);
-  return /* @__PURE__ */ te(
+  }, [ie, o]);
+  return /* @__PURE__ */ re(
     "div",
     {
-      ref: Z,
-      className: ae(
+      ref: K,
+      className: ne(
         "relative z-[1] w-full h-full overflow-hidden p-0",
         s
       ),
       children: [
-        se != null && se !== !1 && ne ? /* @__PURE__ */ y("div", { className: "absolute top-2 left-2 right-2 z-[100] pointer-events-none", children: /* @__PURE__ */ y("div", { className: "text-xl sm:text-2xl font-semibold text-foreground whitespace-nowrap overflow-hidden text-ellipsis", children: se }) }) : je && ne && ke && /* @__PURE__ */ y(
-          it,
+        ue != null && ue !== !1 && ie ? /* @__PURE__ */ T("div", { className: "absolute top-2 left-2 right-2 z-[100] pointer-events-none", children: /* @__PURE__ */ T("div", { className: "text-xl sm:text-2xl font-semibold text-foreground whitespace-nowrap overflow-hidden text-ellipsis", children: ue }) }) : qe && ie && Be && /* @__PURE__ */ T(
+          st,
           {
-            point: ke,
-            xMeasureUnit: h,
-            yMeasureUnit: w,
-            decimals: ie
+            point: Be,
+            xMeasureUnit: d,
+            yMeasureUnit: N,
+            decimals: ce
           }
         ),
-        Pe && Me && /* @__PURE__ */ y(
-          st,
+        Me && ke && /* @__PURE__ */ T(
+          ct,
           {
-            points: Pe,
-            xMeasureUnit: h,
-            yMeasureUnit: w,
-            series: t,
-            position: Me,
-            containerRef: Z,
-            decimals: ie
+            points: Me,
+            xMeasureUnit: d,
+            yMeasureUnit: N,
+            series: o,
+            position: ke,
+            containerRef: K,
+            decimals: ce
           }
         ),
-        f && /* @__PURE__ */ y(bt, { series: t, onUnselect: m }),
-        b && b.length > 0 && _e.length === b.length && /* @__PURE__ */ y(
+        g && /* @__PURE__ */ T(bt, { series: o, onUnselect: m }),
+        x && x.length > 0 && Le.length === x.length && /* @__PURE__ */ T(
           "div",
           {
             className: "absolute inset-0 z-[5] pointer-events-none",
             "aria-hidden": !0,
-            children: b.map((e, a) => {
-              const l = _e[a], n = e.options ?? {}, i = n.showLabel !== !1;
+            children: x.map((t, a) => {
+              const l = Le[a], n = t.options ?? {}, i = n.showLabel !== !1;
               if (l === null || !i) return null;
-              const { labelText: c, valueStr: g } = gt(
+              const { labelText: f, valueStr: c } = dt(
                 n,
-                w,
-                ie
-              );
-              if (!(c || g)) return null;
-              const v = n.labelBackgroundColor ?? n.color ?? "hsl(var(--background))", W = n.labelTextColor ?? "hsl(var(--foreground))", P = `${String(e.xCoordinate)}-${c}`;
-              return /* @__PURE__ */ te(
+                N,
+                ce
+              ), b = n.tooltipText ?? "";
+              if (!(f || c || b)) return null;
+              const H = n.labelBackgroundColor ?? n.color ?? "hsl(var(--background))", _ = n.labelTextColor ?? "hsl(var(--foreground))", w = `${String(t.xCoordinate)}-${f}-${b}`;
+              return /* @__PURE__ */ re(
                 "div",
                 {
-                  className: "absolute top-2 px-2 py-1 rounded text-xs font-medium whitespace-nowrap shadow-sm border border-border",
+                  className: ne(
+                    "group absolute top-2 px-2 py-1 rounded text-xs font-medium whitespace-nowrap shadow-sm border border-border",
+                    b && "pointer-events-auto cursor-default"
+                  ),
                   style: {
                     left: l,
                     transform: "translateX(-50%)",
-                    backgroundColor: v,
-                    color: W
+                    backgroundColor: H,
+                    color: _
                   },
                   children: [
-                    c && /* @__PURE__ */ y("span", { className: "block", children: c }),
-                    g && /* @__PURE__ */ y("span", { className: ae("block", c && "mt-0.5"), children: g })
+                    f && /* @__PURE__ */ T("span", { className: "block", children: f }),
+                    c && /* @__PURE__ */ T("span", { className: ne("block", f && "mt-0.5"), children: c }),
+                    b && /* @__PURE__ */ T(
+                      "span",
+                      {
+                        className: "pointer-events-none absolute right-0 top-full z-10 mt-1 hidden w-[280px] whitespace-normal rounded border border-border bg-popover px-2.5 py-1.5 text-left leading-snug text-popover-foreground shadow-md group-hover:block",
+                        role: "tooltip",
+                        children: b
+                      }
+                    )
                   ]
                 },
-                P
+                w
               );
             })
           }
         ),
-        /* @__PURE__ */ y(
+        /* @__PURE__ */ T(
           "div",
           {
-            ref: he,
+            ref: ge,
             className: "LightweightChart w-full h-full overflow-hidden"
           }
         )
@@ -836,48 +883,48 @@ function Lt({
   );
 }
 function bt({
-  series: t,
+  series: o,
   onUnselect: s,
-  inline: f = !1
+  inline: g = !1
 }) {
-  return /* @__PURE__ */ y(
+  return /* @__PURE__ */ T(
     "div",
     {
-      className: ae(
+      className: ne(
         "flex flex-wrap gap-2",
-        f ? "items-center" : "absolute top-0 left-2 z-[10]"
+        g ? "items-center" : "absolute top-0 left-2 z-[10]"
       ),
-      children: t.map((m, h) => {
-        const w = Ge(h), X = (m.lineColor ?? m.color) || w.line, b = m.data.length === 0;
-        return /* @__PURE__ */ te(
+      children: o.map((m, d) => {
+        const N = Xe(d), q = (m.lineColor ?? m.color) || N.line, x = m.data.length === 0;
+        return /* @__PURE__ */ re(
           "div",
           {
-            className: ae(
+            className: ne(
               "flex items-center gap-1.5 px-2 py-1 bg-background/80 backdrop-blur-sm rounded border border-border",
-              b && "opacity-50"
+              x && "opacity-50"
             ),
             children: [
-              /* @__PURE__ */ y(
+              /* @__PURE__ */ T(
                 "div",
                 {
                   className: "w-3 h-3 rounded-sm",
-                  style: { backgroundColor: X }
+                  style: { backgroundColor: q }
                 }
               ),
-              /* @__PURE__ */ te("span", { className: "text-[10px] sm:text-xs font-medium text-foreground", children: [
+              /* @__PURE__ */ re("span", { className: "text-[10px] sm:text-xs font-medium text-foreground", children: [
                 m.label,
-                b && " (no data)"
+                x && " (no data)"
               ] }),
-              s && /* @__PURE__ */ y(
+              s && /* @__PURE__ */ T(
                 "button",
                 {
                   type: "button",
-                  onClick: (V) => {
-                    V.stopPropagation(), s(m.label);
+                  onClick: (k) => {
+                    k.stopPropagation(), s(m.label);
                   },
                   className: "ml-1 flex items-center justify-center w-4 h-4 rounded-sm hover:bg-muted transition-colors cursor-pointer",
                   "aria-label": `Remove ${m.label}`,
-                  children: /* @__PURE__ */ te(
+                  children: /* @__PURE__ */ re(
                     "svg",
                     {
                       xmlns: "http://www.w3.org/2000/svg",
@@ -892,9 +939,9 @@ function bt({
                       className: "text-muted-foreground hover:text-foreground",
                       "aria-hidden": "true",
                       children: [
-                        /* @__PURE__ */ y("title", { children: "Close" }),
-                        /* @__PURE__ */ y("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-                        /* @__PURE__ */ y("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                        /* @__PURE__ */ T("title", { children: "Close" }),
+                        /* @__PURE__ */ T("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                        /* @__PURE__ */ T("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
                       ]
                     }
                   )
@@ -912,7 +959,7 @@ export {
   ye as DEFAULT_SERIES_COLORS,
   Lt as Graph,
   bt as GraphLegend,
-  Ge as getSeriesColorPalette,
+  Xe as getSeriesColorPalette,
   mt as getStepForwardValue,
-  gt as getVerticalLineTooltipContent
+  dt as getVerticalLineTooltipContent
 };