@gearbox-protocol/permissionless-ui 1.25.0 → 1.26.0

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

@@ -1,24 +1,24 @@
-import { jsxs as Y, jsx as v } from "react/jsx-runtime";
-import { createChart as Nt } from "lightweight-charts";
-import * as rt from "react";
-import { useRef as N, useState as at, useEffect as $ } from "react";
-import { useIsMobile as Tt } from "../../hooks/use-media-query.js";
-import { cn as st } from "../../utils/cn.js";
-import { hslToHex as kt, generateColorsFromBase as X, resolveCSSColor as ht } from "../../utils/colors.js";
-import { getDefaultOptions as pt, getDefaultSeries as Mt, getDefaultVerticalLine as At } from "./default-config.js";
-import { formatExactValue as lt, getXFormatter as Ct, createAdaptiveYAxisFormatter as Ft } from "./formatters.js";
-import { GraphCurrentValue as It } from "./graph-current-value.js";
-import { GraphTooltip as zt } from "./graph-tooltip.js";
-import { VertLine as Et } from "./plugins/vertical-line.js";
-function $t(t, S, h) {
-  const k = t.labelText ?? "", f = t.value, y = f === void 0 ? "" : typeof f == "number" ? S === "$" ? `$${lt(f, void 0, h)}` : S === "%" ? `${lt(f, void 0, h)}%` : lt(
-    f,
-    S !== "none" && S !== "%" && S !== "$" ? S : void 0,
-    h
-  ) : String(f);
-  return { labelText: k, valueStr: y };
+import { jsxs as Y, jsx as p } from "react/jsx-runtime";
+import { createChart as $t } from "lightweight-charts";
+import * as it from "react";
+import { useRef as T, useState as st, useEffect as E } from "react";
+import { useIsMobile as Dt } from "../../hooks/use-media-query.js";
+import { cn as ft } from "../../utils/cn.js";
+import { resolveCSSColor as Vt, generateColorsFromBase as _, hslToHex as Gt } from "../../utils/colors.js";
+import { getDefaultOptions as yt, getDefaultSeries as Ot, getDefaultVerticalLine as Bt } from "./default-config.js";
+import { getXFormatter as Lt, createAdaptiveYAxisFormatter as Yt, formatExactValue as ct } from "./formatters.js";
+import { GraphCurrentValue as jt } from "./graph-current-value.js";
+import { GraphTooltip as Ht } from "./graph-tooltip.js";
+import { VertLine as Wt } from "./plugins/vertical-line.js";
+function _t(t, x, b) {
+  const A = t.labelText ?? "", m = t.value, R = m === void 0 ? "" : typeof m == "number" ? x === "$" ? `$${ct(m, void 0, b)}` : x === "%" ? `${ct(m, void 0, b)}%` : ct(
+    m,
+    x !== "none" && x !== "%" && x !== "$" ? x : void 0,
+    b
+  ) : String(m);
+  return { labelText: A, valueStr: R };
 }
-const it = [
+const ut = [
   {
     line: "#02c39a",
     top: "rgba(2, 195, 154, 0.56)",
@@ -114,107 +114,112 @@ const it = [
     top: "rgba(71, 85, 105, 0.56)",
     bottom: "rgba(71, 85, 105, 0.04)"
   }
-], Dt = 137.5;
-function vt(t) {
-  if (t < it.length)
-    return it[t];
-  const h = (t - it.length) * Dt % 360, k = kt(h, 70, 50), { topColor: f, bottomColor: y } = X(k);
-  return { line: k, top: f, bottom: y };
+], Xt = 137.5;
+function Nt(t) {
+  if (t < ut.length)
+    return ut[t];
+  const b = (t - ut.length) * Xt % 360, A = Gt(b, 70, 50), { topColor: m, bottomColor: R } = _(A);
+  return { line: A, top: m, bottom: R };
 }
-function Qt({
+function ce({
   series: t,
-  className: S,
-  showLegend: h = !1,
-  onUnselectSeries: k,
-  xMeasureUnit: f = "time",
-  yMeasureUnit: y = "token",
-  optionsOverrides: j,
-  verticalLineOptions: x,
-  currentValueDecimals: q,
-  useSharedPriceScale: _ = !1,
-  showCurrentValue: St = !0
+  className: x,
+  showLegend: b = !1,
+  onUnselectSeries: A,
+  xMeasureUnit: m = "time",
+  yMeasureUnit: R = "token",
+  optionsOverrides: B,
+  verticalLineOptions: S,
+  currentValueDecimals: X,
+  useSharedPriceScale: k = !1,
+  showCurrentValue: Pt = !0,
+  graphTitle: q,
+  yScaleMin: dt,
+  yScaleMinMultiple: gt
 }) {
-  const L = N(null), R = N(/* @__PURE__ */ new Map()), W = N(!1), Z = N(/* @__PURE__ */ new Set()), ct = N(0), ut = N(!0), K = N(
+  const N = T(null), V = T(/* @__PURE__ */ new Map()), Z = T(!1), K = T(/* @__PURE__ */ new Set()), mt = T(0), bt = T(!0), J = T(
     null
-  ), xt = N(null), F = N(null), J = N(null), D = Tt(), M = rt.useMemo(() => t.flatMap((e) => e.data), [t]), wt = rt.useMemo(() => {
+  ), Tt = T(null), F = T(null), Q = T(null), $ = Dt(), M = it.useMemo(() => t.flatMap((e) => e.data), [t]), kt = it.useMemo(() => {
     if (t.length > 0) {
       const e = t[t.length - 1];
       if (e.data.length > 0)
         return e.data[e.data.length - 1];
     }
-  }, [t]), [gt, Q] = at(() => {
-    if (!wt) return;
+  }, [t]), [ht, U] = st(() => {
+    if (!kt) return;
     const e = /* @__PURE__ */ new Map();
-    for (const n of t)
-      n.data.length > 0 && e.set(n.label, n.data[n.data.length - 1]);
+    for (const a of t)
+      a.data.length > 0 && e.set(a.label, a.data[a.data.length - 1]);
     return e;
-  }), [dt, A] = at(null), [ft, mt] = at([]);
-  $(() => {
+  }), [pt, I] = st(null), [Ct, vt] = st([]);
+  E(() => {
     const e = () => {
-      if (L.current && F.current) {
-        const i = F.current.clientWidth, r = F.current.clientHeight;
-        L.current.resize(i, r), L.current.timeScale().fitContent();
+      if (N.current && F.current) {
+        const i = F.current.clientWidth, l = F.current.clientHeight;
+        N.current.resize(i, l), N.current.timeScale().fitContent();
       }
-    }, n = F.current, l = n ? new ResizeObserver(e) : null;
-    return n && l?.observe(n), () => {
-      n && l?.unobserve(n);
+    }, a = F.current, n = a ? new ResizeObserver(e) : null;
+    return a && n?.observe(a), () => {
+      a && n?.unobserve(a);
     };
-  }, []), $(() => {
-    if (!J.current || W.current) return;
-    const e = pt(), n = ht(
+  }, []), E(() => {
+    if (!Q.current || Z.current) return;
+    const e = yt(), a = Vt(
       "hsl(var(--foreground))",
       "rgb(0, 0, 0)"
-    ), l = Nt(J.current, {
+    ), n = $t(Q.current, {
       ...e,
       rightPriceScale: {
         ...e.rightPriceScale || {},
-        visible: !D,
-        textColor: n
+        visible: !$,
+        textColor: a
       },
-      ...j
+      ...B
     });
-    return L.current = l, W.current = !0, () => {
-      l.remove(), L.current = null, W.current = !1, R.current.clear();
+    return N.current = n, Z.current = !0, () => {
+      n.remove(), N.current = null, Z.current = !1, V.current.clear();
     };
-  }, [D, j]), $(() => {
-    const e = L.current;
+  }, [$, B]), E(() => {
+    const e = N.current;
     if (!e || t.length === 0) return;
-    const n = f === "time" ? Ct(f, M) : Ct(f), l = M.map((o) => o.value), {
-      formatter: i,
-      updateVisibleRange: r,
-      updateLastValues: s
-    } = Ft(l);
-    K.current = r, xt.current = s;
-    const u = t.filter((o) => o.data.length > 0).map((o) => o.data[o.data.length - 1].value);
-    s(u);
-    const w = pt();
+    const n = t.filter((o) => o.data.length > 0).length <= 1 ? dt : gt, i = m === "time" ? Lt(m, M) : Lt(m), l = M.map((o) => o.value), {
+      formatter: c,
+      updateVisibleRange: f,
+      updateLastValues: y
+    } = Yt(l, R, {
+      yScaleMin: n
+    });
+    J.current = f, Tt.current = y;
+    const h = t.filter((o) => o.data.length > 0).map((o) => o.data[o.data.length - 1].value);
+    y(h);
+    const w = yt();
     e.applyOptions({
       localization: {
         ...w.localization || {},
-        timeFormatter: n ? (
+        timeFormatter: i ? (
           // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
-          ((o) => n(parseFloat(o), void 0))
+          ((o) => i(parseFloat(o), void 0))
         ) : void 0
       },
       timeScale: {
         ...w.timeScale || {},
-        tickMarkFormatter: n ? (
+        tickMarkFormatter: i ? (
           // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
-          ((o) => n(parseFloat(o), void 0))
+          ((o) => i(parseFloat(o), void 0))
         ) : void 0,
         minBarSpacing: 0
       }
     });
-    const P = (M.length > 0 ? Math.min(...M.map((o) => o.value)) : 0) < 0, V = M.some((o) => o.value === 0), b = !P && V, c = t.length > 1 && !_, m = t.length > 1 && !_ || D, g = ht(
+    const C = (M.length > 0 ? Math.min(...M.map((o) => o.value)) : 0) < 0, d = M.some((o) => o.value === 0), g = !C && d, u = t.length > 1 && !k, v = t.length > 1 && !k || $, L = Vt(
       "hsl(var(--foreground))",
       "rgb(0, 0, 0)"
     );
     e.applyOptions({
       rightPriceScale: {
         ...w.rightPriceScale || {},
-        visible: !m,
-        textColor: g,
-        ...b && {
+        visible: !v,
+        textColor: L,
+        ...g && {
           scaleMargins: {
             top: 0.3,
             bottom: 0
@@ -222,79 +227,84 @@ function Qt({
         }
       }
     });
-    const C = new Set(R.current.keys()), T = new Set(t.map((o) => o.label));
-    for (const o of C)
-      if (!T.has(o)) {
-        const a = R.current.get(o);
-        a && (e.removeSeries(a), R.current.delete(o));
+    const z = new Set(V.current.keys()), tt = new Set(t.map((o) => o.label));
+    for (const o of z)
+      if (!tt.has(o)) {
+        const r = V.current.get(o);
+        r && (e.removeSeries(r), V.current.delete(o));
       }
-    const I = Mt(), H = [];
-    let G = 0;
+    const et = Ot(), ot = [];
+    let H = 0;
     for (let o = 0; o < t.length; o++) {
-      const a = t[o], ot = vt(o), O = a.color || ot.line;
-      let z, E;
-      if (a.color)
-        if (a.topColor && a.bottomColor)
-          z = a.topColor, E = a.bottomColor;
-        else if (a.topColor) {
-          const d = X(O);
-          z = a.topColor, E = d.bottomColor;
-        } else if (a.bottomColor)
-          z = X(O).topColor, E = a.bottomColor;
+      const r = t[o], at = Nt(o), W = r.lineColor ?? r.color ?? at.line;
+      let D, G;
+      if (r.lineColor ?? r.color)
+        if (r.topColor && r.bottomColor)
+          D = r.topColor, G = r.bottomColor;
+        else if (r.topColor) {
+          const s = _(W);
+          D = r.topColor, G = s.bottomColor;
+        } else if (r.bottomColor)
+          D = _(W).topColor, G = r.bottomColor;
         else {
-          const d = X(O);
-          z = d.topColor, E = d.bottomColor;
+          const s = _(W);
+          D = s.topColor, G = s.bottomColor;
         }
       else
-        z = a.topColor || ot.top, E = a.bottomColor || ot.bottom;
-      if (a.data.length === 0) {
-        const d = R.current.get(a.label);
-        d && (e.removeSeries(d), R.current.delete(a.label));
+        D = r.topColor || at.top, G = r.bottomColor || at.bottom;
+      if (r.data.length === 0) {
+        const s = V.current.get(r.label);
+        s && (e.removeSeries(s), V.current.delete(r.label));
         continue;
       }
-      const yt = (a.data.length > 0 ? Math.min(...a.data.map((d) => d.value)) : 0) < 0, Lt = a.data.some((d) => d.value === 0), Pt = !yt && Lt, nt = _ || !c || G === 0 ? "right" : `scale-${G}`;
-      c && H.push({
-        priceScaleId: nt || "right",
-        shouldPreventNegativeAxis: Pt,
-        seriesIndex: G
+      const It = (r.data.length > 0 ? Math.min(...r.data.map((s) => s.value)) : 0) < 0, Ft = r.data.some((s) => s.value === 0), zt = !It && Ft, St = k || !u || H === 0 ? "right" : `scale-${H}`;
+      u && ot.push({
+        priceScaleId: St || "right",
+        shouldPreventNegativeAxis: zt,
+        seriesIndex: H
       });
-      let B = R.current.get(a.label);
-      B ? (B.applyOptions({
-        lineColor: O,
-        topColor: z,
-        bottomColor: E,
-        priceScaleId: nt,
+      const wt = (k || !u) && n !== void 0 && typeof n == "number", Rt = {
+        lineColor: W,
+        topColor: D,
+        bottomColor: G,
+        priceScaleId: St,
         priceFormat: {
           type: "custom",
-          formatter: i
+          formatter: wt && typeof n == "number" ? (s) => c(
+            s < n ? n : s
+          ) : c
+        },
+        autoscaleInfoProvider: (s) => {
+          if (!wt) return s();
+          const lt = s();
+          if (lt?.priceRange) {
+            const Et = n;
+            lt.priceRange.minValue = Et;
+          }
+          return lt;
         }
-      }), B.setData(
-        a.data.map((d) => ({
-          ...d,
-          time: d.time
+      };
+      let O = V.current.get(r.label);
+      O ? (O.applyOptions(Rt), O.setData(
+        r.data.map((s) => ({
+          ...s,
+          time: s.time
         }))
-      )) : (B = e.addAreaSeries({
-        ...I,
-        lineColor: O,
-        topColor: z,
-        bottomColor: E,
-        priceScaleId: nt,
-        priceFormat: {
-          type: "custom",
-          formatter: i
-        }
-      }), B.setData(
-        a.data.map((d) => ({
-          ...d,
-          time: d.time
+      )) : (O = e.addAreaSeries({
+        ...et,
+        ...Rt
+      }), O.setData(
+        r.data.map((s) => ({
+          ...s,
+          time: s.time
         }))
-      ), R.current.set(a.label, B)), G++;
+      ), V.current.set(r.label, O)), H++;
     }
-    if (c && H.length > 0)
-      for (const o of H)
+    if (u && ot.length > 0)
+      for (const o of ot)
         try {
-          const a = e.priceScale(o.priceScaleId);
-          a && a.applyOptions({
+          const r = e.priceScale(o.priceScaleId);
+          r && r.applyOptions({
             visible: !1,
             autoScale: !0,
             scaleMargins: {
@@ -309,256 +319,263 @@ function Qt({
             borderVisible: !0,
             borderColor: "rgba(224, 227, 235, 0.1)",
             entireTextOnly: !1,
-            textColor: g
+            textColor: L
           });
-        } catch (a) {
+        } catch (r) {
           console.warn(
             `Failed to configure price scale ${o.priceScaleId} for series ${o.seriesIndex}:`,
-            a
+            r
           );
         }
-    else if (!c)
+    else if (!u)
       try {
         const o = e.priceScale("right");
         o && o.applyOptions({
-          visible: !D,
+          visible: !$,
           autoScale: !0,
           scaleMargins: {
             top: 0.1,
-            bottom: 0.1,
-            ...b && {
-              top: 0.3,
-              bottom: 0
+            // No bottom margin when yScaleMin is set so the scale doesn't extend below the minimum (avoids negative labels like -10M)
+            bottom: n !== void 0 || g ? 0 : 0.1,
+            ...g && {
+              top: 0.3
             }
           },
           alignLabels: !0,
           borderVisible: !0,
           borderColor: "rgba(224, 227, 235, 0.1)",
           entireTextOnly: !1,
-          textColor: g
+          textColor: L
         });
       } catch {
       }
-    const tt = new Set(t.map((o) => o.label)), Rt = tt.size !== Z.current.size || [...tt].some((o) => !Z.current.has(o)), Vt = M.length !== ct.current;
-    (ut.current || Rt || Vt || D) && (e.timeScale().fitContent(), ut.current = !1), Z.current = tt, ct.current = M.length;
-    const et = /* @__PURE__ */ new Map();
+    n !== void 0 && (k || !u) && e.applyOptions({
+      handleScroll: {
+        vertTouchDrag: !1
+      }
+    });
+    const nt = new Set(t.map((o) => o.label)), At = nt.size !== K.current.size || [...nt].some((o) => !K.current.has(o)), Mt = M.length !== mt.current;
+    (bt.current || At || Mt || $) && (e.timeScale().fitContent(), bt.current = !1), K.current = nt, mt.current = M.length;
+    const rt = /* @__PURE__ */ new Map();
     for (const o of t)
-      o.data.length > 0 && et.set(o.label, o.data[o.data.length - 1]);
-    Q(et.size > 0 ? et : void 0);
+      o.data.length > 0 && rt.set(o.label, o.data[o.data.length - 1]);
+    U(rt.size > 0 ? rt : void 0);
   }, [
     t,
     M,
-    f,
-    y,
-    D,
-    _
-  ]), $(() => {
-    const e = L.current;
+    m,
+    R,
+    $,
+    k,
+    dt,
+    gt
+  ]), E(() => {
+    const e = N.current;
     if (!e || t.length === 0) return;
-    const n = t.length === 1;
-    let l;
-    for (const r of t)
-      if (r.data.length > 0) {
-        l = r.data[r.data.length - 1].time;
+    const a = t.length === 1;
+    let n;
+    for (const l of t)
+      if (l.data.length > 0) {
+        n = l.data[l.data.length - 1].time;
         break;
       }
-    if (!l) return;
-    const i = (r) => {
-      const { time: s = l, seriesData: u, point: w } = r || {}, p = Array.from(R.current.values());
-      if (!w || !s) {
-        const b = /* @__PURE__ */ new Map();
-        for (const c of t)
-          c.data.length > 0 && b.set(c.label, c.data[c.data.length - 1]);
-        if (Q(b.size > 0 ? b : void 0), n)
-          A(null);
-        else if (p[0] && l) {
-          const m = e.timeScale().timeToCoordinate(l), g = t[0];
-          if (g.data.length > 0) {
-            const C = g.data[g.data.length - 1].value, T = p[0].priceToCoordinate(C);
-            m !== null && T !== null && A({ x: m, y: T });
+    if (!n) return;
+    const i = (l) => {
+      const { time: c = n, seriesData: f, point: y } = l || {}, h = Array.from(V.current.values());
+      if (!y || !c) {
+        const C = /* @__PURE__ */ new Map();
+        for (const d of t)
+          d.data.length > 0 && C.set(d.label, d.data[d.data.length - 1]);
+        if (U(C.size > 0 ? C : void 0), a || k)
+          I(null);
+        else if (h[0] && n) {
+          const g = e.timeScale().timeToCoordinate(n), u = t[0];
+          if (u.data.length > 0) {
+            const v = u.data[u.data.length - 1].value, L = h[0].priceToCoordinate(v);
+            g !== null && L !== null && I({ x: g, y: L });
           }
         }
         return;
       }
-      const P = /* @__PURE__ */ new Map();
-      let V;
-      for (let b = 0; b < t.length; b++) {
-        const c = t[b], m = p[b];
-        if (!m) continue;
-        const g = u?.get(m), C = g && "value" in g ? g.value : void 0, T = c.data[c.data.length - 1], I = C !== void 0 ? C : T?.value ?? 0;
-        b === 0 && (V = I), P.set(c.label, { value: I, time: s });
+      const w = /* @__PURE__ */ new Map();
+      let P;
+      for (let C = 0; C < t.length; C++) {
+        const d = t[C], g = h[C];
+        if (!g) continue;
+        const u = f?.get(g), v = u && "value" in u ? u.value : void 0, L = d.data[d.data.length - 1], z = v !== void 0 ? v : L?.value ?? 0;
+        C === 0 && (P = z), w.set(d.label, { value: z, time: c });
       }
-      if (Q(P), V !== void 0 && p[0]) {
-        const c = e.timeScale().timeToCoordinate(s), m = p[0].priceToCoordinate(V);
-        if (c !== null && m !== null) {
-          const g = F.current;
-          if (g) {
-            const C = g.querySelector(
+      if (U(w), P !== void 0 && h[0]) {
+        const d = e.timeScale().timeToCoordinate(c), g = h[0].priceToCoordinate(P);
+        if (d !== null && g !== null) {
+          const u = F.current;
+          if (u) {
+            const v = u.querySelector(
               ".LightweightChart"
             );
-            if (C) {
-              const T = C.getBoundingClientRect(), I = g.getBoundingClientRect(), H = c + (T.left - I.left), G = m + (T.top - I.top);
-              A({ x: H, y: G });
+            if (v) {
+              const L = v.getBoundingClientRect(), z = u.getBoundingClientRect(), tt = d + (L.left - z.left), et = g + (L.top - z.top);
+              I({ x: tt, y: et });
             } else
-              A({ x: c, y: m });
+              I({ x: d, y: g });
           } else
-            A({ x: c, y: m });
+            I({ x: d, y: g });
         } else
-          A(null);
+          I(null);
       } else
-        A(null);
+        I(null);
     };
-    return e.subscribeCrosshairMove(i), n || requestAnimationFrame(() => {
-      const r = Array.from(R.current.values());
-      if (r[0] && l && t[0]?.data.length > 0) {
-        const u = e.timeScale().timeToCoordinate(l), w = t[0].data[t[0].data.length - 1].value, p = r[0].priceToCoordinate(w);
-        u !== null && p !== null && A({ x: u, y: p });
+    return e.subscribeCrosshairMove(i), !a && !k && requestAnimationFrame(() => {
+      const l = Array.from(V.current.values());
+      if (l[0] && n && t[0]?.data.length > 0) {
+        const f = e.timeScale().timeToCoordinate(n), y = t[0].data[t[0].data.length - 1].value, h = l[0].priceToCoordinate(y);
+        f !== null && h !== null && I({ x: f, y: h });
       }
     }), () => {
       e.unsubscribeCrosshairMove(i);
     };
-  }, [t]), $(() => {
-    const e = L.current;
+  }, [t, k]), E(() => {
+    const e = N.current;
     if (!e || t.length === 0) return;
-    const n = e.timeScale(), l = Math.max(...t.map((r) => r.data.length)), i = () => {
-      if (l === 0) return;
-      const r = n.getVisibleLogicalRange();
-      if (!r) return;
-      const s = {
+    const a = e.timeScale(), n = Math.max(...t.map((l) => l.data.length)), i = () => {
+      if (n === 0) return;
+      const l = a.getVisibleLogicalRange();
+      if (!l) return;
+      const c = {
         from: 0,
-        to: l - 1
-      }, u = typeof r.from == "number" ? r.from : 0, w = typeof r.to == "number" ? r.to : l - 1;
-      if (K.current) {
-        const b = Math.max(0, Math.floor(u)), c = Math.min(l - 1, Math.ceil(w)), m = [];
-        for (const g of t)
-          for (let C = b; C <= c && C < g.data.length; C++)
-            m.push(g.data[C].value);
-        m.length > 0 && K.current(m);
+        to: n - 1
+      }, f = typeof l.from == "number" ? l.from : 0, y = typeof l.to == "number" ? l.to : n - 1;
+      if (J.current) {
+        const C = Math.max(0, Math.floor(f)), d = Math.min(n - 1, Math.ceil(y)), g = [];
+        for (const u of t)
+          for (let v = C; v <= d && v < u.data.length; v++)
+            g.push(u.data[v].value);
+        g.length > 0 && J.current(g);
       }
-      const p = 0.01;
-      let P = !1;
-      const V = { ...r };
-      u < s.from - p && (V.from = s.from, P = !0), w > s.to + p && (V.to = s.to, P = !0), P && n.setVisibleLogicalRange(V);
+      const h = 0.01;
+      let w = !1;
+      const P = { ...l };
+      f < c.from - h && (P.from = c.from, w = !0), y > c.to + h && (P.to = c.to, w = !0), w && a.setVisibleLogicalRange(P);
     };
-    return n.subscribeVisibleLogicalRangeChange(i), () => {
-      n.unsubscribeVisibleLogicalRangeChange(
+    return a.subscribeVisibleLogicalRangeChange(i), () => {
+      a.unsubscribeVisibleLogicalRangeChange(
         i
       );
     };
-  }, [t]), $(() => {
-    const e = L.current, n = Array.from(R.current.values()), l = [];
-    if (e && n.length > 0 && x) {
-      const i = At(), r = n[0];
-      for (const s of x) {
-        const u = new Et(e, r, s.xCoordinate, {
+  }, [t]), E(() => {
+    const e = N.current, a = Array.from(V.current.values()), n = [];
+    if (e && a.length > 0 && S) {
+      const i = Bt(), l = a[0];
+      for (const c of S) {
+        const f = new Wt(e, l, c.xCoordinate, {
           ...i,
-          ...s.options || {}
+          ...c.options || {}
         });
-        r.attachPrimitive(u), l.push(u);
+        l.attachPrimitive(f), n.push(f);
       }
     }
     return () => {
-      if (n.length > 0) {
-        const i = n[0];
-        for (const r of l)
-          i.detachPrimitive(r);
+      if (a.length > 0) {
+        const i = a[0];
+        for (const l of n)
+          i.detachPrimitive(l);
       }
     };
-  }, [x]), $(() => {
-    const e = L.current;
-    if (!e || !x?.length) {
-      mt([]);
+  }, [S]), E(() => {
+    const e = N.current;
+    if (!e || !S?.length) {
+      vt([]);
       return;
     }
-    const n = () => {
-      const r = e.timeScale(), s = x.map((u) => r.timeToCoordinate(u.xCoordinate) ?? null);
-      mt(s);
+    const a = () => {
+      const l = e.timeScale(), c = S.map((f) => l.timeToCoordinate(f.xCoordinate) ?? null);
+      vt(c);
     };
-    n();
-    const l = e.timeScale(), i = () => {
-      n();
+    a();
+    const n = e.timeScale(), i = () => {
+      a();
     };
-    return l.subscribeVisibleLogicalRangeChange(i), () => {
-      l.unsubscribeVisibleLogicalRangeChange(i);
+    return n.subscribeVisibleLogicalRangeChange(i), () => {
+      n.unsubscribeVisibleLogicalRangeChange(i);
     };
-  }, [x]);
-  const U = t.length === 1, bt = rt.useMemo(() => {
-    if (U && t.length > 0) {
+  }, [S]);
+  const j = t.length === 1, xt = it.useMemo(() => {
+    if (j && t.length > 0) {
       const e = t[0];
       if (e.data.length > 0)
         return e.data[e.data.length - 1];
     }
-  }, [U, t]);
+  }, [j, t]);
   return /* @__PURE__ */ Y(
     "div",
     {
       ref: F,
-      className: st(
+      className: ft(
         "relative z-[1] w-full h-full overflow-hidden p-0",
-        S
+        x
       ),
       children: [
-        St && U && bt && /* @__PURE__ */ v(
-          It,
+        q != null && q !== !1 && j ? /* @__PURE__ */ p("div", { className: "absolute top-2 left-2 right-2 z-[100] pointer-events-none", children: /* @__PURE__ */ p("div", { className: "text-xl sm:text-2xl font-semibold text-foreground whitespace-nowrap overflow-hidden text-ellipsis", children: q }) }) : Pt && j && xt && /* @__PURE__ */ p(
+          jt,
           {
-            point: bt,
-            xMeasureUnit: f,
-            yMeasureUnit: y,
-            decimals: q
+            point: xt,
+            xMeasureUnit: m,
+            yMeasureUnit: R,
+            decimals: X
           }
         ),
-        gt && dt && /* @__PURE__ */ v(
-          zt,
+        ht && pt && /* @__PURE__ */ p(
+          Ht,
           {
-            points: gt,
-            xMeasureUnit: f,
-            yMeasureUnit: y,
+            points: ht,
+            xMeasureUnit: m,
+            yMeasureUnit: R,
             series: t,
-            position: dt,
+            position: pt,
             containerRef: F,
-            decimals: q
+            decimals: X
           }
         ),
-        h && /* @__PURE__ */ v(Gt, { series: t, onUnselect: k }),
-        x && x.length > 0 && ft.length === x.length && /* @__PURE__ */ v(
+        b && /* @__PURE__ */ p(qt, { series: t, onUnselect: A }),
+        S && S.length > 0 && Ct.length === S.length && /* @__PURE__ */ p(
           "div",
           {
             className: "absolute inset-0 z-[5] pointer-events-none",
             "aria-hidden": !0,
-            children: x.map((e, n) => {
-              const l = ft[n], i = e.options ?? {}, r = i.showLabel !== !1;
-              if (l === null || !r) return null;
-              const { labelText: s, valueStr: u } = $t(
+            children: S.map((e, a) => {
+              const n = Ct[a], i = e.options ?? {}, l = i.showLabel !== !1;
+              if (n === null || !l) return null;
+              const { labelText: c, valueStr: f } = _t(
                 i,
-                y,
-                q
+                R,
+                X
               );
-              if (!(s || u)) return null;
-              const p = i.labelBackgroundColor ?? i.color ?? "hsl(var(--background))", P = i.labelTextColor ?? "hsl(var(--foreground))", V = `${String(e.xCoordinate)}-${s}`;
+              if (!(c || f)) return null;
+              const h = i.labelBackgroundColor ?? i.color ?? "hsl(var(--background))", w = i.labelTextColor ?? "hsl(var(--foreground))", P = `${String(e.xCoordinate)}-${c}`;
               return /* @__PURE__ */ Y(
                 "div",
                 {
                   className: "absolute top-2 px-2 py-1 rounded text-xs font-medium whitespace-nowrap shadow-sm border border-border",
                   style: {
-                    left: l,
+                    left: n,
                     transform: "translateX(-50%)",
-                    backgroundColor: p,
-                    color: P
+                    backgroundColor: h,
+                    color: w
                   },
                   children: [
-                    s && /* @__PURE__ */ v("span", { className: "block", children: s }),
-                    u && /* @__PURE__ */ v("span", { className: st("block", s && "mt-0.5"), children: u })
+                    c && /* @__PURE__ */ p("span", { className: "block", children: c }),
+                    f && /* @__PURE__ */ p("span", { className: ft("block", c && "mt-0.5"), children: f })
                   ]
                 },
-                V
+                P
               );
             })
           }
         ),
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ p(
           "div",
           {
-            ref: J,
+            ref: Q,
             className: "LightweightChart w-full h-full overflow-hidden"
           }
         )
@@ -566,40 +583,40 @@ function Qt({
     }
   );
 }
-function Gt({
+function qt({
   series: t,
-  onUnselect: S
+  onUnselect: x
 }) {
-  return /* @__PURE__ */ v("div", { className: "absolute top-0 left-2 z-[10] flex flex-wrap gap-2", children: t.map((h, k) => {
-    const f = vt(k), y = h.color || f.line, j = h.data.length === 0;
+  return /* @__PURE__ */ p("div", { className: "absolute top-0 left-2 z-[10] flex flex-wrap gap-2", children: t.map((b, A) => {
+    const m = Nt(A), R = (b.lineColor ?? b.color) || m.line, B = b.data.length === 0;
     return /* @__PURE__ */ Y(
       "div",
       {
-        className: st(
+        className: ft(
           "flex items-center gap-1.5 px-2 py-1 bg-background/80 backdrop-blur-sm rounded border border-border",
-          j && "opacity-50"
+          B && "opacity-50"
         ),
         children: [
-          /* @__PURE__ */ v(
+          /* @__PURE__ */ p(
             "div",
             {
               className: "w-3 h-3 rounded-sm",
-              style: { backgroundColor: y }
+              style: { backgroundColor: R }
             }
           ),
           /* @__PURE__ */ Y("span", { className: "text-[10px] sm:text-xs font-medium text-foreground", children: [
-            h.label,
-            j && " (no data)"
+            b.label,
+            B && " (no data)"
           ] }),
-          S && /* @__PURE__ */ v(
+          x && /* @__PURE__ */ p(
             "button",
             {
               type: "button",
-              onClick: (x) => {
-                x.stopPropagation(), S(h.label);
+              onClick: (S) => {
+                S.stopPropagation(), x(b.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 ${h.label}`,
+              "aria-label": `Remove ${b.label}`,
               children: /* @__PURE__ */ Y(
                 "svg",
                 {
@@ -615,9 +632,9 @@ function Gt({
                   className: "text-muted-foreground hover:text-foreground",
                   "aria-hidden": "true",
                   children: [
-                    /* @__PURE__ */ v("title", { children: "Close" }),
-                    /* @__PURE__ */ v("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-                    /* @__PURE__ */ v("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                    /* @__PURE__ */ p("title", { children: "Close" }),
+                    /* @__PURE__ */ p("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                    /* @__PURE__ */ p("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
                   ]
                 }
               )
@@ -625,13 +642,13 @@ function Gt({
           )
         ]
       },
-      h.label
+      b.label
     );
   }) });
 }
 export {
-  it as DEFAULT_SERIES_COLORS,
-  Qt as Graph,
-  vt as getSeriesColorPalette,
-  $t as getVerticalLineTooltipContent
+  ut as DEFAULT_SERIES_COLORS,
+  ce as Graph,
+  Nt as getSeriesColorPalette,
+  _t as getVerticalLineTooltipContent
 };