@gearbox-protocol/ui-kit 4.0.0-next.9 → 4.0.0

package/dist/esm/components/dropdown-menu/dropdown-menu.js

@@ -1,16 +1,13 @@
-import { jsx as p } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import * as o from "@radix-ui/react-dropdown-menu";
-const e = ({
+const t = ({
   modal: r = !1,
   ...n
-}) => /* @__PURE__ */ p(o.Root, { modal: r, ...n });
-e.displayName = "DropdownMenu";
-const t = o.Trigger, d = o.Group, i = o.Portal, s = o.Sub, a = o.RadioGroup;
+}) => /* @__PURE__ */ e(o.Root, { modal: r, ...n });
+t.displayName = "DropdownMenu";
+const i = o.Trigger, s = o.Portal;
 export {
-  e as DropdownMenu,
-  d as DropdownMenuGroup,
-  i as DropdownMenuPortal,
-  a as DropdownMenuRadioGroup,
-  s as DropdownMenuSub,
-  t as DropdownMenuTrigger
+  t as DropdownMenu,
+  s as DropdownMenuPortal,
+  i as DropdownMenuTrigger
 };

package/dist/esm/components/dropdown-menu/index.js

@@ -1,27 +1,12 @@
-import { DropdownMenu as e, DropdownMenuGroup as n, DropdownMenuPortal as p, DropdownMenuRadioGroup as t, DropdownMenuSub as u, DropdownMenuTrigger as d } from "./dropdown-menu.js";
-import { DropdownMenuCheckboxItem as D } from "./dropdown-menu-checkbox-item.js";
-import { DropdownMenuContent as m } from "./dropdown-menu-content.js";
-import { DropdownMenuItem as f } from "./dropdown-menu-item.js";
-import { DropdownMenuLabel as b } from "./dropdown-menu-label.js";
-import { DropdownMenuRadioItem as g } from "./dropdown-menu-radio-item.js";
-import { DropdownMenuSeparator as C } from "./dropdown-menu-separator.js";
-import { DropdownMenuShortcut as c } from "./dropdown-menu-shortcut.js";
-import { DropdownMenuSubContent as l } from "./dropdown-menu-sub-content.js";
-import { DropdownMenuSubTrigger as R } from "./dropdown-menu-sub-trigger.js";
+import { DropdownMenu as e, DropdownMenuPortal as n, DropdownMenuTrigger as p } from "./dropdown-menu.js";
+import { DropdownMenuContent as d } from "./dropdown-menu-content.js";
+import { DropdownMenuItem as w } from "./dropdown-menu-item.js";
+import { DropdownMenuLabel as M } from "./dropdown-menu-label.js";
 export {
   e as DropdownMenu,
-  D as DropdownMenuCheckboxItem,
-  m as DropdownMenuContent,
-  n as DropdownMenuGroup,
-  f as DropdownMenuItem,
-  b as DropdownMenuLabel,
-  p as DropdownMenuPortal,
-  t as DropdownMenuRadioGroup,
-  g as DropdownMenuRadioItem,
-  C as DropdownMenuSeparator,
-  c as DropdownMenuShortcut,
-  u as DropdownMenuSub,
-  l as DropdownMenuSubContent,
-  R as DropdownMenuSubTrigger,
-  d as DropdownMenuTrigger
+  d as DropdownMenuContent,
+  w as DropdownMenuItem,
+  M as DropdownMenuLabel,
+  n as DropdownMenuPortal,
+  p as DropdownMenuTrigger
 };

package/dist/esm/components/edit-input/edit-input.js

@@ -1,18 +1,15 @@
 import { jsx as t } from "react/jsx-runtime";
-import { IconEditPen as z } from "@gearbox-protocol/static";
-import { cva as D } from "class-variance-authority";
+import { faArrowRight as z } from "@fortawesome/free-solid-svg-icons";
+import { IconEditPen as D } from "@gearbox-protocol/static";
+import { cva as K } from "class-variance-authority";
 import * as r from "react";
-import { faArrowRight as K } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as N } from "../icons/fa-icon.js";
 import { Input as L } from "../input/input.js";
 import { TextButton as M } from "../text-button/text-button.js";
-import "@gearbox-protocol/sdk";
 import { cn as f } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
