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

package/dist/esm/components/overflow-container/overflow-container.js

@@ -1,51 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import "react";
-import "@gearbox-protocol/sdk";
-import { cn as t } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const m = {
-  default: "rounded-lg",
-  small: "rounded-[8px]"
-}, u = {
-  default: "border border-gray-20",
-  light: "border border-gray-50",
-  none: ""
-};
-function w({
-  children: o,
-  maxHeight: e,
-  minHeight: p = e,
-  size: d = "default",
-  borderColor: s = "default",
-  outerPadding: a = "14px 12px 14px 0",
-  innerPadding: l = "0 22px 0 16px",
-  className: i,
-  overflowContainerClassName: n
-}) {
-  return /* @__PURE__ */ r(
-    "div",
-    {
-      className: t(
-        "pt-3.5 pr-3 pl-0 pb-3.5",
-        m[d],
-        u[s],
-        i
-      ),
-      style: { padding: a },
-      children: /* @__PURE__ */ r(
-        "div",
-        {
-          className: t("overflow-y-auto w-full", n),
-          style: { maxHeight: e, minHeight: p },
-          children: l !== null ? /* @__PURE__ */ r("div", { style: { padding: l }, children: o }) : o
-        }
-      )
-    }
-  );
-}
-export {
-  w as OverflowContainer
-};

package/dist/esm/components/percent-indicator/index.js

@@ -1,4 +0,0 @@
-import { PercentIndicator as o } from "./percent-indicator.js";
-export {
-  o as PercentIndicator
-};

package/dist/esm/components/percent-indicator/percent-indicator.js

@@ -1,36 +0,0 @@
-import { jsxs as f, jsx as t } from "react/jsx-runtime";
-import { Progress as c } from "../progress/progress.js";
-import "react";
-import "@gearbox-protocol/sdk";
-import { cn as i } from "../../utils/cn.js";
-import "sonner";
-import { percentTemplate as l } from "../../utils/format-money.js";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const x = (r) => r >= 90 ? "danger" : r >= 70 ? "warning" : r >= 50 ? "info" : "success";
-function M({
-  percent: r,
-  decimals: e = 2,
-  showColor: o = !0,
-  showProgressBar: s = !0,
-  className: n,
-  ...m
-}) {
-  const a = () => o ? r >= 90 ? "text-destructive" : r >= 70 ? "text-warning" : r >= 50 ? "text-foreground" : "text-success" : "", u = Math.min(100, Math.max(0, r));
-  return /* @__PURE__ */ f("div", { className: i("flex min-w-0 flex-col gap-1", n), ...m, children: [
-    /* @__PURE__ */ t("div", { className: i("font-medium", a()), children: l(r, e) }),
-    s && /* @__PURE__ */ t(
-      c,
-      {
-        value: u,
-        variant: x(r),
-        size: "sm",
-        className: "w-16 shrink-0"
-      }
-    )
-  ] });
-}
-export {
-  M as PercentIndicator
-};

package/dist/esm/components/pool-apy-tooltip/pool-apy-tooltip.js

