@gearbox-protocol/permissionless-ui 1.22.0-next.98 → 1.22.0

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

@@ -1,5 +1,5 @@
-import { resolveCSSColor as e } from "../../utils/colors.js";
-const o = {
+import { resolveCSSColor as o } from "../../utils/colors.js";
+const e = {
   topColor: "rgba(76, 175, 80, 0.56)",
   bottomColor: "rgba(76, 175, 80, 0.04)",
   lineColor: "#02c39a",
@@ -11,7 +11,7 @@ const o = {
   width: 2
 };
 function i() {
-  const r = e(
+  const r = o(
     "hsl(var(--foreground))",
     "rgb(0, 0, 0)"
   );
@@ -65,23 +65,19 @@ function a() {
   return {
     topColor: "rgba(76, 175, 80, 0.56)",
     bottomColor: "rgba(76, 175, 80, 0.04)",
-    lineColor: o.lineColor,
+    lineColor: e.lineColor,
     lineWidth: 2
   };
 }
-function s() {
-  const r = e(
-    "hsl(var(--primary))",
-    "rgb(76, 175, 80)"
-  );
+function b() {
   return {
     showLabel: !0,
-    color: r,
-    labelBackgroundColor: r,
+    color: e.lineColor,
+    labelBackgroundColor: e.lineColor,
     width: 2
   };
 }
-const b = {
+const s = {
   timeScale: {
     borderVisible: !0,
     borderColor: "rgba(224, 227, 235, 0.1)",
@@ -126,10 +122,10 @@ const b = {
   }
 };
 export {
-  o as DEFAULT_AREA_SERIES,
-  b as DEFAULT_OPTIONS,
+  e as DEFAULT_AREA_SERIES,
+  s as DEFAULT_OPTIONS,
   t as DEFAULT_VERTICAL_LINE,
   i as getDefaultOptions,
   a as getDefaultSeries,
-  s as getDefaultVerticalLine
+  b as getDefaultVerticalLine
 };

package/dist/esm/components/grid-td-cell/grid-td-cell.js

@@ -4,9 +4,10 @@ import "@gearbox-protocol/sdk";
 import { cn as t } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
-function c({ children: r, className: i, ...m }) {
+import "../../utils/z-index.js";
+function f({ children: r, className: i, ...m }) {
   return /* @__PURE__ */ o("td", { className: t("px-3 py-2 align-middle", i), ...m, children: r });
 }
 export {
-  c as GridTDCell
+  f as GridTDCell
 };

package/dist/esm/components/head-cell/head-cell.js

@@ -1,6 +1,6 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import * as v from "react";
-import { HelpTip as f } from "../help-tip/help-tip.js";
+import { HelpTip as p } from "../help-tip/help-tip.js";
 import { faCaretUp as N, faCaretDown as T } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as d } from "../icons/fa-icon.js";
 import "../tooltip/simple-tooltip.js";
@@ -9,12 +9,13 @@ import "@gearbox-protocol/sdk";
 import { cn as n } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
-function U({
+import "../../utils/z-index.js";
+function $({
   title: l,
   tip: r,
   arrowPosition: i = "left",
   sortDirection: s,
-  sortField: p = "this field",
+  sortField: f = "this field",
   sortTip: u,
   onSort: t,
   className: h
@@ -45,7 +46,7 @@ function U({
         t && i === "right" && c()
       ]
     }
-  ), C = `Sort by ${p}`;
+  ), C = `Sort by ${f}`;
   return /* @__PURE__ */ o(
     "div",
     {
@@ -57,22 +58,22 @@ function U({
           /* @__PURE__ */ e(H, { asChild: !0, children: m() }),
           /* @__PURE__ */ e(w, { children: u || C })
         ] }) }) : m(),
-        r && /* @__PURE__ */ e(f, { children: r })
+        r && /* @__PURE__ */ e(p, { children: r })
       ]
     }
   );
 }
-function $({
+function q({
   title: l,
   tip: r,
   className: i
 }) {
   return /* @__PURE__ */ o("div", { className: n("inline-flex items-center gap-1.5", i), children: [
     /* @__PURE__ */ e("span", { className: "text-sm font-medium text-muted-foreground", children: l }),
-    r && /* @__PURE__ */ e(f, { children: r })
+    r && /* @__PURE__ */ e(p, { children: r })
   ] });
 }
 export {
-  U as HeadCell,
-  $ as SimpleHeadCell
+  $ as HeadCell,
+  q as SimpleHeadCell
 };

package/dist/esm/components/health-factor/health-factor.js

@@ -1,14 +1,15 @@
 import { jsxs as f, jsx as c } from "react/jsx-runtime";
-import { PERCENTAGE_FACTOR as v, formatPercentage as p } from "@gearbox-protocol/sdk";
+import { PERCENTAGE_FACTOR as p, formatPercentage as v } from "@gearbox-protocol/sdk";
 import { cva as x } from "class-variance-authority";
 import "react";
 import { cn as C } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
+import "../../utils/z-index.js";
 import { StatusBars as F } from "../status-elements/status-elements.js";
 const g = 15e3, A = 11e3, H = 10500, N = (t) => {
   if (t)
-    return t >= g ? "good" : t > A ? "medium" : t > H ? "bad" : t > v ? "critical" : "liquidation";
+    return t >= g ? "good" : t > A ? "medium" : t > H ? "bad" : t > p ? "critical" : "liquidation";
 }, b = x(
   "inline-flex items-center font-medium [text-decoration:inherit]",
   {
@@ -24,7 +25,7 @@ const g = 15e3, A = 11e3, H = 10500, N = (t) => {
     }
   }
 );
-function j({
+function B({
   value: t,
   debt: e,
   decimals: a = 3,
@@ -36,7 +37,7 @@ function j({
   const i = e !== void 0 && e === 0n, r = !i && n === "color" ? o === void 0 ? N(t) : o : void 0, s = r === void 0 ? void 0 : r === null ? "unset" : r, d = () => {
     if (i) return "N/A";
     const l = Number(t);
-    return p(l, a);
+    return v(l, a);
   };
   return /* @__PURE__ */ f(
     "span",
@@ -58,6 +59,6 @@ function j({
 export {
   A as BAD_HF,
   g as GOOD_HF,
-  j as HealthFactor,
+  B as HealthFactor,
   N as getHFZones
 };

package/dist/esm/components/help-center-container/help-center-container.js

@@ -18,7 +18,7 @@ function y({
         // Desktop: fixed position with dynamic bottom.
         // Breakpoint synced with mobile BlockSync fallback in GearboxFooter (md:hidden).
         "hidden md:flex",
-        "fixed right-9 flex-col items-end gap-2 text-xs text-muted-foreground z-100"
+        "fixed right-9 flex-col items-end gap-2 text-xs text-muted-foreground z-[100]"
       ),
       style: { bottom: `${c}px` },
       children: /* @__PURE__ */ f(

package/dist/esm/components/help-sections/help-sections.js

@@ -1,19 +1,20 @@
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 import "react";
 import "@gearbox-protocol/sdk";
 import { cn as o } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
-function u({ children: e, className: t }) {
+import "../../utils/z-index.js";
+function f({ children: e, className: t }) {
   return /* @__PURE__ */ r("div", { className: o("space-y-4", t), children: e });
 }
-function f({ title: e, children: t, className: m }) {
-  return /* @__PURE__ */ s("div", { className: o("space-y-2", m), children: [
+function l({ title: e, children: t, className: m }) {
+  return /* @__PURE__ */ i("div", { className: o("space-y-2", m), children: [
     e && /* @__PURE__ */ r("h3", { className: "text-sm font-medium text-foreground", children: e }),
     /* @__PURE__ */ r("div", { className: "text-sm text-muted-foreground", children: t })
   ] });
 }
 export {
-  f as HelpSection,
-  u as HelpSections
+  l as HelpSection,
+  f as HelpSections
 };

package/dist/esm/components/help-tip/help-tip.js

@@ -1,11 +1,12 @@
 import { jsx as e } from "react/jsx-runtime";
 import { IconQuestionCircle as v, IconInfo as h } from "@gearbox-protocol/static";
 import { cva as T } from "class-variance-authority";
-import * as p from "react";
+import * as c from "react";
 import "@gearbox-protocol/sdk";
 import { cn as s } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
+import "../../utils/z-index.js";
 import { SimpleTooltip as C } from "../tooltip/simple-tooltip.js";
 const H = T("transition-colors", {
   variants: {
@@ -41,7 +42,7 @@ const H = T("transition-colors", {
     }
   },
   defaultVariants: { iconColor: "gray-90", iconHoverColor: "gray-110" }
-}), I = p.forwardRef(
+}), I = c.forwardRef(
   ({
     className: r,
     children: o,
@@ -51,7 +52,7 @@ const H = T("transition-colors", {
     placement: y = "bottom",
     iconSize: i = 14,
     iconColor: n = "gray-90",
-    iconHoverColor: c = "gray-110",
+    iconHoverColor: p = "gray-110",
     iconVariant: x = "question",
     onPointerEnter: m,
     ...d
@@ -62,7 +63,7 @@ const H = T("transition-colors", {
         ref: f,
         iconSize: i,
         iconColor: n,
-        iconHoverColor: c,
+        iconHoverColor: p,
         iconVariant: x,
         onPointerEnter: m,
         className: r,
@@ -83,7 +84,7 @@ const H = T("transition-colors", {
   }
 );
 I.displayName = "HelpTip";
-const l = p.forwardRef(
+const l = c.forwardRef(
   ({
     className: r,
     iconSize: o = 14,
@@ -93,7 +94,7 @@ const l = p.forwardRef(
     onPointerEnter: y,
     ...i
   }, n) => {
-    const c = g === "question" ? v : h;
+    const p = g === "question" ? v : h;
     return /* @__PURE__ */ e(
       "span",
       {
@@ -107,13 +108,13 @@ const l = p.forwardRef(
         ),
         onPointerEnter: y,
         ...i,
-        children: /* @__PURE__ */ e(c, { size: o })
+        children: /* @__PURE__ */ e(p, { size: o })
       }
     );
   }
 );
 l.displayName = "HelpTipIcon";
-const N = p.forwardRef(({ className: r, ...o }, t) => /* @__PURE__ */ e(
+const N = c.forwardRef(({ className: r, ...o }, t) => /* @__PURE__ */ e(
   "span",
   {
     ref: t,

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

@@ -2,16 +2,17 @@ import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import { IconQuestionCircle as a } from "@gearbox-protocol/static";
 import * as d from "react";
 import "../tooltip/simple-tooltip.js";
-import { TooltipProvider as c, Tooltip as m, TooltipTrigger as f, TooltipContent as p } from "../tooltip/tooltip.js";
+import { TooltipProvider as c, Tooltip as m, TooltipTrigger as p, TooltipContent as f } from "../tooltip/tooltip.js";
 import "@gearbox-protocol/sdk";
 import { cn as x } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
+import "../../utils/z-index.js";
 const h = d.forwardRef(({ label: i, value: l, tip: r, valueDescription: t, className: n }, s) => /* @__PURE__ */ o("div", { ref: s, className: x("flex flex-col gap-2 w-full", n), children: [
   /* @__PURE__ */ o("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
     /* @__PURE__ */ e("span", { children: i }),
     r && /* @__PURE__ */ e(c, { delayDuration: 0, children: /* @__PURE__ */ o(m, { children: [
-      /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e(
         "button",
         {
           type: "button",
@@ -19,7 +20,7 @@ const h = d.forwardRef(({ label: i, value: l, tip: r, valueDescription: t, class
           children: /* @__PURE__ */ e(a, { size: 14, className: "size-3.5" })
         }
       ) }),
-      /* @__PURE__ */ e(p, { side: "top", className: "max-w-xs", children: /* @__PURE__ */ e("p", { children: r }) })
+      /* @__PURE__ */ e(f, { side: "top", className: "max-w-xs", children: /* @__PURE__ */ e("p", { children: r }) })
     ] }) })
   ] }),
   /* @__PURE__ */ o("div", { className: "flex flex-col gap-1", children: [

package/dist/esm/components/icon-button/icon-button.js

@@ -1,4 +1,4 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as r } from "react/jsx-runtime";
 import { Slot as m } from "@radix-ui/react-slot";
 import { cva as p } from "class-variance-authority";
 import * as f from "react";
@@ -7,6 +7,7 @@ import "@gearbox-protocol/sdk";
 import { cn as h } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
+import "../../utils/z-index.js";
 const y = p(
   "inline-flex items-center justify-center p-0 rounded-full transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-default disabled:pointer-events-none",
   {
@@ -34,7 +35,7 @@ const y = p(
     children: u,
     ...s
   }, l) => {
-    const r = u, n = h(
+    const e = u, n = h(
       y({ buttonType: b, className: d }),
       "flex items-center justify-center"
     ), o = {
@@ -43,24 +44,24 @@ const y = p(
       minWidth: t,
       minHeight: t
     };
-    return i ? /* @__PURE__ */ e(g, { ...i, children: /* @__PURE__ */ e(
+    return i ? /* @__PURE__ */ r(g, { ...i, children: /* @__PURE__ */ r(
       "span",
       {
         className: n,
         style: o,
         "aria-disabled": a,
-        children: r
+        children: e
       }
-    ) }) : c ? /* @__PURE__ */ e(
+    ) }) : c ? /* @__PURE__ */ r(
       m,
       {
         ref: l,
         className: n,
         style: o,
         ...s,
-        children: r
+        children: e
       }
-    ) : /* @__PURE__ */ e(
+    ) : /* @__PURE__ */ r(
       "button",
       {
         ref: l,
@@ -69,7 +70,7 @@ const y = p(
         style: o,
         disabled: a,
         ...s,
-        children: r
+        children: e
       }
     );
   }

package/dist/esm/components/icons/fa-icon.js

@@ -6,8 +6,9 @@ import "@gearbox-protocol/sdk";
 import { cn as n } from "../../utils/cn.js";
 import "sonner";
 import "luxon";
+import "../../utils/z-index.js";
 i.autoAddCss = !1;
-function d({ className: o, ...r }) {
+function k({ className: o, ...r }) {
   return /* @__PURE__ */ m(
     t,
     {
@@ -17,5 +18,5 @@ function d({ className: o, ...r }) {
   );
 }
 export {
-  d as FaIcon
+  k as FaIcon
 };