-const S = D("", {
+const S = K("", {
   variants: {
     labelHeight: {
       xs: "h-auto",
@@ -30,9 +27,9 @@ const S = D("", {
   md: "default",
   lg: "lg"
 };
-function Y({
-  label: m,
-  value: c,
+function U({
+  label: c,
+  value: m,
   onChange: d,
   onSubmit: u,
   onEditModeChange: p,
@@ -75,7 +72,7 @@ function Y({
         L,
         {
           ref: n,
-          value: c,
+          value: m,
           size: V[s],
           colorTheme: x,
           onChange: d,
@@ -89,7 +86,7 @@ function Y({
           endingIcon: /* @__PURE__ */ t(
             N,
             {
-              icon: K,
+              icon: z,
               className: "size-[18px] text-primary",
               "aria-hidden": !0
             }
@@ -111,15 +108,15 @@ function Y({
         M,
         {
           ...h,
-          icon: /* @__PURE__ */ t(z, { size: 12, className: "mb-[3px] shrink-0", "aria-hidden": !0 }),
+          icon: /* @__PURE__ */ t(D, { size: 12, className: "mb-[3px] shrink-0", "aria-hidden": !0 }),
           tabIndex: -1,
           onClick: j,
-          children: m
+          children: c
         }
       )
     }
   );
 }
 export {
-  Y as EditInput
+  U as EditInput
 };

package/dist/esm/components/error-message/error-line-message.js

@@ -1,25 +1,21 @@
 import { jsxs as r } from "react/jsx-runtime";
-import "react";
-import "@gearbox-protocol/sdk";
-import { cn as e } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
+import { cn as i } from "../../utils/cn.js";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
-function g({
-  err: t,
-  title: o,
-  className: i
+function p({
+  err: e,
+  title: t,
+  className: o
 }) {
-  return /* @__PURE__ */ r("div", { className: e("text-destructive", i), children: [
+  return /* @__PURE__ */ r("div", { className: i("text-destructive", o), children: [
     /* @__PURE__ */ r("strong", { children: [
-      o ?? "Error",
+      t ?? "Error",
       ":"
     ] }),
     " ",
-    t.message
+    e.message
   ] });
 }
 export {
-  g as ErrorLineMessage
+  p as ErrorLineMessage
 };

package/dist/esm/components/error-message/index.js

@@ -1,6 +1,4 @@
 import { ErrorLineMessage as o } from "./error-line-message.js";
-import { ErrorMessage as a } from "./error-message.js";
 export {
-  o as ErrorLineMessage,
-  a as ErrorMessage
+  o as ErrorLineMessage
 };

package/dist/esm/components/fadeout-loading/fadeout-loading.js

@@ -1,24 +1,21 @@
-import { jsx as e } from "react/jsx-runtime";
-import * as s from "react";
-import "@gearbox-protocol/sdk";
+import { jsx as s } from "react/jsx-runtime";
+import * as p from "react";
 import { cn as n } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
-const d = s.forwardRef(
-  ({ className: t, loading: o, duration: a = 100, children: r, style: i, ...m }, p) => /* @__PURE__ */ e(
+const d = p.forwardRef(
+  ({ className: a, loading: o, duration: t = 100, children: r, style: i, ...e }, m) => /* @__PURE__ */ s(
     "span",
     {
-      ref: p,
-      className: n(t),
+      ref: m,
+      className: n(a),
       style: {
         opacity: o ? 0.5 : 1,
-        transition: `opacity ${a}ms ease-in-out`,
+        transition: `opacity ${t}ms ease-in-out`,
         ...i
       },
       "data-loading": o,
-      ...m,
+      ...e,
       children: r
     }
   )

package/dist/esm/components/formatted-number/formatted-number.js

@@ -1,14 +1,10 @@
 import { jsx as n, jsxs as i, Fragment as o } from "react/jsx-runtime";
 import { SimpleTooltip as g } from "../tooltip/simple-tooltip.js";
 import "../tooltip/tooltip.js";
-import "react";
-import "@gearbox-protocol/sdk";
 import { cn as u } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
-function w({
+function P({
   value: t,
   decimalPartLength: r = 4,
   hideZerosIfMore: p = 3,
@@ -55,5 +51,5 @@ function x({ zeroPart: t, repeats: r }) {
   ] });
 }
 export {
-  w as FormattedNumberString
+  P as FormattedNumberString
 };

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

@@ -0,0 +1,58 @@
+function c(t, r = "#000000") {
+  if (!t.includes("var("))
+    return t;
+  try {
+    const n = document.createElement("div");
+    n.style.color = t, n.style.display = "none", document.body.appendChild(n);
+    const e = window.getComputedStyle(n).color;
+    if (document.body.removeChild(n), e && e !== "rgba(0, 0, 0, 0)")
+      return e;
+  } catch (n) {
+    console.warn(`Failed to resolve CSS color: ${t}`, n);
+  }
+  return r;
+}
+function u(t, r) {
+  const n = parseInt(t.slice(1, 3), 16), e = parseInt(t.slice(3, 5), 16), s = parseInt(t.slice(5, 7), 16);
+  return `rgba(${n}, ${e}, ${s}, ${r})`;
+}
+function g(t) {
+  if (t.startsWith("rgba")) {
+    const r = t.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);
+    if (r) {
+      const [, n, e, s] = r;
+      return {
+        topColor: `rgba(${n}, ${e}, ${s}, 0.56)`,
+        bottomColor: `rgba(${n}, ${e}, ${s}, 0.04)`
+      };
+    }
+  }
+  if (t.startsWith("#") && (t.length === 7 || t.length === 4)) {
+    const r = t.length === 4 ? `#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}` : t;
+    return {
+      topColor: u(r, 0.56),
+      bottomColor: u(r, 0.04)
+    };
+  }
+  return {
+    topColor: t,
+    bottomColor: t
+  };
+}
+function m(t, r, n) {
+  r /= 100, n /= 100;
+  const e = (1 - Math.abs(2 * n - 1)) * r, s = e * (1 - Math.abs(t / 60 % 2 - 1)), d = n - e / 2;
+  let o = 0, a = 0, i = 0;
+  t < 60 ? (o = e, a = s) : t < 120 ? (o = s, a = e) : t < 180 ? (a = e, i = s) : t < 240 ? (a = s, i = e) : t < 300 ? (o = s, i = e) : (o = e, i = s);
+  const l = ($) => {
+    const b = Math.round(($ + d) * 255);
+    return Math.min(255, Math.max(0, b)).toString(16).padStart(2, "0");
+  };
+  return `#${l(o)}${l(a)}${l(i)}`;
+}
+export {
+  g as generateColorsFromBase,
+  u as hexToRgba,
+  m as hslToHex,
+  c as resolveCSSColor
+};

package/dist/esm/components/graph/default-config.js

@@ -1,17 +1,14 @@
-import { resolveCSSColor as o } from "../../utils/colors.js";
-const e = {
+import { resolveCSSColor as o } from "./colors.js";
+const r = {
   topColor: "rgba(76, 175, 80, 0.56)",
   bottomColor: "rgba(76, 175, 80, 0.04)",
   lineColor: "#02c39a",
-  lineWidth: 2
-}, s = {
-  showLabel: !0,
-  color: "#02c39a",
-  labelBackgroundColor: "#02c39a",
-  width: 2
-}, l = 'Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif', t = 14;
-function b() {
-  const r = o(
+  lineWidth: 2,
+  lastValueVisible: !1,
+  priceLineVisible: !1
+}, a = 'Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif', l = 14, t = 5, n = Math.ceil(l / 2) + 2, b = l + 6, c = 40;
+function u() {
+  const e = o(
     "hsl(var(--muted-foreground))",
     "rgb(163, 163, 163)"
   ), i = o("hsl(var(--card))", "rgb(24, 24, 24)");
@@ -26,6 +23,16 @@ function b() {
       // and legend appears). Avoids range shrinking to a few days.
       lockVisibleTimeRangeOnResize: !0
     },
+    leftPriceScale: {
+      visible: !1,
+      autoScale: !0,
+      alignLabels: !0,
+      borderVisible: !0,
+      borderColor: "rgba(224, 227, 235, 0.1)",
+      entireTextOnly: !1,
+      tickMarkDensity: t,
+      textColor: e
+    },
     rightPriceScale: {
       visible: !0,
       autoScale: !0,
@@ -33,15 +40,16 @@ function b() {
       borderVisible: !0,
       borderColor: "rgba(224, 227, 235, 0.1)",
       entireTextOnly: !1,
-      textColor: r
+      tickMarkDensity: t,
+      textColor: e
     },
     layout: {
       background: {
         color: i
       },
-      textColor: r,
-      fontSize: t,
-      fontFamily: l
+      textColor: e,
+      fontSize: l,
+      fontFamily: a
     },
     crosshair: {
       horzLine: {
@@ -67,74 +75,32 @@ function b() {
     }
   };
 }
-function n() {
+function f() {
   return {
     topColor: "rgba(76, 175, 80, 0.56)",
     bottomColor: "rgba(76, 175, 80, 0.04)",
-    lineColor: e.lineColor,
-    lineWidth: 2
+    lineColor: r.lineColor,
+    lineWidth: 2,
+    lastValueVisible: !1,
+    priceLineVisible: !1
   };
 }
-function c() {
+function g() {
   return {
     showLabel: !0,
-    color: e.lineColor,
-    labelBackgroundColor: e.lineColor,
+    color: r.lineColor,
+    labelBackgroundColor: r.lineColor,
     width: 2
   };
 }
-const u = {
-  timeScale: {
-    borderVisible: !0,
-    borderColor: "rgba(224, 227, 235, 0.1)",
-    visible: !0,
-    fixLeftEdge: !0,
-    fixRightEdge: !0
-  },
-  rightPriceScale: {
-    visible: !0,
-    autoScale: !0,
-    alignLabels: !0,
-    borderVisible: !0,
-    borderColor: "rgba(224, 227, 235, 0.1)",
-    entireTextOnly: !1
-  },
-  layout: {
-    background: {
-      color: "transparent"
-    },
-    textColor: "rgb(163, 163, 163)",
-    fontSize: t,
-    fontFamily: l
-  },
-  crosshair: {
-    horzLine: {
-      width: 2,
-      color: "rgba(224, 227, 235, 0.1)",
-      style: 0,
-      labelVisible: !1
-    },
-    vertLine: {
-      width: 2,
-      color: "rgba(224, 227, 235, 0.1)",
-      style: 0,
-      labelVisible: !1
-    }
-  },
-  grid: {
-    vertLines: {
-      visible: !1
-    },
-    horzLines: {
-      visible: !1
-    }
-  }
-};
 export {
-  e as DEFAULT_AREA_SERIES,
-  u as DEFAULT_OPTIONS,
-  s as DEFAULT_VERTICAL_LINE,
-  b as getDefaultOptions,
-  n as getDefaultSeries,
-  c as getDefaultVerticalLine
+  n as AXIS_EDGE_LABEL_PADDING_PX,
+  l as AXIS_FONT_SIZE,
+  t as AXIS_TICK_MARK_DENSITY,
+  c as AXIS_TIME_EDGE_PADDING_PX,
+  b as AXIS_TOP_LABEL_PADDING_PX,
+  r as DEFAULT_AREA_SERIES,
+  u as getDefaultOptions,
+  f as getDefaultSeries,
+  g as getDefaultVerticalLine
 };

package/dist/esm/components/graph/format-number.js

@@ -0,0 +1,35 @@
+function c(t, n) {
+  const r = Math.abs(t);
+  if (r >= 1) {
+    const o = 10 ** n;
+    return (Math.floor(t * o) / o).toFixed(n).replace(/\.?0+$/, "");
+  }
+  if (r > 0) {
+    const o = Math.floor(Math.log10(r)), i = Math.max(n, Math.abs(o) + n), e = Math.min(i, 10);
+    return t.toFixed(e).replace(/\.?0+$/, "");
+  }
+  return "0";
+}
+function m(t) {
+  const n = Math.abs(t);
+  return n < 1e-10 && n > 0;
+}
+const f = {
+  EPSILON: 1e-10,
+  MIN_DISPLAY_THRESHOLD: 1e-4,
+  MAX_EXPONENTIAL_THRESHOLD: 1e11
+};
+function u(t, n = 2, r = 6) {
+  if (!Number.isFinite(t)) return "∞";
+  const o = 1 / 10 ** n;
+  return t < o && t !== 0 ? t.toFixed(r).replace(/\.?0+$/, "") : t > 1 ? new Intl.NumberFormat("en-US", {
+    minimumFractionDigits: n,
+    maximumFractionDigits: n
+  }).format(t) : t.toFixed(n);
+}
+export {
+  f as FORMAT_CONSTANTS,
+  u as formatPrice,
+  m as isBelowDisplayThreshold,
+  c as toSignificantDigits
+};