@@ -1,257 +0,0 @@
-import { jsx as e, jsxs as n, Fragment as b } from "react/jsx-runtime";
-import { faPlus as P } from "@fortawesome/free-solid-svg-icons";
-import { IconLighting as T } from "@gearbox-protocol/static";
-import { getRewardTokenSymbol as k } from "../compound-apy/compound-apy.js";
-import { FaIcon as S } from "../icons/fa-icon.js";
-import { PointsIcon as _ } from "../points-icon/points-icon.js";
-import { Skeleton as z } from "../skeleton/skeleton.js";
-import "react";
-import "@gearbox-protocol/sdk";
-import { cn as u } from "../../utils/cn.js";
-import "sonner";
-import { percentTemplate as r } from "../../utils/format-money.js";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-import { TokenIcon as C } from "../token-icon/token-icon.js";
-import { SimpleTooltip as L } from "../tooltip/simple-tooltip.js";
-import "../tooltip/tooltip.js";
-import { FormattedMessageTyped as o } from "../typed-intl/index.js";
-import { VerticalIndicator as d } from "../vertical-indicator/vertical-indicator.js";
-import { VerticalList as y } from "../vertical-list/vertical-list.js";
-const $ = {
-  supplyAPY: "components.apyParts.supplyAPY",
-  tokenYield: "components.apyParts.tokenYield"
-}, O = {
-  supplyAPY: "components.apyParts.supplyAPY.tip",
-  tokenYield: "components.apyParts.tokenYield.tip"
-}, v = {
-  deposit: void 0,
-  "cross-chain-deposit": "components.apyParts.points.condition.crossDeposit",
-  holding: void 0
-};
-function Y({ children: m }) {
-  return /* @__PURE__ */ e("div", { className: "w-[110px] grid grid-cols-2 items-end text-end", children: m });
-}
-function oe({
-  children: m,
-  totalAPY: f,
-  baseAPY: c,
-  extraAPY: h,
-  points: i,
-  apy7DAgo: a,
-  externalAPY: s,
-  tokensList: w,
-  className: g
-}) {
-  if (!(f !== void 0 || c && c.length > 0 || h && h.length > 0 || i && i.length > 0))
-    return /* @__PURE__ */ e("span", { className: g, children: m });
-  const I = !a || !!a.totalAPYLoading || !!a.loading7DAgo, x = !!a, p = (t, l) => x ? /* @__PURE__ */ n(Y, { children: [
-    /* @__PURE__ */ e("span", { children: t }),
-    /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(z, { width: 30, height: 14, loading: I, children: l }) })
-  ] }) : t, N = /* @__PURE__ */ n(
-    "div",
-    {
-      className: u(
-        "w-[370px] max-w-[calc(100vw-32px)] p-6",
-        "bg-popover",
-        "border border-border",
-        "rounded-lg",
-        "shadow-[0_4px_28px_4px_rgba(0,0,0,0.15)]",
-        "text-left font-normal"
-      ),
-      children: [
-        /* @__PURE__ */ n(y, { children: [
-          x && /* @__PURE__ */ e(
-            d,
-            {
-              size: "sm",
-              label: /* @__PURE__ */ e("span", { className: "uppercase text-muted-foreground text-xs", children: /* @__PURE__ */ e(
-                o,
-                {
-                  messageId: "components.apyParts.title"
-                }
-              ) }),
-              value: /* @__PURE__ */ e("span", { className: "text-muted-foreground text-xs", children: p("1D", "7D") })
-            }
-          ),
-          c?.map((t, l) => /* @__PURE__ */ e(
-            d,
-            {
-              size: "sm",
-              label: /* @__PURE__ */ e(o, { messageId: $[t.type] }),
-              description: /* @__PURE__ */ e(
-                o,
-                {
-                  messageId: O[t.type]
-                }
-              ),
-              value: p(
-                r(t.apy),
-                r(a?.baseAPY?.[l]?.apy || 0)
-              )
-            },
-            `base-${t.type}-${t.apy}`
-          )),
-          h?.map((t) => {
-            const l = w?.[t.rewardToken];
-            return /* @__PURE__ */ e(
-              d,
-              {
-                size: "sm",
-                label: /* @__PURE__ */ n("span", { className: "inline-flex items-center", children: [
-                  /* @__PURE__ */ e(
-                    o,
-                    {
-                      messageId: "components.apyParts.extraAPY",
-                      values: { symbol: t.rewardTokenSymbol }
-                    }
-                  ),
-                  /* @__PURE__ */ e("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ e(
-                    C,
-                    {
-                      symbol: k(l, t.rewardTokenSymbol),
-                      size: 14
-                    }
-                  ) })
-                ] }),
-                description: /* @__PURE__ */ e(
-                  o,
-                  {
-                    messageId: "components.apyParts.extraAPY.tip"
-                  }
-                ),
-                value: p(
-                  r(t.apy),
-                  r(t.apy)
-                )
-              },
-              `extra-${t.rewardToken}-${t.apy}`
-            );
-          })
-        ] }),
-        /* @__PURE__ */ e("div", { className: "my-5 border-t border-border" }),
-        /* @__PURE__ */ e(y, { children: /* @__PURE__ */ e(
-          d,
-          {
-            size: "sm",
-            label: /* @__PURE__ */ e("span", { className: "font-bold", children: /* @__PURE__ */ e(
-              o,
-              {
-                messageId: "components.apyParts.totalAPY"
-              }
-            ) }),
-            value: p(
-              r(f || 0),
-              r(a?.totalAPY || 0)
-            )
-          }
-        ) }),
-        s && /* @__PURE__ */ e(
-          "div",
-          {
-            className: u(
-              "mt-5 px-8 pt-[18px] pb-4",
-              "rounded-[10px]",
-              "text-[13px] leading-[120%] text-center",
-              "border border-dashed border-gray-40"
-            ),
-            children: (() => {
-              const t = /* @__PURE__ */ n(b, { children: [
-                /* @__PURE__ */ e("span", { className: "text-gray-90 mr-1.5", children: /* @__PURE__ */ e(T, { size: 14, style: { verticalAlign: "top" } }) }),
-                /* @__PURE__ */ n("span", { className: "font-bold", children: [
-                  "+",
-                  r(s.apy)
-                ] })
-              ] });
-              return s.tooltip ? /* @__PURE__ */ e(
-                o,
-                {
-                  messageId: s.tooltip,
-                  values: {
-                    name: s.name,
-                    value: t
-                  }
-                }
-              ) : /* @__PURE__ */ n("span", { className: "inline-flex flex-wrap items-center justify-center gap-x-1", children: [
-                /* @__PURE__ */ e("span", { children: s.name }),
-                t
-              ] });
-            })()
-          }
-        ),
-        i && i.length > 0 && /* @__PURE__ */ n(b, { children: [
-          /* @__PURE__ */ e("div", { className: "relative my-2.5 mx-6 border-t-2 border-border", children: /* @__PURE__ */ e(
-            "div",
-            {
-              className: u(
-                "absolute -top-[10px] left-0",
-                "w-5 h-5",
-                "flex items-center justify-center",
-                "rounded-full",
-                "bg-gray-20"
-              ),
-              children: /* @__PURE__ */ e(S, { icon: P, className: "size-2.5 text-white" })
-            }
-          ) }),
-          /* @__PURE__ */ e("div", { className: "h-6" }),
-          /* @__PURE__ */ e(y, { children: i.map((t) => /* @__PURE__ */ e(
-            d,
-            {
-              size: "sm",
-              label: /* @__PURE__ */ n("span", { className: "inline-flex items-center", children: [
-                /* @__PURE__ */ e(
-                  o,
-                  {
-                    messageId: "components.apyParts.points",
-                    values: { symbol: t.name }
-                  }
-                ),
-                t.reward && /* @__PURE__ */ e("span", { className: "ml-2 inline-flex", children: /* @__PURE__ */ e(
-                  _,
-                  {
-                    reward: {
-                      name: t.reward.name || t.name,
-                      type: t.reward.type || t.name.toLowerCase()
-                    },
-                    size: 16
-                  }
-                ) })
-              ] }),
-              description: /* @__PURE__ */ n("div", { children: [
-                /* @__PURE__ */ e("div", { children: `Per ${[
-                  ...t.reward?.duration ? [t.reward.duration] : [],
-                  ...t.tokenTitle ? [`1 ${t.tokenTitle}`] : []
-                ].join(" per ")}` }),
-                t.reward?.condition && v[t.reward.condition] && /* @__PURE__ */ e("span", { className: "text-warning", children: /* @__PURE__ */ e(
-                  o,
-                  {
-                    messageId: v[t.reward.condition]
-                  }
-                ) })
-              ] }),
-              value: t.amount
-            },
-            `points-${t.name}-${t.amount}`
-          )) })
-        ] })
-      ]
-    }
-  );
-  return /* @__PURE__ */ e(
-    L,
-    {
-      placement: "bottom",
-      triangle: !1,
-      type: "modal-tooltip",
-      minWidth: "100%",
-      maxWidth: "100%",
-      title: /* @__PURE__ */ e("span", { className: g, children: m }),
-      triggerClassName: g,
-      children: N
-    }
-  );
-}
-export {
-  oe as PoolAPYTooltip
-};

