@gearbox-protocol/ui-kit 2.1.0-next.1

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

@@ -0,0 +1,678 @@
+import { jsxs as j, jsx as h } from "react/jsx-runtime";
+import { createChart as It, CrosshairMode as zt, AreaSeries as $t } from "lightweight-charts";
+import * as lt from "react";
+import { useRef as M, useState as it, useEffect as D } from "react";
+import { useIsMobile as Dt } from "../../hooks/use-media-query.js";
+import { cn as ut } from "../../utils/cn.js";
+import { resolveCSSColor as wt, generateColorsFromBase as q, hslToHex as Et } from "../../utils/colors.js";
+import { getDefaultOptions as Rt, getDefaultSeries as Gt, getDefaultVerticalLine as Ot } from "./default-config.js";
+import { getXFormatters as yt, createAdaptiveYAxisFormatter as Bt, formatExactValue as st } from "./formatters.js";
+import { GraphCurrentValue as Yt } from "./graph-current-value.js";
+import { GraphTooltip as Ht } from "./graph-tooltip.js";
+import { VertLine as jt } from "./plugins/vertical-line.js";
+function Wt(e, v, m) {
+  const A = e.labelText ?? "", f = e.value, S = f === void 0 ? "" : typeof f == "number" ? v === "$" ? `$${st(f, void 0, m)}` : v === "%" ? `${st(f, void 0, m)}%` : st(
+    f,
+    v !== "none" && v !== "%" && v !== "$" ? v : void 0,
+    m
+  ) : String(f);
+  return { labelText: A, valueStr: S };
+}
+const ct = [
+  // 0  green (emerald)
+  {
+    line: "#02c39a",
+    top: "rgba(2, 195, 154, 0.56)",
+    bottom: "rgba(2, 195, 154, 0.04)"
+  },
+  // 1  blue
+  {
+    line: "#3b82f6",
+    top: "rgba(59, 130, 246, 0.56)",
+    bottom: "rgba(59, 130, 246, 0.04)"
+  },
+  // 2  red
+  {
+    line: "#ef4444",
+    top: "rgba(239, 68, 68, 0.56)",
+    bottom: "rgba(239, 68, 68, 0.04)"
+  },
+  // 3  amber
+  {
+    line: "#f59e0b",
+    top: "rgba(245, 158, 11, 0.56)",
+    bottom: "rgba(245, 158, 11, 0.04)"
+  },
+  // 4  violet
+  {
+    line: "#8b5cf6",
+    top: "rgba(139, 92, 246, 0.56)",
+    bottom: "rgba(139, 92, 246, 0.04)"
+  },
+  // 5  pink
+  {
+    line: "#ec4899",
+    top: "rgba(236, 72, 153, 0.56)",
+    bottom: "rgba(236, 72, 153, 0.04)"
+  },
+  // 6  cyan
+  {
+    line: "#06b6d4",
+    top: "rgba(6, 182, 212, 0.56)",
+    bottom: "rgba(6, 182, 212, 0.04)"
+  },
+  // 7  orange
+  {
+    line: "#ea580c",
+    top: "rgba(234, 88, 12, 0.56)",
+    bottom: "rgba(234, 88, 12, 0.04)"
+  },
+  // 8  lime
+  {
+    line: "#84cc16",
+    top: "rgba(132, 204, 22, 0.56)",
+    bottom: "rgba(132, 204, 22, 0.04)"
+  },
+  // 9  fuchsia
+  {
+    line: "#d946ef",
+    top: "rgba(217, 70, 239, 0.56)",
+    bottom: "rgba(217, 70, 239, 0.04)"
+  },
+  // 10 sky
+  {
+    line: "#0ea5e9",
+    top: "rgba(14, 165, 233, 0.56)",
+    bottom: "rgba(14, 165, 233, 0.04)"
+  },
+  // 11 teal
+  {
+    line: "#14b8a6",
+    top: "rgba(20, 184, 166, 0.56)",
+    bottom: "rgba(20, 184, 166, 0.04)"
+  },
+  // 12 yellow
+  {
+    line: "#eab308",
+    top: "rgba(234, 179, 8, 0.56)",
+    bottom: "rgba(234, 179, 8, 0.04)"
+  },
+  // 13 rose
+  {
+    line: "#f43f5e",
+    top: "rgba(244, 63, 94, 0.56)",
+    bottom: "rgba(244, 63, 94, 0.04)"
+  },
+  // 14 indigo
+  {
+    line: "#6366f1",
+    top: "rgba(99, 102, 241, 0.56)",
+    bottom: "rgba(99, 102, 241, 0.04)"
+  },
+  // 15 emerald
+  {
+    line: "#10b981",
+    top: "rgba(16, 185, 129, 0.56)",
+    bottom: "rgba(16, 185, 129, 0.04)"
+  },
+  // 16 warm-gray
+  {
+    line: "#78716c",
+    top: "rgba(120, 113, 108, 0.56)",
+    bottom: "rgba(120, 113, 108, 0.04)"
+  },
+  // 17 slate
+  {
+    line: "#64748b",
+    top: "rgba(100, 116, 139, 0.56)",
+    bottom: "rgba(100, 116, 139, 0.04)"
+  },
+  // 18 dark-slate
+  {
+    line: "#475569",
+    top: "rgba(71, 85, 105, 0.56)",
+    bottom: "rgba(71, 85, 105, 0.04)"
+  }
+], _t = 137.5;
+function Vt(e) {
+  if (e < ct.length)
+    return ct[e];
+  const m = (e - ct.length) * _t % 360, A = Et(m, 70, 50), { topColor: f, bottomColor: S } = q(A);
+  return { line: A, top: f, bottom: S };
+}
+function se({
+  series: e,
+  className: v,
+  showLegend: m = !1,
+  onUnselectSeries: A,
+  xMeasureUnit: f = "time",
+  yMeasureUnit: S = "token",
+  optionsOverrides: Y,
+  verticalLineOptions: C,
+  currentValueDecimals: Z,
+  useSharedPriceScale: V = !1,
+  showCurrentValue: kt = !0,
+  graphTitle: K,
+  yScaleMin: ft,
+  yScaleMinMultiple: dt
+}) {
+  const k = M(null), w = M(/* @__PURE__ */ new Map()), J = M(!1), gt = M(!0), Q = M(
+    null
+  ), Nt = M(null), $ = M(null), U = M(null), W = M(null), y = Dt(), I = lt.useMemo(() => e.flatMap((t) => t.data), [e]), Pt = lt.useMemo(() => {
+    if (e.length > 0) {
+      const t = e[e.length - 1];
+      if (t.data.length > 0)
+        return t.data[t.data.length - 1];
+    }
+  }, [e]), [mt, tt] = it(() => {
+    if (!Pt) return;
+    const t = /* @__PURE__ */ new Map();
+    for (const a of e)
+      a.data.length > 0 && t.set(a.label, a.data[a.data.length - 1]);
+    return t;
+  }), [bt, z] = it(null), [ht, pt] = it([]);
+  D(() => {
+    const t = () => {
+      try {
+        if (k.current && $.current) {
+          const l = $.current.clientWidth, s = $.current.clientHeight;
+          k.current.resize(l, s);
+        }
+      } catch {
+      }
+    }, a = $.current, r = a ? new ResizeObserver(t) : null;
+    return W.current = r, a && r?.observe(a), () => {
+      a && r?.unobserve(a), r?.disconnect(), W.current = null;
+    };
+  }, []), D(() => {
+    if (!U.current || J.current) return;
+    const t = Rt(), a = wt(
+      "hsl(var(--foreground))",
+      "rgb(0, 0, 0)"
+    ), r = It(U.current, {
+      ...t,
+      rightPriceScale: {
+        ...t.rightPriceScale || {},
+        visible: !y,
+        textColor: a
+      },
+      ...y && {
+        crosshair: {
+          ...t.crosshair,
+          mode: zt.Magnet
+        }
+      },
+      ...Y
+    });
+    return k.current = r, J.current = !0, () => {
+      W.current?.disconnect(), W.current = null, r.remove(), k.current = null, J.current = !1, w.current.clear();
+    };
+  }, [y, Y]), D(() => {
+    const t = k.current;
+    if (!t || e.length === 0) return;
+    const r = e.filter((o) => o.data.length > 0).length <= 1 ? ft : dt, l = f === "time" ? yt(f, I) : yt(f), s = I.map((o) => o.value), {
+      formatter: c,
+      tickmarksFormatter: u,
+      updateVisibleRange: N,
+      updateLastValues: d
+    } = Bt(s, S, {
+      yScaleMin: r
+    });
+    Q.current = N, Nt.current = d;
+    const P = e.filter((o) => o.data.length > 0).map((o) => o.data[o.data.length - 1].value);
+    d(P);
+    const L = Rt();
+    t.applyOptions({
+      localization: {
+        ...L.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)
+        )
+      },
+      timeScale: {
+        ...L.timeScale || {},
+        // biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
+        tickMarkFormatter: l.tickMarkFormatter,
+        minBarSpacing: 0
+      }
+    });
+    const g = (I.length > 0 ? Math.min(...I.map((o) => o.value)) : 0) < 0, x = I.some((o) => o.value === 0), b = !g && x, p = e.length > 1 && !V, T = e.length > 1 && !V || y, F = wt(
+      "hsl(var(--foreground))",
+      "rgb(0, 0, 0)"
+    );
+    t.applyOptions({
+      rightPriceScale: {
+        ...L.rightPriceScale || {},
+        visible: !T,
+        textColor: F,
+        ...b && {
+          scaleMargins: {
+            top: 0.3,
+            bottom: 0
+          }
+        }
+      }
+    });
+    const et = new Set(w.current.keys()), ot = new Set(e.map((o) => o.label));
+    for (const o of et)
+      if (!ot.has(o)) {
+        const n = w.current.get(o);
+        n && (t.removeSeries(n), w.current.delete(o));
+      }
+    const Lt = Gt(), rt = [];
+    let X = 0;
+    for (let o = 0; o < e.length; o++) {
+      const n = e[o], H = Vt(o), E = n.lineColor ?? n.color ?? H.line;
+      let G, O;
+      if (n.lineColor ?? n.color)
+        if (n.topColor && n.bottomColor)
+          G = n.topColor, O = n.bottomColor;
+        else if (n.topColor) {
+          const i = q(E);
+          G = n.topColor, O = i.bottomColor;
+        } else if (n.bottomColor)
+          G = q(E).topColor, O = n.bottomColor;
+        else {
+          const i = q(E);
+          G = i.topColor, O = i.bottomColor;
+        }
+      else
+        G = n.topColor || H.top, O = n.bottomColor || H.bottom;
+      if (n.data.length === 0) {
+        const i = w.current.get(n.label);
+        i && (t.removeSeries(i), w.current.delete(n.label));
+        continue;
+      }
+      const Tt = (n.data.length > 0 ? Math.min(...n.data.map((i) => i.value)) : 0) < 0, Ft = n.data.some((i) => i.value === 0), Mt = !Tt && Ft, Ct = V || !p || X === 0 ? "right" : `scale-${X}`;
+      p && rt.push({
+        priceScaleId: Ct || "right",
+        shouldPreventNegativeAxis: Mt,
+        seriesIndex: X
+      });
+      const xt = (V || !p) && r !== void 0 && typeof r == "number", St = {
+        lineColor: E,
+        topColor: G,
+        bottomColor: O,
+        priceScaleId: Ct,
+        priceFormat: {
+          type: "custom",
+          minMove: 0.01,
+          formatter: xt && typeof r == "number" ? (i) => c(
+            i < r ? r : i
+          ) : c,
+          tickmarksFormatter: u
+        },
+        autoscaleInfoProvider: (i) => {
+          if (!xt) return i();
+          const at = i();
+          if (at?.priceRange) {
+            const At = r;
+            at.priceRange.minValue = At;
+          }
+          return at;
+        }
+      };
+      let B = w.current.get(n.label);
+      B ? (B.applyOptions(St), B.setData(
+        n.data.map((i) => ({
+          ...i,
+          time: i.time
+        }))
+      )) : (B = t.addSeries($t, {
+        ...Lt,
+        ...St
+      }), B.setData(
+        n.data.map((i) => ({
+          ...i,
+          time: i.time
+        }))
+      ), w.current.set(n.label, B)), X++;
+    }
+    if (p && rt.length > 0)
+      for (const o of rt)
+        try {
+          const n = t.priceScale(o.priceScaleId);
+          n && n.applyOptions({
+            visible: !1,
+            autoScale: !0,
+            scaleMargins: {
+              top: 0.1,
+              bottom: 0.1,
+              ...o.shouldPreventNegativeAxis && {
+                top: 0.3,
+                bottom: 0
+              }
+            },
+            alignLabels: !0,
+            borderVisible: !0,
+            borderColor: "rgba(224, 227, 235, 0.1)",
+            entireTextOnly: !1,
+            textColor: F
+          });
+        } catch (n) {
+          console.warn(
+            `Failed to configure price scale ${o.priceScaleId} for series ${o.seriesIndex}:`,
+            n
+          );
+        }
+    else if (!p)
+      try {
+        const o = t.priceScale("right");
+        o && o.applyOptions({
+          visible: !y,
+          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 || b ? 0 : 0.1,
+            ...b && {
+              top: 0.3
+            }
+          },
+          alignLabels: !0,
+          borderVisible: !0,
+          borderColor: "rgba(224, 227, 235, 0.1)",
+          entireTextOnly: !1,
+          textColor: F
+        });
+      } catch {
+      }
+    if (r !== void 0 && !y && (V || !p) && t.applyOptions({
+      handleScroll: {
+        vertTouchDrag: !1
+      }
+    }), I.length > 0) {
+      const o = I.map((E) => Number(E.time)), n = Math.min(...o), H = Math.max(...o);
+      t.timeScale().setVisibleRange({ from: n, to: H });
+    }
+    gt.current && (gt.current = !1);
+    const nt = /* @__PURE__ */ new Map();
+    for (const o of e)
+      o.data.length > 0 && nt.set(o.label, o.data[o.data.length - 1]);
+    tt(nt.size > 0 ? nt : void 0);
+  }, [
+    e,
+    I,
+    f,
+    S,
+    y,
+    V,
+    ft,
+    dt
+  ]), D(() => {
+    const t = k.current;
+    if (!t || e.length === 0) return;
+    const a = e.length === 1;
+    let r;
+    for (const s of e)
+      if (s.data.length > 0) {
+        r = s.data[s.data.length - 1].time;
+        break;
+      }
+    if (!r) return;
+    const l = (s) => {
+      const { time: c = r, seriesData: u, point: N } = s || {}, d = Array.from(w.current.values());
+      if (!N || !c) {
+        const R = /* @__PURE__ */ new Map();
+        for (const g of e)
+          g.data.length > 0 && R.set(g.label, g.data[g.data.length - 1]);
+        if (tt(R.size > 0 ? R : void 0), a || V)
+          z(null);
+        else if (d[0] && r) {
+          const x = t.timeScale().timeToCoordinate(r), b = e[0];
+          if (b.data.length > 0) {
+            const p = b.data[b.data.length - 1].value, T = d[0].priceToCoordinate(p);
+            x !== null && T !== null && z({ x, y: T });
+          }
+        }
+        return;
+      }
+      const P = /* @__PURE__ */ new Map();
+      let L;
+      for (let R = 0; R < e.length; R++) {
+        const g = e[R], x = d[R];
+        if (!x) continue;
+        const b = u?.get(x), p = b && "value" in b ? b.value : void 0, T = g.data[g.data.length - 1], F = p !== void 0 ? p : T?.value ?? 0;
+        R === 0 && (L = F), P.set(g.label, { value: F, time: c });
+      }
+      if (tt(P), L !== void 0 && d[0]) {
+        const g = t.timeScale().timeToCoordinate(c), x = d[0].priceToCoordinate(L);
+        if (g !== null && x !== null) {
+          const b = $.current;
+          if (b) {
+            const p = b.querySelector(
+              ".LightweightChart"
+            );
+            if (p) {
+              const T = p.getBoundingClientRect(), F = b.getBoundingClientRect(), et = g + (T.left - F.left), ot = x + (T.top - F.top);
+              z({ x: et, y: ot });
+            } else
+              z({ x: g, y: x });
+          } else
+            z({ x: g, y: x });
+        } else
+          z(null);
+      } else
+        z(null);
+    };
+    return t.subscribeCrosshairMove(l), y && t.subscribeClick(l), !a && !V && requestAnimationFrame(() => {
+      const s = Array.from(w.current.values());
+      if (s[0] && r && e[0]?.data.length > 0) {
+        const u = t.timeScale().timeToCoordinate(r), N = e[0].data[e[0].data.length - 1].value, d = s[0].priceToCoordinate(N);
+        u !== null && d !== null && z({ x: u, y: d });
+      }
+    }), () => {
+      t.unsubscribeCrosshairMove(l), y && t.unsubscribeClick(l);
+    };
+  }, [e, V, y]), D(() => {
+    const t = k.current;
+    if (!t || e.length === 0) return;
+    const a = t.timeScale(), r = () => {
+      if (!Q.current) return;
+      const l = a.getVisibleRange();
+      if (!l) return;
+      const s = Number(l.from), c = Number(l.to), u = [];
+      for (const N of e)
+        for (const d of N.data) {
+          const P = Number(d.time);
+          P >= s && P <= c && u.push(d.value);
+        }
+      u.length > 0 && Q.current(u);
+    };
+    return a.subscribeVisibleLogicalRangeChange(r), () => {
+      a.unsubscribeVisibleLogicalRangeChange(
+        r
+      );
+    };
+  }, [e]), D(() => {
+    const t = k.current, a = Array.from(w.current.values()), r = [];
+    if (t && a.length > 0 && C) {
+      const l = Ot(), s = a[0];
+      for (const c of C) {
+        const u = new jt(t, s, c.xCoordinate, {
+          ...l,
+          ...c.options || {}
+        });
+        s.attachPrimitive(u), r.push(u);
+      }
+    }
+    return () => {
+      if (a.length > 0) {
+        const l = a[0];
+        for (const s of r)
+          l.detachPrimitive(s);
+      }
+    };
+  }, [C]), D(() => {
+    const t = k.current;
+    if (!t || !C?.length) {
+      pt([]);
+      return;
+    }
+    const a = () => {
+      const s = t.timeScale(), c = C.map((u) => s.timeToCoordinate(u.xCoordinate) ?? null);
+      pt(c);
+    };
+    a();
+    const r = t.timeScale(), l = () => {
+      a();
+    };
+    return r.subscribeVisibleLogicalRangeChange(l), () => {
+      r.unsubscribeVisibleLogicalRangeChange(l);
+    };
+  }, [C]);
+  const _ = e.length === 1, vt = lt.useMemo(() => {
+    if (_ && e.length > 0) {
+      const t = e[0];
+      if (t.data.length > 0)
+        return t.data[t.data.length - 1];
+    }
+  }, [_, e]);
+  return /* @__PURE__ */ j(
+    "div",
+    {
+      ref: $,
+      className: ut(
+        "relative z-[1] w-full h-full overflow-hidden p-0",
+        v
+      ),
+      children: [
+        K != null && K !== !1 && _ ? /* @__PURE__ */ h("div", { className: "absolute top-2 left-2 right-2 z-[100] pointer-events-none", children: /* @__PURE__ */ h("div", { className: "text-xl sm:text-2xl font-semibold text-foreground whitespace-nowrap overflow-hidden text-ellipsis", children: K }) }) : kt && _ && vt && /* @__PURE__ */ h(
+          Yt,
+          {
+            point: vt,
+            xMeasureUnit: f,
+            yMeasureUnit: S,
+            decimals: Z
+          }
+        ),
+        mt && bt && /* @__PURE__ */ h(
+          Ht,
+          {
+            points: mt,
+            xMeasureUnit: f,
+            yMeasureUnit: S,
+            series: e,
+            position: bt,
+            containerRef: $,
+            decimals: Z
+          }
+        ),
+        m && /* @__PURE__ */ h(Xt, { series: e, onUnselect: A }),
+        C && C.length > 0 && ht.length === C.length && /* @__PURE__ */ h(
+          "div",
+          {
+            className: "absolute inset-0 z-[5] pointer-events-none",
+            "aria-hidden": !0,
+            children: C.map((t, a) => {
+              const r = ht[a], l = t.options ?? {}, s = l.showLabel !== !1;
+              if (r === null || !s) return null;
+              const { labelText: c, valueStr: u } = Wt(
+                l,
+                S,
+                Z
+              );
+              if (!(c || u)) return null;
+              const d = l.labelBackgroundColor ?? l.color ?? "hsl(var(--background))", P = l.labelTextColor ?? "hsl(var(--foreground))", L = `${String(t.xCoordinate)}-${c}`;
+              return /* @__PURE__ */ j(
+                "div",
+                {
+                  className: "absolute top-2 px-2 py-1 rounded text-xs font-medium whitespace-nowrap shadow-sm border border-border",
+                  style: {
+                    left: r,
+                    transform: "translateX(-50%)",
+                    backgroundColor: d,
+                    color: P
+                  },
+                  children: [
+                    c && /* @__PURE__ */ h("span", { className: "block", children: c }),
+                    u && /* @__PURE__ */ h("span", { className: ut("block", c && "mt-0.5"), children: u })
+                  ]
+                },
+                L
+              );
+            })
+          }
+        ),
+        /* @__PURE__ */ h(
+          "div",
+          {
+            ref: U,
+            className: "LightweightChart w-full h-full overflow-hidden"
+          }
+        )
+      ]
+    }
+  );
+}
+function Xt({
+  series: e,
+  onUnselect: v
+}) {
+  return /* @__PURE__ */ h("div", { className: "absolute top-0 left-2 z-[10] flex flex-wrap gap-2", children: e.map((m, A) => {
+    const f = Vt(A), S = (m.lineColor ?? m.color) || f.line, Y = m.data.length === 0;
+    return /* @__PURE__ */ j(
+      "div",
+      {
+        className: ut(
+          "flex items-center gap-1.5 px-2 py-1 bg-background/80 backdrop-blur-sm rounded border border-border",
+          Y && "opacity-50"
+        ),
+        children: [
+          /* @__PURE__ */ h(
+            "div",
+            {
+              className: "w-3 h-3 rounded-sm",
+              style: { backgroundColor: S }
+            }
+          ),
+          /* @__PURE__ */ j("span", { className: "text-[10px] sm:text-xs font-medium text-foreground", children: [
+            m.label,
+            Y && " (no data)"
+          ] }),
+          v && /* @__PURE__ */ h(
+            "button",
+            {
+              type: "button",
+              onClick: (C) => {
+                C.stopPropagation(), v(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__ */ j(
+                "svg",
+                {
+                  xmlns: "http://www.w3.org/2000/svg",
+                  width: "12",
+                  height: "12",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  className: "text-muted-foreground hover:text-foreground",
+                  "aria-hidden": "true",
+                  children: [
+                    /* @__PURE__ */ h("title", { children: "Close" }),
+                    /* @__PURE__ */ h("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                    /* @__PURE__ */ h("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                  ]
+                }
+              )
+            }
+          )
+        ]
+      },
+      m.label
+    );
+  }) });
+}
+export {
+  ct as DEFAULT_SERIES_COLORS,
+  se as Graph,
+  Vt as getSeriesColorPalette,
+  Wt as getVerticalLineTooltipContent
+};

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

@@ -0,0 +1,29 @@
+import { DEFAULT_AREA_SERIES as r, DEFAULT_OPTIONS as o, DEFAULT_VERTICAL_LINE as a, getDefaultOptions as p, getDefaultSeries as i, getDefaultVerticalLine as E } from "./default-config.js";
+import { getXFormatter as l, getXFormatters as m, getYFormatter as L } from "./formatters.js";
+import { DEFAULT_SERIES_COLORS as V, Graph as h, getSeriesColorPalette as n, getVerticalLineTooltipContent as A } from "./graph.js";
+import { GraphCurrentValue as S } from "./graph-current-value.js";
+import { GraphTooltip as s } from "./graph-tooltip.js";
+import { GraphView as F, GraphViewWithData as _, graphViewVariants as u, useGraphAside as G } from "./graph-view.js";
+import { VertLine as I } from "./plugins/vertical-line.js";
+export {
+  r as DEFAULT_AREA_SERIES,
+  o as DEFAULT_OPTIONS,
+  V as DEFAULT_SERIES_COLORS,
+  a as DEFAULT_VERTICAL_LINE,
+  h as Graph,
+  S as GraphCurrentValue,
+  s as GraphTooltip,
+  F as GraphView,
+  _ as GraphViewWithData,
+  I as VertLine,
+  p as getDefaultOptions,
+  i as getDefaultSeries,
+  E as getDefaultVerticalLine,
+  n as getSeriesColorPalette,
+  A as getVerticalLineTooltipContent,
+  l as getXFormatter,
+  m as getXFormatters,
+  L as getYFormatter,
+  u as graphViewVariants,
+  G as useGraphAside
+};