@gearbox-protocol/ui-kit 3.14.0-next.31 → 3.14.0-next.33

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

@@ -1,30 +1,79 @@
-import { jsxs as K, jsx as p } from "react/jsx-runtime";
-import { createChart as We, CrosshairMode as Ye, AreaSeries as Ge } from "lightweight-charts";
-import * as fe from "react";
-import { useRef as L, useState as de, useEffect as $ } from "react";
-import { useIsMobile as Be } from "../../hooks/use-media-query.js";
-import { cn as he } from "../../utils/cn.js";
-import { resolveCSSColor as Me, generateColorsFromBase as ee, hslToHex as je } from "../../utils/colors.js";
-import { getDefaultOptions as Pe, getDefaultSeries as He, getDefaultVerticalLine as _e } from "./default-config.js";
-import { getXFormatters as Te, createAdaptiveYAxisFormatter as Xe, formatExactValue as ge } from "./formatters.js";
-import { GraphCurrentValue as qe } from "./graph-current-value.js";
-import { GraphTooltip as Ke } from "./graph-tooltip.js";
-import { VertLine as Je } from "./plugins/vertical-line.js";
-function Qe(t, v, u) {
-  const D = t.labelText ?? "", g = t.value, N = g === void 0 ? "" : typeof g == "number" ? v === "$" ? `$${ge(g, void 0, u)}` : v === "%" ? `${ge(g, void 0, u)}%` : ge(
-    g,
-    v !== "none" && v !== "%" && v !== "$" ? v : void 0,
-    u
-  ) : String(g);
-  return { labelText: D, valueStr: N };
+import { jsxs as U, jsx as S } from "react/jsx-runtime";
+import { createChart as He, CrosshairMode as Xe, AreaSeries as qe, LineStyle as Ze } from "lightweight-charts";
+import * as ge from "react";
+import { useRef as I, useState as be, useEffect as L } from "react";
+import { useIsMobile as Ke } from "../../hooks/use-media-query.js";
+import { cn as Ce } from "../../utils/cn.js";
+import { resolveCSSColor as O, generateColorsFromBase as ne, hslToHex as Je } from "../../utils/colors.js";
+import { getDefaultOptions as De, getDefaultSeries as Qe, getDefaultVerticalLine as Oe } from "./default-config.js";
+import { getXFormatters as Be, createAdaptiveYAxisFormatter as Ue, formatExactValue as pe } from "./formatters.js";
+import { GraphCurrentValue as et } from "./graph-current-value.js";
+import { GraphTooltip as tt } from "./graph-tooltip.js";
+import { VertLine as ot } from "./plugins/vertical-line.js";
+class rt {
+  _yTop;
+  _yBottom;
+  _color;
+  constructor(c, s, b) {
+    this._yTop = c, this._yBottom = s, this._color = b;
+  }
+  draw(c) {
+    c.useBitmapCoordinateSpace((s) => {
+      const b = s.context, h = s.verticalPixelRatio, y = this._yTop === null ? 0 : this._yTop * h, z = this._yBottom === null ? s.bitmapSize.height : this._yBottom * h, p = Math.min(y, z), R = Math.max(y, z);
+      b.fillStyle = this._color, b.fillRect(0, p, s.bitmapSize.width, R - p);
+    });
+  }
+}
+class nt {
+  _source;
+  _yTop = null;
+  _yBottom = null;
+  constructor(c) {
+    this._source = c;
+  }
+  update() {
+    const c = this._source.series;
+    this._yTop = this._source.priceTop === void 0 ? null : c.priceToCoordinate(this._source.priceTop), this._yBottom = this._source.priceBottom === void 0 ? null : c.priceToCoordinate(this._source.priceBottom);
+  }
+  /** Draw beneath the series line/area so the data stays readable. */
+  zOrder() {
+    return "bottom";
+  }
+  renderer() {
+    return new rt(this._yTop, this._yBottom, this._source.color);
+  }
 }
-function Ze(t, v) {
-  for (let u = t.length - 1; u >= 0; u--)
-    if (Number(t[u].time) <= v)
-      return t[u].value;
+class at {
+  series;
+  priceTop;
+  priceBottom;
+  color;
+  _paneViews;
+  constructor(c, s, b, h) {
+    this.series = c, this.priceTop = s, this.priceBottom = b, this.color = h, this._paneViews = [new nt(this)];
+  }
+  updateAllViews() {
+    for (const c of this._paneViews) c.update();
+  }
+  paneViews() {
+    return this._paneViews;
+  }
+}
+function lt(t, c, s) {
+  const b = t.labelText ?? "", h = t.value, y = h === void 0 ? "" : typeof h == "number" ? c === "$" ? `$${pe(h, void 0, s)}` : c === "%" ? `${pe(h, void 0, s)}%` : pe(
+    h,
+    c !== "none" && c !== "%" && c !== "$" ? c : void 0,
+    s
+  ) : String(h);
+  return { labelText: b, valueStr: y };
+}
+function it(t, c) {
+  for (let s = t.length - 1; s >= 0; s--)
+    if (Number(t[s].time) <= c)
+      return t[s].value;
   return 0;
 }
-const me = [
+const ve = [
   // 0  green (emerald)
   {
     line: "#02c39a",
@@ -139,65 +188,67 @@ const me = [
     top: "rgba(71, 85, 105, 0.56)",
     bottom: "rgba(71, 85, 105, 0.04)"
   }
-], Ue = 137.5;
-function Le(t) {
-  if (t < me.length)
-    return me[t];
-  const u = (t - me.length) * Ue % 360, D = je(u, 70, 50), { topColor: g, bottomColor: N } = ee(D);
-  return { line: D, top: g, bottom: N };
+], st = 137.5;
+function Fe(t) {
+  if (t < ve.length)
+    return ve[t];
+  const s = (t - ve.length) * st % 360, b = Je(s, 70, 50), { topColor: h, bottomColor: y } = ne(b);
+  return { line: b, top: h, bottom: y };
 }
-function ht({
+function Nt({
   series: t,
-  className: v,
-  showLegend: u = !1,
-  onUnselectSeries: D,
-  xMeasureUnit: g = "time",
-  yMeasureUnit: N = "token",
-  optionsOverrides: _,
-  verticalLineOptions: x,
-  currentValueDecimals: te,
-  useSharedPriceScale: M = !1,
-  showCurrentValue: De = !0,
-  graphTitle: oe,
-  yScaleMin: be,
-  yScaleMinMultiple: pe,
-  visibleTimeFrom: E,
-  disableZoom: J = !1
+  className: c,
+  showLegend: s = !1,
+  onUnselectSeries: b,
+  xMeasureUnit: h = "time",
+  yMeasureUnit: y = "token",
+  optionsOverrides: z,
+  verticalLineOptions: p,
+  priceLineOptions: R,
+  zoneOptions: W,
+  currentValueDecimals: ae,
+  useSharedPriceScale: D = !1,
+  showCurrentValue: Ae = !0,
+  graphTitle: le,
+  yScaleMin: xe,
+  yScaleMinMultiple: Se,
+  visibleTimeFrom: j,
+  disableZoom: ee = !1
 }) {
-  const R = L(null), w = L(/* @__PURE__ */ new Map()), re = L(!1), ve = L(!0), ne = L(
+  const T = I(null), v = I(/* @__PURE__ */ new Map()), ie = I(!1), ye = I(!0), se = I(
     null
-  ), Ie = L(null), O = L(null), ae = L(null), Q = L(null), V = Be(), I = fe.useMemo(() => t.flatMap((e) => e.data), [t]), ze = fe.useMemo(() => {
+  ), Ie = I(null), H = I(null), ce = I(null), te = I(null), P = Ke(), $ = ge.useMemo(() => t.flatMap((e) => e.data), [t]), ze = ge.useMemo(() => {
     if (t.length > 0) {
       const e = t[t.length - 1];
       if (e.data.length > 0)
         return e.data[e.data.length - 1];
     }
-  }, [t]), [Ce, le] = de(() => {
+  }, [t]), [we, ue] = be(() => {
     if (!ze) 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]);
+    for (const l of t)
+      l.data.length > 0 && e.set(l.label, l.data[l.data.length - 1]);
     return e;
-  }), [xe, z] = de(null), [Se, Ne] = de([]);
-  $(() => {
+  }), [Ne, E] = be(null), [Ve, Re] = be([]);
+  L(() => {
     const e = () => {
       try {
-        if (R.current && O.current) {
-          const l = O.current.clientWidth, i = O.current.clientHeight;
-          R.current.resize(l, i);
+        if (T.current && H.current) {
+          const r = H.current.clientWidth, i = H.current.clientHeight;
+          T.current.resize(r, i);
         }
       } catch {
       }
-    }, a = O.current, r = a ? new ResizeObserver(e) : null;
-    return Q.current = r, a && r?.observe(a), () => {
-      a && r?.unobserve(a), r?.disconnect(), Q.current = null;
+    }, l = H.current, n = l ? new ResizeObserver(e) : null;
+    return te.current = n, l && n?.observe(l), () => {
+      l && n?.unobserve(l), n?.disconnect(), te.current = null;
     };
-  }, []), $(() => {
-    if (!ae.current || re.current) return;
-    const e = Pe(), a = Me(
+  }, []), L(() => {
+    if (!ce.current || ie.current) return;
+    const e = De(), l = O(
       "hsl(var(--foreground))",
       "rgb(0, 0, 0)"
-    ), r = J ? {
+    ), n = ee ? {
       handleScale: {
         mouseWheel: !1,
         pinch: !1,
@@ -210,29 +261,29 @@ function ht({
         horzTouchDrag: !1,
         vertTouchDrag: !1
       }
-    } : {}, l = We(ae.current, {
+    } : {}, r = He(ce.current, {
       ...e,
       rightPriceScale: {
         ...e.rightPriceScale || {},
-        visible: !V,
-        textColor: a
+        visible: !P,
+        textColor: l
       },
-      ...V && {
+      ...P && {
         crosshair: {
           ...e.crosshair,
-          mode: Ye.Magnet
+          mode: Xe.Magnet
         }
       },
-      ...r,
-      ..._
+      ...n,
+      ...z
     });
-    return R.current = l, re.current = !0, () => {
-      Q.current?.disconnect(), Q.current = null, l.remove(), R.current = null, re.current = !1, w.current.clear();
+    return T.current = r, ie.current = !0, () => {
+      te.current?.disconnect(), te.current = null, r.remove(), T.current = null, ie.current = !1, v.current.clear();
     };
-  }, [V, _, J]), $(() => {
-    const e = R.current;
+  }, [P, z, ee]), L(() => {
+    const e = T.current;
     e && e.applyOptions(
-      J ? {
+      ee ? {
         handleScale: {
           mouseWheel: !1,
           pinch: !1,
@@ -260,47 +311,47 @@ function ht({
         }
       }
     );
-  }, [J]), $(() => {
-    const e = R.current;
+  }, [ee]), L(() => {
+    const e = T.current;
     if (!e || t.length === 0) return;
-    const r = t.filter((o) => o.data.length > 0).length <= 1 ? be : pe, l = g === "time" ? Te(g, I) : Te(g), i = I.map((o) => o.value), {
-      formatter: c,
-      tickmarksFormatter: f,
-      updateVisibleRange: P,
-      updateLastValues: m
-    } = Xe(i, N, {
-      yScaleMin: r
+    const n = t.filter((o) => o.data.length > 0).length <= 1 ? xe : Se, r = h === "time" ? Be(h, $) : Be(h), i = $.map((o) => o.value), {
+      formatter: u,
+      tickmarksFormatter: d,
+      updateVisibleRange: B,
+      updateLastValues: g
+    } = Ue(i, y, {
+      yScaleMin: n
     });
-    ne.current = P, Ie.current = m;
-    const T = t.filter((o) => o.data.length > 0).map((o) => o.data[o.data.length - 1].value);
-    m(T);
-    const k = Pe();
+    se.current = B, Ie.current = g;
+    const F = t.filter((o) => o.data.length > 0).map((o) => o.data[o.data.length - 1].value);
+    g(F);
+    const M = De();
     e.applyOptions({
       localization: {
-        ...k.localization || {},
+        ...M.localization || {},
         // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
         timeFormatter: (o) => (
           // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
-          l.timeFormatter(parseFloat(o), void 0)
+          r.timeFormatter(parseFloat(o), void 0)
         )
       },
       timeScale: {
-        ...k.timeScale || {},
+        ...M.timeScale || {},
         // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
-        tickMarkFormatter: l.tickMarkFormatter,
+        tickMarkFormatter: r.tickMarkFormatter,
         minBarSpacing: 0
       }
     });
-    const d = (I.length > 0 ? Math.min(...I.map((o) => o.value)) : 0) < 0, S = I.some((o) => o.value === 0), h = !d && S, C = t.length > 1 && !M, b = t.length > 1 && !M || V, A = Me(
+    const m = ($.length > 0 ? Math.min(...$.map((o) => o.value)) : 0) < 0, N = $.some((o) => o.value === 0), C = !m && N, w = t.length > 1 && !D, x = t.length > 1 && !D || P, Y = O(
       "hsl(var(--foreground))",
       "rgb(0, 0, 0)"
     );
     e.applyOptions({
       rightPriceScale: {
-        ...k.rightPriceScale || {},
-        visible: !b,
-        textColor: A,
-        ...h && {
+        ...M.rightPriceScale || {},
+        visible: !x,
+        textColor: Y,
+        ...C && {
           scaleMargins: {
             top: 0.3,
             bottom: 0
@@ -308,86 +359,102 @@ function ht({
         }
       }
     });
-    const X = new Set(w.current.keys()), se = new Set(t.map((o) => o.label));
-    for (const o of X)
-      if (!se.has(o)) {
-        const n = w.current.get(o);
-        n && (e.removeSeries(n), w.current.delete(o));
+    const J = new Set(v.current.keys()), fe = new Set(t.map((o) => o.label));
+    for (const o of J)
+      if (!fe.has(o)) {
+        const a = v.current.get(o);
+        a && (e.removeSeries(a), v.current.delete(o));
+      }
+    const We = Qe(), he = [];
+    let re = 0;
+    const Pe = t.find((o) => o.data.length > 0), Q = /* @__PURE__ */ new Map();
+    if (R && R.length > 0)
+      for (const o of R) {
+        if (!Number.isFinite(o.price)) continue;
+        const a = o.seriesLabel ?? Pe?.label;
+        if (!a) continue;
+        const V = Q.get(a) ?? [];
+        V.push(o.price), Q.set(a, V);
+      }
+    if (W && W.length > 0)
+      for (const o of W) {
+        const a = o.seriesLabel ?? Pe?.label;
+        if (!a) continue;
+        const V = Q.get(a) ?? [];
+        Number.isFinite(o.priceTop) && V.push(o.priceTop), Number.isFinite(o.priceBottom) && V.push(o.priceBottom), Q.set(a, V);
       }
-    const Ae = He(), ie = [];
-    let U = 0;
     for (let o = 0; o < t.length; o++) {
-      const n = t[o], q = Le(o), W = n.lineColor ?? n.color ?? q.line;
-      let F, Y;
-      if (n.lineColor ?? n.color)
-        if (n.topColor && n.bottomColor)
-          F = n.topColor, Y = n.bottomColor;
-        else if (n.topColor) {
-          const s = ee(W);
-          F = n.topColor, Y = s.bottomColor;
-        } else if (n.bottomColor)
-          F = ee(W).topColor, Y = n.bottomColor;
+      const a = t[o], V = Fe(o), X = a.lineColor ?? a.color ?? V.line;
+      let G, q;
+      if (a.lineColor ?? a.color)
+        if (a.topColor && a.bottomColor)
+          G = a.topColor, q = a.bottomColor;
+        else if (a.topColor) {
+          const f = ne(X);
+          G = a.topColor, q = f.bottomColor;
+        } else if (a.bottomColor)
+          G = ne(X).topColor, q = a.bottomColor;
         else {
-          const s = ee(W);
-          F = s.topColor, Y = s.bottomColor;
+          const f = ne(X);
+          G = f.topColor, q = f.bottomColor;
         }
       else
-        F = n.topColor || q.top, Y = n.bottomColor || q.bottom;
-      if (n.data.length === 0) {
-        const s = w.current.get(n.label);
-        s && (e.removeSeries(s), w.current.delete(n.label));
+        G = a.topColor || V.top, q = a.bottomColor || V.bottom;
+      if (a.data.length === 0) {
+        const f = v.current.get(a.label);
+        f && (e.removeSeries(f), v.current.delete(a.label));
         continue;
       }
-      const Fe = (n.data.length > 0 ? Math.min(...n.data.map((s) => s.value)) : 0) < 0, $e = n.data.some((s) => s.value === 0), Ee = !Fe && $e, Re = M || !C || U === 0 ? "right" : `scale-${U}`;
-      C && ie.push({
-        priceScaleId: Re || "right",
-        shouldPreventNegativeAxis: Ee,
-        seriesIndex: U
+      const $e = (a.data.length > 0 ? Math.min(...a.data.map((f) => f.value)) : 0) < 0, Ee = a.data.some((f) => f.value === 0), Ye = !$e && Ee, Me = D || !w || re === 0 ? "right" : `scale-${re}`;
+      w && he.push({
+        priceScaleId: Me || "right",
+        shouldPreventNegativeAxis: Ye,
+        seriesIndex: re
       });
-      const Ve = (M || !C) && r !== void 0 && typeof r == "number", ke = {
-        lineColor: W,
-        topColor: F,
-        bottomColor: Y,
-        priceScaleId: Re,
+      const _e = (D || !w) && n !== void 0 && typeof n == "number", Ge = Q.get(a.label) ?? [], ke = {
+        lineColor: X,
+        topColor: G,
+        bottomColor: q,
+        priceScaleId: Me,
         priceFormat: {
           type: "custom",
           minMove: 0.01,
-          formatter: Ve && typeof r == "number" ? (s) => c(
-            s < r ? r : s
-          ) : c,
-          tickmarksFormatter: f
+          formatter: _e && typeof n == "number" ? (f) => u(
+            f < n ? n : f
+          ) : u,
+          tickmarksFormatter: d
         },
-        autoscaleInfoProvider: (s) => {
-          if (!Ve) return s();
-          const j = s();
-          if (j?.priceRange) {
-            const H = r;
-            j.priceRange.minValue = H;
+        autoscaleInfoProvider: (f) => {
+          const k = f();
+          if (k?.priceRange) {
+            _e && (k.priceRange.minValue = n);
+            for (const A of Ge)
+              A < k.priceRange.minValue && (k.priceRange.minValue = A), A > k.priceRange.maxValue && (k.priceRange.maxValue = A);
           }
-          return j;
+          return k;
         }
       };
-      let G = w.current.get(n.label);
-      const B = n.data.map((s) => ({
-        ...s,
-        time: s.time
+      let Z = v.current.get(a.label);
+      const K = a.data.map((f) => ({
+        ...f,
+        time: f.time
       }));
-      if (E !== void 0 && B.length > 0 && Number(B[0].time) > E) {
-        const s = Number(B[0].time), j = s - E, H = 86400, Oe = j > 180 * H ? 7 * H : j > 30 * H ? H : 6 * 3600, ye = [];
-        for (let ue = E; ue < s; ue += Oe)
-          ye.push({ time: ue });
-        B.unshift(...ye);
+      if (j !== void 0 && K.length > 0 && Number(K[0].time) > j) {
+        const f = Number(K[0].time), k = f - j, A = 86400, je = k > 180 * A ? 7 * A : k > 30 * A ? A : 6 * 3600, Le = [];
+        for (let me = j; me < f; me += je)
+          Le.push({ time: me });
+        K.unshift(...Le);
       }
-      G ? (G.applyOptions(ke), G.setData(B)) : (G = e.addSeries(Ge, {
-        ...Ae,
+      Z ? (Z.applyOptions(ke), Z.setData(K)) : (Z = e.addSeries(qe, {
+        ...We,
         ...ke
-      }), G.setData(B), w.current.set(n.label, G)), U++;
+      }), Z.setData(K), v.current.set(a.label, Z)), re++;
     }
-    if (C && ie.length > 0)
-      for (const o of ie)
+    if (w && he.length > 0)
+      for (const o of he)
         try {
-          const n = e.priceScale(o.priceScaleId);
-          n && n.applyOptions({
+          const a = e.priceScale(o.priceScaleId);
+          a && a.applyOptions({
             visible: !1,
             autoScale: !0,
             scaleMargins: {
@@ -402,25 +469,25 @@ function ht({
             borderVisible: !0,
             borderColor: "rgba(224, 227, 235, 0.1)",
             entireTextOnly: !1,
-            textColor: A
+            textColor: Y
           });
-        } catch (n) {
+        } catch (a) {
           console.warn(
             `Failed to configure price scale ${o.priceScaleId} for series ${o.seriesIndex}:`,
-            n
+            a
           );
         }
-    else if (!C)
+    else if (!w)
       try {
         const o = e.priceScale("right");
         o && o.applyOptions({
-          visible: !V,
+          visible: !P,
           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: r !== void 0 || h ? 0 : 0.1,
-            ...h && {
+            bottom: n !== void 0 || C ? 0 : 0.1,
+            ...C && {
               top: 0.3
             }
           },
@@ -428,240 +495,294 @@ function ht({
           borderVisible: !0,
           borderColor: "rgba(224, 227, 235, 0.1)",
           entireTextOnly: !1,
-          textColor: A
+          textColor: Y
         });
       } catch {
       }
-    if (r !== void 0 && !V && (M || !C) && e.applyOptions({
+    if (n !== void 0 && !P && (D || !w) && e.applyOptions({
       handleScroll: {
         vertTouchDrag: !1
       }
-    }), I.length > 0) {
-      const o = I.map((F) => Number(F.time)), n = Math.min(...o), q = E !== void 0 ? Math.min(E, n) : n, W = Math.max(...o);
-      e.timeScale().setVisibleRange({ from: q, to: W });
+    }), $.length > 0) {
+      const o = $.map((G) => Number(G.time)), a = Math.min(...o), V = j !== void 0 ? Math.min(j, a) : a, X = Math.max(...o);
+      e.timeScale().setVisibleRange({ from: V, to: X });
     }
-    ve.current && (ve.current = !1);
-    const ce = /* @__PURE__ */ new Map();
+    ye.current && (ye.current = !1);
+    const de = /* @__PURE__ */ new Map();
     for (const o of t)
-      o.data.length > 0 && ce.set(o.label, o.data[o.data.length - 1]);
-    le(ce.size > 0 ? ce : void 0);
+      o.data.length > 0 && de.set(o.label, o.data[o.data.length - 1]);
+    ue(de.size > 0 ? de : void 0);
   }, [
     t,
-    I,
-    g,
-    N,
-    V,
-    M,
-    be,
-    pe,
-    E
-  ]), $(() => {
-    const e = R.current;
+    $,
+    h,
+    y,
+    P,
+    D,
+    xe,
+    Se,
+    j,
+    R,
+    W
+  ]), L(() => {
+    const e = T.current;
     if (!e || t.length === 0) return;
-    const a = t.length === 1;
-    let r;
+    const l = t.length === 1;
+    let n;
     for (const i of t)
       if (i.data.length > 0) {
-        r = i.data[i.data.length - 1].time;
+        n = i.data[i.data.length - 1].time;
         break;
       }
-    if (!r) return;
-    const l = (i) => {
-      const { time: c = r, seriesData: f, point: P } = i || {}, m = Array.from(w.current.values());
-      if (!P || !c) {
-        const y = /* @__PURE__ */ new Map();
-        for (const d of t)
-          d.data.length > 0 && y.set(d.label, d.data[d.data.length - 1]);
-        if (le(y.size > 0 ? y : void 0), a || M)
-          z(null);
-        else if (m[0] && r) {
-          const S = e.timeScale().timeToCoordinate(r), h = t[0];
-          if (h.data.length > 0) {
-            const C = h.data[h.data.length - 1].value, b = m[0].priceToCoordinate(C);
-            S !== null && b !== null && z({ x: S, y: b });
+    if (!n) return;
+    const r = (i) => {
+      const { time: u = n, seriesData: d, point: B } = i || {}, g = Array.from(v.current.values());
+      if (!B || !u) {
+        const _ = /* @__PURE__ */ new Map();
+        for (const m of t)
+          m.data.length > 0 && _.set(m.label, m.data[m.data.length - 1]);
+        if (ue(_.size > 0 ? _ : void 0), l || D)
+          E(null);
+        else if (g[0] && n) {
+          const N = e.timeScale().timeToCoordinate(n), C = t[0];
+          if (C.data.length > 0) {
+            const w = C.data[C.data.length - 1].value, x = g[0].priceToCoordinate(w);
+            N !== null && x !== null && E({ x: N, y: x });
           }
         }
         return;
       }
-      const T = /* @__PURE__ */ new Map();
-      let k;
-      for (let y = 0; y < t.length; y++) {
-        const d = t[y], S = m[y];
-        if (!S) continue;
-        const h = f?.get(S), C = h && "value" in h ? h.value : void 0;
-        let b;
-        if (C !== void 0)
-          b = C;
-        else if (a) {
-          const A = Number(c), X = d.data.length > 0 ? Number(d.data[0].time) : Number.POSITIVE_INFINITY;
-          A < X ? b = Number.NaN : b = d.data[d.data.length - 1]?.value ?? 0;
+      const F = /* @__PURE__ */ new Map();
+      let M;
+      for (let _ = 0; _ < t.length; _++) {
+        const m = t[_], N = g[_];
+        if (!N) continue;
+        const C = d?.get(N), w = C && "value" in C ? C.value : void 0;
+        let x;
+        if (w !== void 0)
+          x = w;
+        else if (l) {
+          const Y = Number(u), J = m.data.length > 0 ? Number(m.data[0].time) : Number.POSITIVE_INFINITY;
+          Y < J ? x = Number.NaN : x = m.data[m.data.length - 1]?.value ?? 0;
         } else
-          b = Ze(d.data, Number(c));
-        Number.isNaN(b) || (k === void 0 && (k = b), T.set(d.label, { value: b, time: c }));
+          x = it(m.data, Number(u));
+        Number.isNaN(x) || (M === void 0 && (M = x), F.set(m.label, { value: x, time: u }));
       }
-      if (le(T), k !== void 0 && m[0]) {
-        const d = e.timeScale().timeToCoordinate(c), S = m[0].priceToCoordinate(k);
-        if (d !== null && S !== null) {
-          const h = O.current;
-          if (h) {
-            const C = h.querySelector(
+      if (ue(F), M !== void 0 && g[0]) {
+        const m = e.timeScale().timeToCoordinate(u), N = g[0].priceToCoordinate(M);
+        if (m !== null && N !== null) {
+          const C = H.current;
+          if (C) {
+            const w = C.querySelector(
               ".LightweightChart"
             );
-            if (C) {
-              const b = C.getBoundingClientRect(), A = h.getBoundingClientRect(), X = d + (b.left - A.left), se = S + (b.top - A.top);
-              z({ x: X, y: se });
+            if (w) {
+              const x = w.getBoundingClientRect(), Y = C.getBoundingClientRect(), J = m + (x.left - Y.left), fe = N + (x.top - Y.top);
+              E({ x: J, y: fe });
             } else
-              z({ x: d, y: S });
+              E({ x: m, y: N });
           } else
-            z({ x: d, y: S });
+            E({ x: m, y: N });
         } else
-          z(null);
+          E(null);
       } else
-        z(null);
+        E(null);
     };
-    return e.subscribeCrosshairMove(l), V && e.subscribeClick(l), !a && !M && requestAnimationFrame(() => {
-      const i = Array.from(w.current.values());
-      if (i[0] && r && t[0]?.data.length > 0) {
-        const f = e.timeScale().timeToCoordinate(r), P = t[0].data[t[0].data.length - 1].value, m = i[0].priceToCoordinate(P);
-        f !== null && m !== null && z({ x: f, y: m });
+    return e.subscribeCrosshairMove(r), P && e.subscribeClick(r), !l && !D && requestAnimationFrame(() => {
+      const i = Array.from(v.current.values());
+      if (i[0] && n && t[0]?.data.length > 0) {
+        const d = e.timeScale().timeToCoordinate(n), B = t[0].data[t[0].data.length - 1].value, g = i[0].priceToCoordinate(B);
+        d !== null && g !== null && E({ x: d, y: g });
       }
     }), () => {
-      e.unsubscribeCrosshairMove(l), V && e.unsubscribeClick(l);
+      e.unsubscribeCrosshairMove(r), P && e.unsubscribeClick(r);
     };
-  }, [t, M, V]), $(() => {
-    const e = R.current;
+  }, [t, D, P]), L(() => {
+    const e = T.current;
     if (!e || t.length === 0) return;
-    const a = e.timeScale(), r = () => {
-      if (!ne.current) return;
-      const l = a.getVisibleRange();
-      if (!l) return;
-      const i = Number(l.from), c = Number(l.to), f = [];
-      for (const P of t)
-        for (const m of P.data) {
-          const T = Number(m.time);
-          T >= i && T <= c && f.push(m.value);
+    const l = e.timeScale(), n = () => {
+      if (!se.current) return;
+      const r = l.getVisibleRange();
+      if (!r) return;
+      const i = Number(r.from), u = Number(r.to), d = [];
+      for (const B of t)
+        for (const g of B.data) {
+          const F = Number(g.time);
+          F >= i && F <= u && d.push(g.value);
         }
-      f.length > 0 && ne.current(f);
+      d.length > 0 && se.current(d);
     };
-    return a.subscribeVisibleLogicalRangeChange(r), () => {
-      a.unsubscribeVisibleLogicalRangeChange(
-        r
+    return l.subscribeVisibleLogicalRangeChange(n), () => {
+      l.unsubscribeVisibleLogicalRangeChange(
+        n
       );
     };
-  }, [t]), $(() => {
-    const e = R.current, a = Array.from(w.current.values()), r = [];
-    if (e && a.length > 0 && x) {
-      const l = _e(), i = a[0];
-      for (const c of x) {
-        const f = new Je(e, i, c.xCoordinate, {
-          ...l,
-          ...c.options || {}
+  }, [t]), L(() => {
+    const e = T.current, l = Array.from(v.current.values()), n = [];
+    if (e && l.length > 0 && p) {
+      const r = Oe(), i = l[0];
+      for (const u of p) {
+        const d = new ot(e, i, u.xCoordinate, {
+          ...r,
+          ...u.options || {}
         });
-        i.attachPrimitive(f), r.push(f);
+        i.attachPrimitive(d), n.push(d);
       }
     }
     return () => {
-      if (a.length > 0) {
-        const l = a[0];
-        for (const i of r)
-          l.detachPrimitive(i);
+      if (l.length > 0) {
+        const r = l[0];
+        for (const i of n)
+          r.detachPrimitive(i);
       }
     };
-  }, [x, t]), $(() => {
-    const e = R.current;
-    if (!e || !x?.length) {
-      Ne([]);
+  }, [p, t]), L(() => {
+    const e = [];
+    if (R && R.length > 0) {
+      const l = Array.from(v.current.values())[0], n = O(
+        "hsl(var(--destructive))",
+        "rgb(239, 68, 68)"
+      );
+      for (const r of R) {
+        if (!Number.isFinite(r.price)) continue;
+        const i = r.seriesLabel ? v.current.get(r.seriesLabel) : l;
+        if (!i) continue;
+        const u = i.createPriceLine({
+          price: r.price,
+          color: r.color ? O(r.color, r.color) : n,
+          lineWidth: r.lineWidth ?? 1,
+          lineStyle: r.lineStyle ?? Ze.Dashed,
+          axisLabelVisible: r.axisLabelVisible ?? !0,
+          title: r.title ?? ""
+        });
+        e.push({ series: i, line: u });
+      }
+    }
+    return () => {
+      for (const { series: l, line: n } of e)
+        try {
+          l.removePriceLine(n);
+        } catch {
+        }
+    };
+  }, [R, t]), L(() => {
+    const e = [];
+    if (W && W.length > 0) {
+      const l = Array.from(v.current.values())[0], n = "rgba(239, 68, 68, 0.12)";
+      for (const r of W) {
+        const i = r.seriesLabel ? v.current.get(r.seriesLabel) : l;
+        if (!i) continue;
+        const u = r.color ? O(r.color, n) : n, d = new at(
+          i,
+          r.priceTop,
+          r.priceBottom,
+          u
+        );
+        i.attachPrimitive(d), e.push({ series: i, zone: d });
+      }
+    }
+    return () => {
+      for (const { series: l, zone: n } of e)
+        try {
+          l.detachPrimitive(n);
+        } catch {
+        }
+    };
+  }, [W, t]), L(() => {
+    const e = T.current;
+    if (!e || !p?.length) {
+      Re([]);
       return;
     }
-    const a = () => {
-      const i = e.timeScale(), c = x.map((f) => i.timeToCoordinate(f.xCoordinate) ?? null);
-      Ne(c);
+    const l = () => {
+      const i = e.timeScale(), u = p.map((d) => i.timeToCoordinate(d.xCoordinate) ?? null);
+      Re(u);
     };
-    a();
-    const r = e.timeScale(), l = () => {
-      a();
+    l();
+    const n = e.timeScale(), r = () => {
+      l();
     };
-    return r.subscribeVisibleLogicalRangeChange(l), () => {
-      r.unsubscribeVisibleLogicalRangeChange(l);
+    return n.subscribeVisibleLogicalRangeChange(r), () => {
+      n.unsubscribeVisibleLogicalRangeChange(r);
     };
-  }, [x, t]);
-  const Z = t.length === 1, we = fe.useMemo(() => {
-    if (Z && t.length > 0) {
+  }, [p, t]);
+  const oe = t.length === 1, Te = ge.useMemo(() => {
+    if (oe && t.length > 0) {
       const e = t[0];
       if (e.data.length > 0)
         return e.data[e.data.length - 1];
     }
-  }, [Z, t]);
-  return /* @__PURE__ */ K(
+  }, [oe, t]);
+  return /* @__PURE__ */ U(
     "div",
     {
-      ref: O,
-      className: he(
+      ref: H,
+      className: Ce(
         "relative z-[1] w-full h-full overflow-hidden p-0",
-        v
+        c
       ),
       children: [
-        oe != null && oe !== !1 && Z ? /* @__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: oe }) }) : De && Z && we && /* @__PURE__ */ p(
-          qe,
+        le != null && le !== !1 && oe ? /* @__PURE__ */ S("div", { className: "absolute top-2 left-2 right-2 z-[100] pointer-events-none", children: /* @__PURE__ */ S("div", { className: "text-xl sm:text-2xl font-semibold text-foreground whitespace-nowrap overflow-hidden text-ellipsis", children: le }) }) : Ae && oe && Te && /* @__PURE__ */ S(
+          et,
           {
-            point: we,
-            xMeasureUnit: g,
-            yMeasureUnit: N,
-            decimals: te
+            point: Te,
+            xMeasureUnit: h,
+            yMeasureUnit: y,
+            decimals: ae
           }
         ),
-        Ce && xe && /* @__PURE__ */ p(
-          Ke,
+        we && Ne && /* @__PURE__ */ S(
+          tt,
           {
-            points: Ce,
-            xMeasureUnit: g,
-            yMeasureUnit: N,
+            points: we,
+            xMeasureUnit: h,
+            yMeasureUnit: y,
             series: t,
-            position: xe,
-            containerRef: O,
-            decimals: te
+            position: Ne,
+            containerRef: H,
+            decimals: ae
           }
         ),
-        u && /* @__PURE__ */ p(et, { series: t, onUnselect: D }),
-        x && x.length > 0 && Se.length === x.length && /* @__PURE__ */ p(
+        s && /* @__PURE__ */ S(ct, { series: t, onUnselect: b }),
+        p && p.length > 0 && Ve.length === p.length && /* @__PURE__ */ S(
           "div",
           {
             className: "absolute inset-0 z-[5] pointer-events-none",
             "aria-hidden": !0,
-            children: x.map((e, a) => {
-              const r = Se[a], l = e.options ?? {}, i = l.showLabel !== !1;
-              if (r === null || !i) return null;
-              const { labelText: c, valueStr: f } = Qe(
-                l,
-                N,
-                te
+            children: p.map((e, l) => {
+              const n = Ve[l], r = e.options ?? {}, i = r.showLabel !== !1;
+              if (n === null || !i) return null;
+              const { labelText: u, valueStr: d } = lt(
+                r,
+                y,
+                ae
               );
-              if (!(c || f)) return null;
-              const m = l.labelBackgroundColor ?? l.color ?? "hsl(var(--background))", T = l.labelTextColor ?? "hsl(var(--foreground))", k = `${String(e.xCoordinate)}-${c}`;
-              return /* @__PURE__ */ K(
+              if (!(u || d)) return null;
+              const g = r.labelBackgroundColor ?? r.color ?? "hsl(var(--background))", F = r.labelTextColor ?? "hsl(var(--foreground))", M = `${String(e.xCoordinate)}-${u}`;
+              return /* @__PURE__ */ U(
                 "div",
                 {
                   className: "absolute top-2 px-2 py-1 rounded text-xs font-medium whitespace-nowrap shadow-sm border border-border",
                   style: {
-                    left: r,
+                    left: n,
                     transform: "translateX(-50%)",
-                    backgroundColor: m,
-                    color: T
+                    backgroundColor: g,
+                    color: F
                   },
                   children: [
-                    c && /* @__PURE__ */ p("span", { className: "block", children: c }),
-                    f && /* @__PURE__ */ p("span", { className: he("block", c && "mt-0.5"), children: f })
+                    u && /* @__PURE__ */ S("span", { className: "block", children: u }),
+                    d && /* @__PURE__ */ S("span", { className: Ce("block", u && "mt-0.5"), children: d })
                   ]
                 },
-                k
+                M
               );
             })
           }
         ),
-        /* @__PURE__ */ p(
+        /* @__PURE__ */ S(
           "div",
           {
-            ref: ae,
+            ref: ce,
             className: "LightweightChart w-full h-full overflow-hidden"
           }
         )
@@ -669,41 +790,41 @@ function ht({
     }
   );
 }
-function et({
+function ct({
   series: t,
-  onUnselect: v
+  onUnselect: c
 }) {
-  return /* @__PURE__ */ p("div", { className: "absolute top-0 left-2 z-[10] flex flex-wrap gap-2", children: t.map((u, D) => {
-    const g = Le(D), N = (u.lineColor ?? u.color) || g.line, _ = u.data.length === 0;
-    return /* @__PURE__ */ K(
+  return /* @__PURE__ */ S("div", { className: "absolute top-0 left-2 z-[10] flex flex-wrap gap-2", children: t.map((s, b) => {
+    const h = Fe(b), y = (s.lineColor ?? s.color) || h.line, z = s.data.length === 0;
+    return /* @__PURE__ */ U(
       "div",
       {
-        className: he(
+        className: Ce(
           "flex items-center gap-1.5 px-2 py-1 bg-background/80 backdrop-blur-sm rounded border border-border",
-          _ && "opacity-50"
+          z && "opacity-50"
         ),
         children: [
-          /* @__PURE__ */ p(
+          /* @__PURE__ */ S(
             "div",
             {
               className: "w-3 h-3 rounded-sm",
-              style: { backgroundColor: N }
+              style: { backgroundColor: y }
             }
           ),
-          /* @__PURE__ */ K("span", { className: "text-[10px] sm:text-xs font-medium text-foreground", children: [
-            u.label,
-            _ && " (no data)"
+          /* @__PURE__ */ U("span", { className: "text-[10px] sm:text-xs font-medium text-foreground", children: [
+            s.label,
+            z && " (no data)"
           ] }),
-          v && /* @__PURE__ */ p(
+          c && /* @__PURE__ */ S(
             "button",
             {
               type: "button",
-              onClick: (x) => {
-                x.stopPropagation(), v(u.label);
+              onClick: (p) => {
+                p.stopPropagation(), c(s.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 ${u.label}`,
-              children: /* @__PURE__ */ K(
+              "aria-label": `Remove ${s.label}`,
+              children: /* @__PURE__ */ U(
                 "svg",
                 {
                   xmlns: "http://www.w3.org/2000/svg",
@@ -718,9 +839,9 @@ function et({
                   className: "text-muted-foreground hover:text-foreground",
                   "aria-hidden": "true",
                   children: [
-                    /* @__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" })
+                    /* @__PURE__ */ S("title", { children: "Close" }),
+                    /* @__PURE__ */ S("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                    /* @__PURE__ */ S("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
                   ]
                 }
               )
@@ -728,14 +849,14 @@ function et({
           )
         ]
       },
-      u.label
+      s.label
     );
   }) });
 }
 export {
-  me as DEFAULT_SERIES_COLORS,
-  ht as Graph,
-  Le as getSeriesColorPalette,
-  Ze as getStepForwardValue,
-  Qe as getVerticalLineTooltipContent
+  ve as DEFAULT_SERIES_COLORS,
+  Nt as Graph,
+  Fe as getSeriesColorPalette,
+  it as getStepForwardValue,
+  lt as getVerticalLineTooltipContent
 };