package/dist/esm/components/pool-indicator-icon/index.js

@@ -1,4 +0,0 @@
-import { PoolIndicatorIcon as c } from "./pool-indicator-icon.js";
-export {
-  c as PoolIndicatorIcon
-};

package/dist/esm/components/pool-indicator-icon/pool-indicator-icon.js

@@ -1,44 +0,0 @@
-import { jsxs as d, jsx as r } from "react/jsx-runtime";
-import { IconLighting as m } from "@gearbox-protocol/static";
-import n from "react";
-import "@gearbox-protocol/sdk";
-import { cn as a } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const f = {
-  primary: "#e0369c",
-  secondary: "#fff"
-}, w = n.forwardRef(({ children: t, size: i = 24, color: s = "primary", className: l }, c) => {
-  const e = i + 8, o = f[s];
-  return /* @__PURE__ */ d("div", { ref: c, className: a("relative", l), children: [
-    /* @__PURE__ */ r(
-      "div",
-      {
-        className: "absolute -top-1 -left-1 flex items-center justify-center rounded-full",
-        style: {
-          width: e,
-          height: e,
-          border: `2px solid ${o}`
-        }
-      }
-    ),
-    /* @__PURE__ */ r(
-      "div",
-      {
-        className: "absolute -top-1.5 -right-1.5 flex items-center justify-center rounded-full",
-        style: {
-          width: 14,
-          height: 14,
-          backgroundColor: o
-        },
-        children: /* @__PURE__ */ r(m, { size: 8 })
-      }
-    ),
-    t
-  ] });
-});
-export {
-  w as PoolIndicatorIcon
-};

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

