@gearbox-protocol/ui-kit 4.0.0-next.6 → 4.0.0-next.60

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

@@ -1,10 +1,8 @@
 import { jsxs as p, jsx as t } from "react/jsx-runtime";
 import { cva as T } from "class-variance-authority";
 import * as R from "react";
-import "@gearbox-protocol/sdk";
+import "@gearbox-protocol/sdk/onchain";
 import { cn as e } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
 import { useIconSlotWidths as S } from "./use-icon-slot-widths.js";
@@ -71,7 +69,7 @@ const z = T(
       variant: "default"
     }
   }
-), G = R.forwardRef(
+), B = R.forwardRef(
   ({
     hasError: o,
     errorMessage: d,
@@ -158,6 +156,6 @@ const z = T(
   }
 );
 export {
-  G as Input,
+  B as Input,
   z as inputVariants
 };

package/dist/esm/components/label/label.js

@@ -2,10 +2,8 @@ import { jsx as x } from "react/jsx-runtime";
 import * as d from "@radix-ui/react-label";
 import { cva as v } from "class-variance-authority";
 import * as r from "react";
-import "@gearbox-protocol/sdk";
+import "@gearbox-protocol/sdk/onchain";
 import { cn as g } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
 const y = v(

package/dist/esm/components/layout/app-footer/app-footer.js

@@ -1,37 +1,34 @@
-import { jsx as e, jsxs as a, Fragment as f } from "react/jsx-runtime";
-import * as d from "react";
-import { BlockSyncPill as x } from "../../block-sync-pill/block-sync-pill.js";
-import { cn as h } from "../../../utils/cn.js";
-const u = [
+import { jsx as e, jsxs as t, Fragment as p } from "react/jsx-runtime";
+import * as i from "react";
+import { cn as f } from "../../../utils/cn.js";
+const d = [
   { label: "Docs", href: "https://docs.gearbox.finance" },
   { label: "Support", href: "https://discord.com/invite/gearbox" },
   { label: "Terms", href: "https://gearbox.finance/terms" },
   { label: "Privacy Policy", href: "https://gearbox.finance/privacy" }
-], g = d.forwardRef(
+], x = i.forwardRef(
   ({
-    links: o = u,
+    links: o = d,
     copyright: s,
     year: l = (/* @__PURE__ */ new Date()).getFullYear(),
-    showStatus: c = !0,
-    statusLabel: m = "Status",
-    blockSyncProps: t,
-    className: n,
-    ...i
-  }, p) => /* @__PURE__ */ e(
+    status: a,
+    className: c,
+    ...n
+  }, m) => /* @__PURE__ */ e(
     "footer",
     {
-      ref: p,
-      className: h(
+      ref: m,
+      className: f(
         "border-t border-border/60 px-4 sm:px-6 lg:px-8",
-        n
+        c
       ),
-      ...i,
-      children: /* @__PURE__ */ a("div", { className: "flex flex-wrap items-center justify-center gap-x-4 gap-y-3 py-3 text-xs text-muted-foreground sm:justify-start sm:gap-x-6 sm:gap-y-2", children: [
-        /* @__PURE__ */ e("span", { className: "order-1", children: s ?? /* @__PURE__ */ a(f, { children: [
+      ...n,
+      children: /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center justify-center gap-x-4 gap-y-3 py-3 text-xs text-muted-foreground sm:justify-start sm:gap-x-6 sm:gap-y-2", children: [
+        /* @__PURE__ */ e("span", { className: "order-1", children: s ?? /* @__PURE__ */ t(p, { children: [
           "© Gearbox Protocol, ",
           l
         ] }) }),
-        c && t ? /* @__PURE__ */ e("div", { className: "order-2 sm:order-3", children: /* @__PURE__ */ e(x, { ...t, statusLabel: m }) }) : null,
+        a ? /* @__PURE__ */ e("div", { className: "order-2 sm:order-3", children: a }) : null,
         /* @__PURE__ */ e("nav", { className: "order-3 flex w-full flex-wrap items-center justify-center gap-4 sm:order-2 sm:ml-auto sm:w-auto sm:justify-start", children: o.map((r) => /* @__PURE__ */ e(
           "a",
           {
@@ -47,8 +44,8 @@ const u = [
     }
   )
 );
-g.displayName = "AppFooter";
+x.displayName = "AppFooter";
 export {
-  g as AppFooter,
-  u as DEFAULT_APP_FOOTER_LINKS
+  x as AppFooter,
+  d as DEFAULT_APP_FOOTER_LINKS
 };

package/dist/esm/components/legal-agreement/legal-agreement-dialog.js

@@ -1,11 +1,11 @@
 import { jsx as e, jsxs as t, Fragment as C } from "react/jsx-runtime";
-import { IconExternal as k, IconPending as v } from "@gearbox-protocol/static";
-import * as b from "react";
-import { useState as D } from "react";
-import { AlertDialog as c, AlertDialogContent as m, AlertDialogHeader as T, AlertDialogTitle as F, AlertDialogDescription as o, AlertDialogFooter as x } from "../alert-dialog/alert-dialog.js";
-import { BaseLink as I } from "../base-link/base-link.js";
+import { faTriangleExclamation as k } from "@fortawesome/free-solid-svg-icons";
+import { IconPending as v, IconExternal as b } from "@gearbox-protocol/static";
+import * as D from "react";
+import { useState as T } from "react";
+import { AlertDialog as c, AlertDialogContent as m, AlertDialogFooter as x, AlertDialogHeader as F, AlertDialogTitle as I, AlertDialogDescription as o } from "../alert-dialog/alert-dialog.js";
+import { BaseLink as j } from "../base-link/base-link.js";
 import { Button as d } from "../buttons/button/button.js";
-import { faTriangleExclamation as j } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as z } from "../icons/fa-icon.js";
 import { LegalAgreementAwaitingPanel as B } from "./legal-agreement-awaiting-panel.js";
 import { LegalAgreementPanel as P } from "./legal-agreement-panel.js";
@@ -19,12 +19,12 @@ function K({
   config: i,
   theme: h = "default"
 }) {
-  const [f, u] = D({}), N = i.checkboxItems.every((l) => f[l.id]), y = (l) => {
+  const [f, u] = T({}), N = i.checkboxItems.every((l) => f[l.id]), y = (l) => {
     u((p) => ({ ...p, [l]: !p[l] }));
   }, A = async () => {
     await r();
   };
-  return b.useEffect(() => {
+  return D.useEffect(() => {
     a || u({});
   }, [a]), w ? /* @__PURE__ */ e(c, { open: a, children: /* @__PURE__ */ e(m, { className: "max-w-2xl w-[calc(100%-2rem)] sm:w-full", children: /* @__PURE__ */ e(
     B,
@@ -76,8 +76,8 @@ function M({
   termsOfServiceLink: r
 }) {
   return /* @__PURE__ */ e(c, { open: a, children: /* @__PURE__ */ t(m, { className: "max-w-lg", children: [
-    /* @__PURE__ */ e(T, { children: /* @__PURE__ */ t(F, { className: "flex items-center justify-center gap-2 text-destructive", children: [
-      /* @__PURE__ */ e(z, { icon: j, className: "size-5" }),
+    /* @__PURE__ */ e(F, { children: /* @__PURE__ */ t(I, { className: "flex items-center justify-center gap-2 text-destructive", children: [
+      /* @__PURE__ */ e(z, { icon: k, className: "size-5" }),
       "Access Restricted"
     ] }) }),
     /* @__PURE__ */ t("div", { className: "space-y-4", children: [
@@ -87,14 +87,14 @@ function M({
         "This restriction applies to your use of the web application. For more details, please review the",
         " ",
         /* @__PURE__ */ t(
-          I,
+          j,
           {
             href: r,
             external: !0,
             className: "text-primary underline hover:text-primary/80 inline-flex items-center gap-1",
             children: [
               "Terms of Service",
-              /* @__PURE__ */ e(k, { size: 12, className: "size-3" })
+              /* @__PURE__ */ e(b, { size: 12, className: "size-3" })
             ]
           }
         ),

package/dist/esm/components/legal-agreement/legal-agreement-panel.js

@@ -1,7 +1,7 @@
 import { jsx as l, jsxs as s } from "react/jsx-runtime";
-import { Checkbox as h } from "../checkbox/checkbox.js";
-import { CheckboxLabeled as b } from "../checkbox/checkbox-labeled.js";
-import { faTriangleExclamation as u } from "@fortawesome/free-solid-svg-icons";
+import { faTriangleExclamation as h } from "@fortawesome/free-solid-svg-icons";
+import { Checkbox as b } from "../checkbox/checkbox.js";
+import { CheckboxLabeled as u } from "../checkbox/checkbox-labeled.js";
 import { FaIcon as N } from "../icons/fa-icon.js";
 import { legalAgreementPanelRootVariants as k, legalAgreementPanelNotificationVariants as p, legalAgreementPanelV2BannerVariants as f, legalAgreementPanelCheckboxListVariants as v, legalAgreementPanelCheckboxListTitleVariants as A, legalAgreementPanelCheckboxRowVariants as x, legalAgreementPanelCheckboxLabelVariants as g } from "./legal-agreement-theme.js";
 class P {
@@ -28,7 +28,7 @@ function T({
           /* @__PURE__ */ l(
             N,
             {
-              icon: u,
+              icon: h,
               className: "size-5 shrink-0 text-yellow-500 mt-0.5"
             }
           ),
@@ -49,7 +49,7 @@ function T({
               {
                 className: x({ theme: e }),
                 children: /* @__PURE__ */ l(
-                  b,
+                  u,
                   {
                     id: d,
                     checked: m,
@@ -77,7 +77,7 @@ function T({
                 className: x({ theme: e }),
                 children: [
                   /* @__PURE__ */ l(
-                    h,
+                    b,
                     {
                       id: d,
                       checked: m,

package/dist/esm/components/link/link.js

@@ -1,21 +1,22 @@
-import { jsxs as o, jsx as r, Fragment as g } from "react/jsx-runtime";
-import { IconExternal as x } from "@gearbox-protocol/static";
-import { cva as b } from "class-variance-authority";
+import { jsxs as s, Fragment as b, jsx as n } from "react/jsx-runtime";
+import { IconExternal as g } from "@gearbox-protocol/static";
+import { cva as x } from "class-variance-authority";
 import { BaseLink as N } from "../base-link/base-link.js";
-import "react";
-import "@gearbox-protocol/sdk";
+import "@gearbox-protocol/sdk/onchain";
 import { cn as h } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
-const v = b(
+const v = x(
   "[&_.icon-wrap]:-mt-px [&_.icon-wrap]:pl-1.5 [&_.icon-wrap]:leading-none [&_.icon-wrap]:text-secondary-foreground hover:[&_.icon-wrap]:text-foreground",
   {
     variants: {
       variant: {
         default: "[&_.content-wrap]:border-b [&_.content-wrap]:border-transparent hover:[&_.content-wrap]:border-foreground",
-        underlined: "[&_.content-wrap]:border-0",
+        // Underlined in rest as well as on hover — but drawn the same way, on
+        // `.content-wrap`, so the rule stops at the words. The real
+        // `text-decoration` this used to lean on paints under the external
+        // icon too, and no markup can scope it away.
+        underlined: "[&_.content-wrap]:border-b [&_.content-wrap]:border-gray-110 hover:[&_.content-wrap]:border-foreground",
         unset: "[&_.content-wrap]:border-0"
       }
     },
@@ -23,42 +24,52 @@ const v = b(
   }
 );
 function k({
-  className: i,
-  children: n,
-  href: c,
-  target: m,
-  variant: e = "default",
-  size: l = "default",
-  color: d = "main",
-  external: a = !1,
-  asChild: f = !1,
-  ...w
+  className: p,
+  children: e,
+  href: l,
+  target: d,
+  variant: a = "default",
+  size: m = "default",
+  color: f = "main",
+  external: t = !1,
+  asChild: w = !1,
+  ...u
 }) {
-  const p = a ? /* @__PURE__ */ r("span", { className: "icon-wrap -mt-px pl-1.5 leading-none", children: /* @__PURE__ */ r(x, { size: 14 }) }) : null, s = a && typeof n == "string" ? (() => {
-    const t = n.trimEnd().lastIndexOf(" "), u = t === -1 ? "" : n.slice(0, t + 1), _ = t === -1 ? n : n.slice(t + 1);
-    return /* @__PURE__ */ o("span", { className: "content-wrap", children: [
-      u,
-      /* @__PURE__ */ o("span", { className: "whitespace-nowrap", children: [
-        _,
-        p
+  const o = t ? /* @__PURE__ */ n("span", { className: "icon-wrap -mt-px pl-1.5 leading-none", children: /* @__PURE__ */ n(g, { size: 14 }) }) : null, c = t && typeof e == "string" ? (() => {
+    const r = e.trimEnd().lastIndexOf(" "), i = r === -1 ? "" : e.slice(0, r + 1), _ = r === -1 ? e : e.slice(r + 1);
+    return /* @__PURE__ */ s(b, { children: [
+      i ? /* @__PURE__ */ n("span", { className: "content-wrap", children: i }) : null,
+      /* @__PURE__ */ s("span", { className: "inline-flex items-center whitespace-nowrap", children: [
+        /* @__PURE__ */ n("span", { className: "content-wrap", children: _ }),
+        o
       ] })
     ] });
-  })() : /* @__PURE__ */ o(g, { children: [
-    /* @__PURE__ */ r("span", { className: "content-wrap", children: n }),
-    p
-  ] });
-  return /* @__PURE__ */ r(
+  })() : o ? (
+    // Wrapped so the icon is not a direct child of the anchor: a caller that
+    // lays its anchor out as a flex row — `TitleMeta` does — would add its
+    // `gap` on top of the icon's own padding.
+    //
+    // No `whitespace-nowrap` here: a node child is often prose and must stay
+    // free to wrap. And only when there is an icon — this arm also catches
+    // non-external links, where wrapping would blockify `.content-wrap` and
+    // move an `underlined` border, to align nothing.
+    /* @__PURE__ */ s("span", { className: "inline-flex items-center", children: [
+      /* @__PURE__ */ n("span", { className: "content-wrap", children: e }),
+      o
+    ] })
+  ) : /* @__PURE__ */ n("span", { className: "content-wrap", children: e });
+  return /* @__PURE__ */ n(
     N,
     {
-      href: c,
-      target: m,
-      external: a,
-      variant: e,
-      size: l,
-      color: d,
-      className: h(v({ variant: e }), i),
-      ...w,
-      children: f ? /* @__PURE__ */ r("span", { children: s }) : s
+      href: l,
+      target: d,
+      external: t,
+      variant: a === "underlined" ? "default" : a,
+      size: m,
+      color: f,
+      className: h(v({ variant: a }), p),
+      ...u,
+      children: w ? /* @__PURE__ */ n("span", { children: c }) : c
     }
   );
 }

package/dist/esm/components/loader/loader.js

@@ -1,21 +1,19 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { IconPending as m } from "@gearbox-protocol/static";
-import * as a from "react";
+import { IconPending as a } from "@gearbox-protocol/static";
+import * as m from "react";
 import { FormattedMessageTyped as s } from "../typed-intl/index.js";
-import "@gearbox-protocol/sdk";
+import "@gearbox-protocol/sdk/onchain";
 import { cn as t } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
-const n = a.forwardRef(function({ className: o }, i) {
+const n = m.forwardRef(function({ className: o }, i) {
   return /* @__PURE__ */ r(
     "div",
     {
       ref: i,
       className: t("flex flex-wrap justify-center items-center", o),
       children: [
-        /* @__PURE__ */ e("div", { className: "mr-2 overflow-hidden", children: /* @__PURE__ */ e(m, { size: 24, className: "animate-spin" }) }),
+        /* @__PURE__ */ e("div", { className: "mr-2 overflow-hidden", children: /* @__PURE__ */ e(a, { size: 24, className: "animate-spin" }) }),
         /* @__PURE__ */ r("div", { className: "flex flex-col", children: [
           /* @__PURE__ */ e(s, { messageId: "components.loading.loading" }),
           "..."

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

@@ -1,20 +1,27 @@
-import { jsx as m } from "react/jsx-runtime";
-import { LoadingBar as d } from "../loading-bar/loading-bar.js";
-import { useIntlTyped as p } from "../typed-intl/index.js";
-import { loadingProgress as c } from "../../utils/loading.js";
-function l({
-  data: e,
-  loadingFunction: n = c,
-  message: a,
-  subMessage: t
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { Modal as c } from "../modal/modal.js";
+import { SpinnerLoader as p } from "../spinner-loader/spinner-loader.js";
+import { useIntlTyped as g } from "../typed-intl/index.js";
+import { loadingProgress as x } from "../../utils/loading.js";
+function f({
+  data: s,
+  loadingFunction: a = x,
+  message: d,
+  subMessage: i
 }) {
-  const { formatMessage: s } = p(), o = e.length === 0 ? 0 : n(e), i = Number.isFinite(o) ? o : 0, r = a ?? s(
+  const { formatMessage: n } = g(), o = s.length === 0 ? 0 : a(s), l = Number.isFinite(o) ? o : 0, m = d ?? n(
     { messageId: "components.loading.loadingPercent" },
-    { percent: i }
-  ), g = t ?? s({ messageId: "components.loading.wait" });
-  return /* @__PURE__ */ m(d, { message: r, subMessage: g });
+    { percent: l }
+  ), r = i ?? n({ messageId: "components.loading.wait" });
+  return /* @__PURE__ */ e(c, { show: !0, xsCentered: !0, zIndexLayer: "LOADING", children: /* @__PURE__ */ t("div", { className: "flex min-h-[120px] w-[250px] flex-col items-center justify-center rounded-md bg-gray-10 p-[16px] text-center", children: [
+    /* @__PURE__ */ e("div", { className: "mb-5", children: /* @__PURE__ */ e(p, {}) }),
+    /* @__PURE__ */ t("div", { className: "flex w-full flex-col gap-0", children: [
+      /* @__PURE__ */ e("span", { className: "text-sm text-foreground", children: m }),
+      r !== "" && /* @__PURE__ */ e("span", { className: "text-sm text-secondary-foreground", children: r })
+    ] })
+  ] }) });
 }
-l.displayName = "Loading";
+f.displayName = "Loading";
 export {
-  l as Loading
+  f as Loading
 };

package/dist/esm/components/markdown-text/index.js

@@ -0,0 +1,4 @@
+import { MarkdownText as e } from "./markdown-text.js";
+export {
+  e as MarkdownText
+};

package/dist/esm/components/markdown-text/markdown-text.js

@@ -0,0 +1,63 @@
+import { jsx as t } from "react/jsx-runtime";
+import { memo as s } from "react";
+import a from "react-markdown";
+import l from "remark-gfm";
+import "@gearbox-protocol/sdk/onchain";
+import { cn as d } from "../../utils/cn.js";
+import "luxon";
+import "../../utils/z-index.js";
+const n = {
+  h1: ({ children: e }) => /* @__PURE__ */ t("h1", { className: "mb-2 mt-3 text-base font-semibold text-foreground first:mt-0", children: e }),
+  h2: ({ children: e }) => /* @__PURE__ */ t("h2", { className: "mb-2 mt-3 text-sm font-semibold text-foreground first:mt-0", children: e }),
+  h3: ({ children: e }) => /* @__PURE__ */ t("h3", { className: "mb-1 mt-2 text-sm font-medium text-foreground first:mt-0", children: e }),
+  h4: ({ children: e }) => /* @__PURE__ */ t("h4", { className: "mb-1 mt-2 text-sm font-medium text-foreground first:mt-0", children: e }),
+  h5: ({ children: e }) => /* @__PURE__ */ t("h5", { className: "mb-1 mt-2 text-xs font-medium text-foreground first:mt-0", children: e }),
+  h6: ({ children: e }) => /* @__PURE__ */ t("h6", { className: "mb-1 mt-2 text-xs font-medium text-muted-foreground first:mt-0", children: e }),
+  p: ({ children: e }) => /* @__PURE__ */ t("p", { className: "mb-2 text-sm leading-relaxed text-foreground last:mb-0", children: e }),
+  ul: ({ children: e }) => /* @__PURE__ */ t("ul", { className: "mb-2 list-disc space-y-1 pl-5 text-sm text-foreground last:mb-0", children: e }),
+  ol: ({ children: e }) => /* @__PURE__ */ t("ol", { className: "mb-2 list-decimal space-y-1 pl-5 text-sm text-foreground last:mb-0", children: e }),
+  li: ({ children: e }) => /* @__PURE__ */ t("li", { className: "leading-relaxed", children: e }),
+  a: ({ href: e, children: o }) => /* @__PURE__ */ t(
+    "a",
+    {
+      href: e,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: "text-primary underline underline-offset-2 hover:opacity-80",
+      children: o
+    }
+  ),
+  strong: ({ children: e }) => /* @__PURE__ */ t("strong", { className: "font-semibold text-foreground", children: e }),
+  em: ({ children: e }) => /* @__PURE__ */ t("em", { className: "italic", children: e }),
+  code: ({ className: e, children: o }) => e?.includes("language-") ? /* @__PURE__ */ t("code", { className: "block font-mono text-xs text-foreground", children: o }) : /* @__PURE__ */ t("code", { className: "rounded bg-muted/80 px-1 py-0.5 font-mono text-xs text-foreground", children: o }),
+  pre: ({ children: e }) => /* @__PURE__ */ t("pre", { className: "mb-2 overflow-x-auto rounded-md border border-border bg-muted/60 p-2 text-xs last:mb-0", children: e }),
+  blockquote: ({ children: e }) => /* @__PURE__ */ t("blockquote", { className: "mb-2 border-l-2 border-border pl-3 text-sm text-muted-foreground last:mb-0", children: e }),
+  hr: () => /* @__PURE__ */ t("hr", { className: "my-3 border-border" }),
+  table: ({ children: e }) => /* @__PURE__ */ t("div", { className: "mb-2 overflow-x-auto last:mb-0", children: /* @__PURE__ */ t("table", { className: "w-full border-collapse text-sm text-foreground", children: e }) }),
+  thead: ({ children: e }) => /* @__PURE__ */ t("thead", { children: e }),
+  tbody: ({ children: e }) => /* @__PURE__ */ t("tbody", { children: e }),
+  tr: ({ children: e }) => /* @__PURE__ */ t("tr", { className: "border-b border-border last:border-0", children: e }),
+  th: ({ children: e }) => /* @__PURE__ */ t("th", { className: "px-3 py-1.5 text-left align-top font-semibold text-foreground", children: e }),
+  td: ({ children: e }) => /* @__PURE__ */ t("td", { className: "px-3 py-1.5 align-top text-muted-foreground", children: e })
+};
+function c(e) {
+  const o = /(?<![\]([<])(https?:\/\/[^\s<>()[\]]+[^\s<>()[\].,;:!?'"])/g;
+  return e.replace(o, (r) => `[${r}](${r})`);
+}
+const h = s(function({
+  content: o,
+  className: r
+}) {
+  const m = c(o);
+  return /* @__PURE__ */ t("div", { className: d("min-w-0 text-sm", r), children: /* @__PURE__ */ t(
+    a,
+    {
+      remarkPlugins: [l],
+      components: n,
+      children: m
+    }
+  ) });
+});
+export {
+  h as MarkdownText
+};

package/dist/esm/components/modal/modal.js

@@ -1,12 +1,10 @@
 import { jsx as t, jsxs as m } from "react/jsx-runtime";
 import * as a from "@radix-ui/react-dialog";
 import { cva as D } from "class-variance-authority";
-import * as i from "react";
-import "@gearbox-protocol/sdk/common-utils";
+import * as s from "react";
 import { useIsMobile as M } from "../../hooks/use-media-query.js";
-import "@gearbox-protocol/sdk";
+import "@gearbox-protocol/sdk/onchain";
 import { cn as o } from "../../utils/cn.js";
-import "sonner";
 import "luxon";
 import { Z_INDEX as O, Z_INDEX_VALUES as N } from "../../utils/z-index.js";
 const u = "gb-modal-open";
@@ -28,30 +26,30 @@ const b = "before:content-[''] before:absolute before:inset-0 after:z-[-1] befor
     colorTheme: "default",
     backdrop: "default"
   }
-}), w = i.forwardRef(
+}), w = s.forwardRef(
   ({
     show: r = !0,
     colorTheme: g = "default",
     backdrop: p = "default",
     xsCentered: v = !1,
-    onClickOutside: s,
+    onClickOutside: i,
     zIndexLayer: c = "MODAL",
     className: x,
     children: y,
     ...h
   }, C) => {
     const _ = M(), d = O[c], f = { zIndex: N[c] };
-    i.useEffect(() => {
+    s.useEffect(() => {
       if (!(typeof document > "u") && r)
         return n += 1, document.body.classList.add(u), () => {
           n = Math.max(0, n - 1), n === 0 && document.body.classList.remove(u);
         };
     }, [r]);
-    const l = i.useCallback(
+    const l = s.useCallback(
       (e) => {
-        e || s?.();
+        e || i?.();
       },
-      [s]
+      [i]
     );
     return r ? /* @__PURE__ */ t(a.Root, { open: r, onOpenChange: l, modal: !0, children: /* @__PURE__ */ m(a.Portal, { children: [
       /* @__PURE__ */ t(

package/dist/esm/components/navbar-logo/navbar-logo.js

@@ -1,26 +1,23 @@
-import { jsx as n } from "react/jsx-runtime";
-import "react";
-import "@gearbox-protocol/sdk";
-import { cn as a } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
+import { jsx as a } from "react/jsx-runtime";
+import "@gearbox-protocol/sdk/onchain";
+import { cn as m } from "../../utils/cn.js";
 import "luxon";
 import "../../utils/z-index.js";
-function f({
+function s({
   size: o,
   className: t,
   style: i,
   ...r
 }) {
-  const m = o ? { width: o, height: o } : {};
+  const n = o ? { width: o, height: o } : {};
   return (
     // biome-ignore lint/performance/noImgElement: Universal component that works outside Next.js
-    /* @__PURE__ */ n(
+    /* @__PURE__ */ a(
       "img",
       {
         alt: "Logo",
-        className: a("object-contain", t),
-        style: { ...m, ...i },
+        className: m("object-contain", t),
+        style: { ...n, ...i },
         loading: "lazy",
         decoding: "async",
         ...r
@@ -29,5 +26,5 @@ function f({
   );
 }
 export {
-  f as NavBarLogo
+  s as NavBarLogo
 };

package/dist/esm/components/network-icon/index.js

@@ -1,6 +1,4 @@
-import { NetworkIcon as t } from "./network-icon.js";
-import { NetworkIndicator as c } from "./network-indicator.js";
+import { NetworkIcon as e } from "./network-icon.js";
 export {
-  t as NetworkIcon,
-  c as NetworkIndicator
+  e as NetworkIcon
 };