@@ -1,4 +0,0 @@
-import { Progress as e } from "./progress.js";
-export {
-  e as Progress
-};

package/dist/esm/components/progress/progress.js

@@ -1,63 +0,0 @@
-import { jsxs as a, jsx as o } from "react/jsx-runtime";
-import * as s from "@radix-ui/react-progress";
-import * as u from "react";
-import "@gearbox-protocol/sdk";
-import { cn as r } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const g = u.forwardRef(
-  ({
-    className: l,
-    value: e,
-    variant: i = "default",
-    size: n = "default",
-    showLabel: t = !1,
-    ...m
-  }, f) => {
-    const d = {
-      sm: "h-1",
-      default: "h-2",
-      lg: "h-3"
-    }, c = {
-      default: "bg-primary",
-      success: "bg-success",
-      warning: "bg-warning",
-      danger: "bg-destructive",
-      info: "bg-foreground"
-    };
-    return /* @__PURE__ */ a("div", { className: r("flex w-full items-center", t && "gap-3"), children: [
-      /* @__PURE__ */ o(
-        s.Root,
-        {
-          ref: f,
-          className: r(
-            "relative w-full overflow-hidden rounded-full bg-secondary",
-            d[n],
-            l
-          ),
-          ...m,
-          children: /* @__PURE__ */ o(
-            s.Indicator,
-            {
-              className: r(
-                "h-full w-full flex-1 transition-all",
-                c[i]
-              ),
-              style: { transform: `translateX(-${100 - (e || 0)}%)` }
-            }
-          )
-        }
-      ),
-      t && /* @__PURE__ */ a("span", { className: "shrink-0 text-xs text-muted-foreground tabular-nums", children: [
-        e,
-        "%"
-      ] })
-    ] });
-  }
-);
-g.displayName = s.Root.displayName;
-export {
-  g as Progress
-};

package/dist/esm/components/progress-bar/index.js

@@ -1,5 +0,0 @@
-import { ProgressBar as e, hfToBarIndex as a } from "./progress-bar.js";
-export {
-  e as ProgressBar,
-  a as hfToBarIndex
-};

package/dist/esm/components/progress-bar/progress-bar.js

@@ -1,98 +0,0 @@
-import { jsxs as o, jsx as r } from "react/jsx-runtime";
-import { cva as g } from "class-variance-authority";
-import * as b from "react";
-import { GOOD_HF as l, BAD_HF as x, getHFZones as v } from "../health-factor/health-factor.js";
-import { HelpTip as h } from "../help-tip/help-tip.js";
-import "@gearbox-protocol/sdk";
-import { cn as i } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const m = 33.33, N = {
-  1: { intervalStart: 0, intervalEnd: x, startFrom: 0 },
-  2: {
-    intervalStart: x,
-    intervalEnd: l,
-    startFrom: m
-  },
-  3: {
-    intervalStart: l,
-    intervalEnd: Math.ceil(l * 1.2),
-    startFrom: m * 2
-  }
-};
-function w(t) {
-  const e = v(t);
-  return e === "good" ? 3 : e === "medium" ? 2 : 1;
-}
-function y(t, e) {
-  const { intervalStart: s, intervalEnd: n, startFrom: a } = N[e], f = Math.min(Math.max(t, s), n) - s, p = n - s, u = f / p * m;
-  return a + u;
-}
-const E = g(
-  [
-    "relative w-full flex flex-col",
-    "border border-gray-20 rounded-sm",
-    "py-6 px-5"
-  ].join(" ")
-), d = "mx-[2.5px] h-2 flex-1 shrink-0 basis-0 rounded-[2px]", F = b.forwardRef(
-  ({ progress: t, tip: e, children: s }, n) => {
-    const a = w(t), c = y(t, a);
-    return /* @__PURE__ */ o("div", { ref: n, className: i(E()), children: [
-      e != null && e !== "" && /* @__PURE__ */ r("div", { className: "absolute right-4 top-4 z-[1] leading-none", children: /* @__PURE__ */ r(h, { maxWidth: "350px", minWidth: "350px", children: e }) }),
-      /* @__PURE__ */ r("div", { className: "mb-4 text-base font-medium leading-5", children: s }),
-      /* @__PURE__ */ o("div", { className: "relative w-full flex flex-nowrap", children: [
-        /* @__PURE__ */ r(
-          "div",
-          {
-            className: i(
-              d,
-              a === 1 ? "bg-destructive" : "bg-gray-30"
-            )
-          }
-        ),
-        /* @__PURE__ */ r(
-          "div",
-          {
-            className: i(
-              d,
-              a === 2 ? "bg-warning" : "bg-gray-30"
-            )
-          }
-        ),
-        /* @__PURE__ */ r(
-          "div",
-          {
-            className: i(
-              d,
-              a === 3 ? "bg-success" : "bg-gray-30"
-            )
-          }
-        ),
-        /* @__PURE__ */ o(
-          "div",
-          {
-            className: "absolute top-1/2 h-5 w-0.5 -translate-y-1/2 bg-foreground",
-            style: { left: `${c}%` },
-            "aria-hidden": !0,
-            children: [
-              /* @__PURE__ */ r("span", { className: " absolute left-1/2 -top-1/8 h-0 w-0 -translate-x-1/2 translate-y-1/2 border-4 border-transparent border-t-foreground border-b-0" }),
-              /* @__PURE__ */ r("span", { className: "absolute left-1/2 -bottom-1/8 h-0 w-0 -translate-x-1/2 -translate-y-1/2 border-4 border-transparent border-b-foreground border-t-0" })
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ o("div", { className: "mt-4 flex w-full flex-nowrap", children: [
-        /* @__PURE__ */ r("div", { className: "mx-[2.5px] flex-1 shrink-0 basis-0 text-center text-xs font-medium uppercase leading-[14px] text-secondary-foreground", children: "Low" }),
-        /* @__PURE__ */ r("div", { className: "mx-[2.5px] flex-1 shrink-0 basis-0 text-center text-xs font-medium uppercase leading-[14px] text-secondary-foreground", children: "Normal" }),
-        /* @__PURE__ */ r("div", { className: "mx-[2.5px] flex-1 shrink-0 basis-0 text-center text-xs font-medium uppercase leading-[14px] text-secondary-foreground", children: "High" })
-      ] })
-    ] });
-  }
-);
-F.displayName = "ProgressBar";
-export {
-  F as ProgressBar,
-  w as hfToBarIndex
-};

package/dist/esm/components/progress-circle/index.js

@@ -1,4 +0,0 @@
-import { ProgressCircle as o } from "./progress-circle.js";
-export {
-  o as ProgressCircle
-};

package/dist/esm/components/progress-circle/progress-circle.js

@@ -1,74 +0,0 @@
-import { jsxs as n, jsx as a } from "react/jsx-runtime";
-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 "../../utils/z-index.js";
-function w({
-  value: l,
-  size: r = 40,
-  strokeWidth: e = 4,
-  indicatorColor: m = "hsl(var(--primary))",
-  trackColor: f = "hsl(var(--muted))",
-  className: h,
-  children: i
-}) {
-  const o = Math.max(0, Math.min(100, l || 0)), t = r / 2, s = t - e / 2, c = 2 * Math.PI * s, p = (100 - o) * c / 100;
-  return /* @__PURE__ */ n(
-    "div",
-    {
-      className: u(
-        "relative inline-flex items-center justify-center",
-        h
-      ),
-      style: { width: r, height: r },
-      children: [
-        /* @__PURE__ */ n(
-          "svg",
-          {
-            width: r,
-            height: r,
-            viewBox: `0 0 ${r} ${r}`,
-            className: "rotate-[-90deg]",
-            "aria-label": `Progress: ${o}%`,
-            role: "img",
-            children: [
-              /* @__PURE__ */ a(
-                "circle",
-                {
-                  cx: t,
-                  cy: t,
-                  r: s,
-                  fill: "transparent",
-                  stroke: f,
-                  strokeWidth: e
-                }
-              ),
-              /* @__PURE__ */ a(
-                "circle",
-                {
-                  cx: t,
-                  cy: t,
-                  r: s,
-                  fill: "transparent",
-                  stroke: m,
-                  strokeWidth: e,
-                  strokeDasharray: c,
-                  strokeDashoffset: p,
-                  strokeLinecap: "round",
-                  className: "transition-[stroke-dashoffset] duration-300 ease-in-out"
-                }
-              )
-            ]
-          }
-        ),
-        i && /* @__PURE__ */ a("div", { className: "absolute inset-0 flex items-center justify-center", children: i })
-      ]
-    }
-  );
-}
-export {
-  w as ProgressCircle
-};

package/dist/esm/components/radio-group/index.js

@@ -1,6 +0,0 @@
-import { RadioGroup as p, RadioGroupItem as r, RadioOption as a } from "./radio-group.js";
-export {
-  p as RadioGroup,
-  r as RadioGroupItem,
-  a as RadioOption
-};