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

package/dist/esm/components/layout/block/block.js

@@ -1,50 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import "react";
-import "@gearbox-protocol/sdk";
-import { cn as o } from "../../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../../utils/z-index.js";
-const f = {
-  none: "mb-0",
-  sm: "mb-4",
-  md: "mb-6",
-  lg: "mb-8"
-}, l = {
-  "flex-start": "justify-start",
-  center: "justify-center",
-  "flex-end": "justify-end",
-  between: "justify-between"
-}, a = {
-  "flex-start": "items-start",
-  center: "items-center",
-  "flex-end": "items-end",
-  stretch: "items-stretch"
-};
-function w({
-  children: t,
-  margin: e = "md",
-  justify: s = "flex-start",
-  align: r = "flex-start",
-  className: m,
-  ...n
-}) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: o(
-        "flex flex-row flex-nowrap",
-        f[e],
-        l[s],
-        a[r],
-        m
-      ),
-      ...n,
-      children: t
-    }
-  );
-}
-export {
-  w as Block
-};

package/dist/esm/components/layout/block/index.js

@@ -1,4 +0,0 @@
-import { Block as c } from "./block.js";
-export {
-  c as Block
-};

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

@@ -1,237 +0,0 @@
-import { jsx as e, jsxs as t, Fragment as x } from "react/jsx-runtime";
-import * as N from "react";
-import { BaseLink as j } from "../../base-link/base-link.js";
-import { BlockSync as k } from "../../block-sync/block-sync.js";
-import { cn as h } from "../../../utils/cn.js";
-import { AppLogo as F } from "../app-logo/app-logo.js";
-import { LegalDisclaimer as D } from "../legal-disclaimer/legal-disclaimer.js";
-import { SocialIcons as L } from "../social-icons/social-icons.js";
-const G = N.forwardRef(
-  ({
-    logo: a,
-    copyright: s,
-    social: r,
-    version: i,
-    secondaryInfo: c,
-    legalLinks: l,
-    containerClassName: d,
-    className: n,
-    children: m,
-    mobileExtraContent: f,
-    ...o
-  }, u) => /* @__PURE__ */ e(
-    "footer",
-    {
-      ref: u,
-      className: h(
-        "relative w-full border-t bg-card border-border flex items-center justify-center",
-        n
-      ),
-      ...o,
-      children: /* @__PURE__ */ t(
-        "div",
-        {
-          className: h(
-            "flex flex-col sm:flex-row sm:flex-nowrap justify-between items-center sm:items-start gap-4 sm:gap-0 py-6 w-full px-4",
-            d
-          ),
-          children: [
-            /* @__PURE__ */ t("div", { className: "text-center sm:text-left text-sm text-muted-foreground w-full sm:w-auto", children: [
-              a && /* @__PURE__ */ t(x, { children: [
-                /* @__PURE__ */ e("div", { className: "flex justify-center sm:justify-start", children: a }),
-                /* @__PURE__ */ e("div", { className: "h-2" })
-              ] }),
-              s && /* @__PURE__ */ e("div", { children: s }),
-              /* @__PURE__ */ e("div", { className: "mt-4 flex flex-col items-center justify-center gap-2 sm:hidden", children: f })
-            ] }),
-            /* @__PURE__ */ t("div", { className: "w-full sm:w-auto", children: [
-              r && /* @__PURE__ */ t(x, { children: [
-                /* @__PURE__ */ e("div", { className: "flex items-center justify-center sm:justify-end gap-2.5", children: r }),
-                /* @__PURE__ */ e("div", { className: "h-3" })
-              ] }),
-              /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center justify-center sm:justify-end gap-2 text-sm text-muted-foreground", children: [
-                i && /* @__PURE__ */ e("span", { children: i }),
-                c && /* @__PURE__ */ t(x, { children: [
-                  /* @__PURE__ */ e("span", { className: "h-1 w-1 rounded-full bg-muted-foreground/30" }),
-                  c
-                ] }),
-                l && /* @__PURE__ */ t(x, { children: [
-                  /* @__PURE__ */ e("span", { className: "h-1 w-1 rounded-full bg-muted-foreground/30" }),
-                  l
-                ] })
-              ] })
-            ] }),
-            m
-          ]
-        }
-      )
-    }
-  )
-);
-G.displayName = "Footer";
-function b({ href: a, text: s, external: r = !1 }) {
-  return /* @__PURE__ */ e(
-    j,
-    {
-      href: a,
-      external: r,
-      variant: "underlined",
-      color: "secondary",
-      size: "sm",
-      children: s
-    }
-  );
-}
-function g({
-  title: a,
-  links: s
-}) {
-  return /* @__PURE__ */ t("div", { className: "flex flex-col gap-1 md:items-end", children: [
-    /* @__PURE__ */ e("h3", { className: "text-foreground", children: a }),
-    /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-4 justify-end", children: s.map((r, i) => /* @__PURE__ */ t(N.Fragment, { children: [
-      /* @__PURE__ */ e(b, { ...r }),
-      i < s.length - 1 && /* @__PURE__ */ e("span", { className: "text-muted-foreground text-sm", children: "•" })
-    ] }, r.href)) })
-  ] });
-}
-function z({
-  appName: a,
-  legalAppName: s,
-  legalReferences: r,
-  legalContent: i,
-  className: c,
-  version: l,
-  discordAddr: d,
-  landingAddr: n,
-  twitterAddr: m,
-  telegramAddr: f,
-  blockSyncProps: o,
-  onPress: u,
-  showLegalLinks: v,
-  showDeveloperLinks: w
-}) {
-  const y = !!(m || d || f);
-  return /* @__PURE__ */ e(
-    "footer",
-    {
-      className: h(
-        "relative w-full border-t bg-card border-border",
-        "text-sm font-normal leading-[120%] tracking-[-0.14px] text-secondary-foreground",
-        c
-      ),
-      children: /* @__PURE__ */ t("div", { className: "flex flex-col md:flex-row md:flex-nowrap justify-between py-6 px-8", children: [
-        /* @__PURE__ */ t("div", { className: "w-full md:w-auto text-center md:text-left flex flex-col items-center md:items-start", children: [
-          /* @__PURE__ */ e(F, { appName: a }),
-          /* @__PURE__ */ e("div", { className: "h-2" }),
-          (() => {
-            const p = i ?? (r ? /* @__PURE__ */ e(
-              D,
-              {
-                appName: s,
-                hrefs: r
-              }
-            ) : /* @__PURE__ */ t("div", { className: "text-muted-foreground text-center md:text-left", children: [
-              /* @__PURE__ */ t("div", { children: [
-                "Copyright © Gearbox Foundation 2023-",
-                (/* @__PURE__ */ new Date()).getFullYear(),
-                "."
-              ] }),
-              /* @__PURE__ */ e("div", { children: "Built at ETHGlobal MarketMake hackathon." })
-            ] }));
-            return u ? /* @__PURE__ */ e(
-              "button",
-              {
-                type: "button",
-                onClick: u,
-                className: "cursor-pointer text-left bg-transparent border-none p-0 m-0",
-                children: p
-              }
-            ) : p;
-          })(),
-          (l || o) && // Breakpoint synced with HelpCenterContainer (hidden md:flex).
-          /* @__PURE__ */ t("div", { className: "flex flex-col items-center gap-2 mt-4 md:hidden", children: [
-            l && /* @__PURE__ */ t("span", { children: [
-              "Version ",
-              l
-            ] }),
-            o && /* @__PURE__ */ e(k, { ...o })
-          ] })
-        ] }),
-        /* @__PURE__ */ t("div", { className: "hidden md:flex flex-col gap-4", children: [
-          y && /* @__PURE__ */ e("div", { className: "flex items-center justify-end gap-2.5", children: /* @__PURE__ */ e(
-            L,
-            {
-              twitterAddr: m,
-              discordAddr: d,
-              telegramAddr: f
-            }
-          ) }),
-          v && r && /* @__PURE__ */ e(
-            g,
-            {
-              title: "Legal",
-              links: [
-                {
-                  href: r.termsOfService,
-                  text: "Terms of Service"
-                },
-                {
-                  href: r.privacyNotice,
-                  text: "Privacy Notice"
-                },
-                {
-                  href: r.riskDisclosure,
-                  text: "Risk Disclosure"
-                }
-              ]
-            }
-          ),
-          w && /* @__PURE__ */ e(
-            g,
-            {
-              title: "Developers",
-              links: [
-                {
-                  href: "https://docs.gearbox.fi/gearbox-permissionless-doc",
-                  text: "Documentation",
-                  external: !0
-                },
-                {
-                  href: "https://docs.gearbox.finance/risk-and-security/audits-bug-bounty",
-                  text: "Audits",
-                  external: !0
-                },
-                {
-                  href: "https://github.com/Gearbox-protocol",
-                  text: "GitHub",
-                  external: !0
-                }
-              ]
-            }
-          ),
-          (l || n) && /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center justify-end gap-2 text-muted-foreground", children: [
-            l && /* @__PURE__ */ t("span", { children: [
-              "Version ",
-              l
-            ] }),
-            l && n && /* @__PURE__ */ e("span", { className: "h-1 w-1 rounded-full bg-muted-foreground/30" }),
-            n && /* @__PURE__ */ e(
-              b,
-              {
-                href: `${n}/terms`,
-                text: "Legal Info",
-                external: !0
-              }
-            )
-          ] })
-        ] })
-      ] })
-    }
-  );
-}
-export {
-  G as Footer,
-  b as FooterLink,
-  g as FooterLinkSection,
-  z as GearboxFooter
-};

package/dist/esm/components/layout/footer/index.js

@@ -1,7 +0,0 @@
-import { Footer as r, FooterLink as t, FooterLinkSection as F, GearboxFooter as i } from "./footer.js";
-export {
-  r as Footer,
-  t as FooterLink,
-  F as FooterLinkSection,
-  i as GearboxFooter
-};

package/dist/esm/components/layout/header/header.js

@@ -1,93 +0,0 @@
-import { jsx as e, jsxs as f } from "react/jsx-runtime";
-import * as r from "react";
-import { AppBarDropdownMenu as k, AppBarHamburgerButton as C } from "../../app-bar/app-bar.js";
-import { SimpleDropdown as H } from "../../simple-dropdown/simple-dropdown.js";
-import "../../simple-dropdown/simple-dropdown-menu-item.js";
-import { cn as p } from "../../../utils/cn.js";
-const h = r.createContext(
-  null
-);
-function R() {
-  const t = r.useContext(h);
-  if (!t)
-    throw new Error("useMobileMenu must be used within Header component");
-  return t;
-}
-const O = r.forwardRef(
-  ({
-    navigation: t,
-    logo: s,
-    actions: n,
-    fixed: i = !1,
-    sticky: u = !1,
-    containerClassName: x,
-    className: b,
-    children: j,
-    mobileMenuContent: a,
-    mobileMenuOpen: o,
-    onMobileMenuOpenChange: c,
-    ...g
-  }, w) => {
-    const [v, N] = r.useState(!1), l = o !== void 0, M = l ? o : v, d = r.useCallback(
-      (m) => {
-        l || N(m), c?.(m);
-      },
-      [l, c]
-    );
-    return /* @__PURE__ */ e(
-      "header",
-      {
-        ref: w,
-        className: p(
-          "relative w-full bg-background h-18 flex flex-nowrap items-center",
-          i && "fixed top-0 left-0 right-0 z-50",
-          u && "sticky top-0 z-50",
-          b
-        ),
-        "data-fixed": i ? "true" : void 0,
-        ...g,
-        children: /* @__PURE__ */ f(
-          "div",
-          {
-            className: p(
-              "w-full h-full flex items-stretch justify-between mx-auto px-4 md:px-4 lg:px-10",
-              x
-            ),
-            children: [
-              /* @__PURE__ */ f("div", { className: "h-full flex items-center", children: [
-                /* @__PURE__ */ e("div", { className: "flex items-center gap-1 sm:gap-2 shrink-0 lg:hidden", children: a && /* @__PURE__ */ e(
-                  H,
-                  {
-                    open: M,
-                    onOpenChange: d,
-                    title: /* @__PURE__ */ e(C, { size: "md" }),
-                    asChild: !0,
-                    align: "start",
-                    className: "p-0 border-0 bg-transparent shadow-none",
-                    children: /* @__PURE__ */ e(k, { children: /* @__PURE__ */ e(
-                      h.Provider,
-                      {
-                        value: {
-                          closeMobileMenu: () => d(!1)
-                        },
-                        children: a
-                      }
-                    ) })
-                  }
-                ) }),
-                s && /* @__PURE__ */ e("div", { className: "flex items-center shrink-0", children: s })
-              ] }),
-              t && /* @__PURE__ */ e("div", { className: "hidden lg:flex items-stretch flex-1 min-w-0 h-full", children: t }),
-              /* @__PURE__ */ e("div", { className: "flex items-center gap-1 sm:gap-2 shrink-0", children: n && /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: n }) })
-            ]
-          }
-        )
-      }
-    );
-  }
-);
-O.displayName = "Header";
-export {
-  O as Header,
-  R as useMobileMenu
-};

package/dist/esm/components/layout/header/index.js

@@ -1,5 +0,0 @@
-import { Header as r, useMobileMenu as u } from "./header.js";
-export {
-  r as Header,
-  u as useMobileMenu
-};

package/dist/esm/components/layout/legal-disclaimer/index.js

@@ -1,4 +0,0 @@
-import { LegalDisclaimer as a } from "./legal-disclaimer.js";
-export {
-  a as LegalDisclaimer
-};

package/dist/esm/components/layout/legal-disclaimer/legal-disclaimer.js

@@ -1,46 +0,0 @@
-import { jsxs as i, jsx as r } from "react/jsx-runtime";
-import { BaseLink as t } from "../../base-link/base-link.js";
-function c({
-  hrefs: e,
-  appName: s = "Permissionless Interface"
-}) {
-  return /* @__PURE__ */ i("p", { className: "text-muted-foreground max-w-md text-sm", children: [
-    "Any use of and/or interaction with the ",
-    s,
-    " is subject to the",
-    " ",
-    /* @__PURE__ */ r(
-      t,
-      {
-        href: e.termsOfService,
-        className: "underline hover:text-foreground transition-colors text-sm",
-        children: "Terms of Service"
-      }
-    ),
-    " ",
-    "and",
-    " ",
-    /* @__PURE__ */ r(
-      t,
-      {
-        href: e.privacyNotice,
-        className: "underline hover:text-foreground transition-colors text-sm",
-        children: "Privacy Notice"
-      }
-    ),
-    ", and acceptance of risks described in the",
-    " ",
-    /* @__PURE__ */ r(
-      t,
-      {
-        href: e.riskDisclosure,
-        className: "underline hover:text-foreground transition-colors text-sm",
-        children: "Risk Disclosure Statement"
-      }
-    ),
-    "."
-  ] });
-}
-export {
-  c as LegalDisclaimer
-};

package/dist/esm/components/layout/page-layout/index.js

@@ -1,4 +0,0 @@
-import { PageLayout as e } from "./page-layout.js";
-export {
-  e as PageLayout
-};

package/dist/esm/components/layout/page-layout/page-layout.js

@@ -1,39 +0,0 @@
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import { BackButton as c } from "../../buttons/back-button/back-button.js";
-import { PageTitle as f } from "../../page-title/page-title.js";
-import { Container as x } from "../container/container.js";
-function C({
-  children: e,
-  title: i,
-  description: o,
-  icon: m,
-  backButton: r,
-  actionButton: a,
-  maxContainerWidth: l = "xl",
-  containerClassName: n
-}) {
-  return /* @__PURE__ */ s(x, { maxWidth: l, className: n, children: [
-    /* @__PURE__ */ t(
-      f,
-      {
-        backButton: r ? /* @__PURE__ */ t(
-          c,
-          {
-            href: r.href,
-            text: r.text,
-            onClick: r.onClick
-          }
-        ) : void 0,
-        icon: m,
-        actions: a,
-        subtitle: o,
-        className: "mb-6",
-        children: i
-      }
-    ),
-    e
-  ] });
-}
-export {
-  C as PageLayout
-};

package/dist/esm/components/layout/social-icons/index.js

@@ -1,4 +0,0 @@
-import { SocialIcons as r } from "./social-icons.js";
-export {
-  r as SocialIcons
-};

package/dist/esm/components/layout/social-icons/social-icons.js

@@ -1,61 +0,0 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { IconTwitter as c, IconDiscord as h, IconTelegram as u } from "@gearbox-protocol/static";
-import { BaseLink as n } from "../../base-link/base-link.js";
-import { cn as a } from "../../../utils/cn.js";
-const t = a(
-  "inline-flex items-center justify-center",
-  "w-8 h-8 rounded-full",
-  "border border-white/20 hover:border-white/30",
-  "bg-transparent text-white transition-colors duration-200"
-);
-function d({
-  twitterAddr: i,
-  discordAddr: r,
-  telegramAddr: s,
-  className: o
-}) {
-  return /* @__PURE__ */ l("div", { className: a("flex items-center gap-2.5", o), children: [
-    i && /* @__PURE__ */ e(
-      n,
-      {
-        href: i,
-        external: !0,
-        size: "unset",
-        variant: "unset",
-        className: t,
-        children: /* @__PURE__ */ e(
-          c,
-          {
-            size: 18,
-            style: { lineHeight: 0, padding: "1px 0 0 1px" }
-          }
-        )
-      }
-    ),
-    r && /* @__PURE__ */ e(
-      n,
-      {
-        href: r,
-        external: !0,
-        size: "unset",
-        variant: "unset",
-        className: t,
-        children: /* @__PURE__ */ e(h, { size: 19, style: { lineHeight: 0 } })
-      }
-    ),
-    s && /* @__PURE__ */ e(
-      n,
-      {
-        href: s,
-        external: !0,
-        size: "unset",
-        variant: "unset",
-        className: t,
-        children: /* @__PURE__ */ e(u, { size: 19, style: { lineHeight: 0 } })
-      }
-    )
-  ] });
-}
-export {
-  d as SocialIcons
-};

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

@@ -1,11 +0,0 @@
-import { Navbar as o, NavbarNav as v, navbarVariants as t } from "./navbar.js";
-import { NavbarIndicatorProvider as e, useNavbarIndicator as N } from "./navbar-indicator-context.js";
-import { NavbarWithOverflow as f } from "./navbar-with-overflow.js";
-export {
-  o as Navbar,
-  e as NavbarIndicatorProvider,
-  v as NavbarNav,
-  f as NavbarWithOverflow,
-  t as navbarVariants,
-  N as useNavbarIndicator
-};

package/dist/esm/components/navbar/navbar-indicator-context.js

@@ -1,46 +0,0 @@
-import { jsx as x } from "react/jsx-runtime";
-import { createContext as C, useRef as a, useState as h, useCallback as s, useEffect as l, useContext as b } from "react";
-const d = C(
-  null
-), z = ({ children: f }) => {
-  const i = a(/* @__PURE__ */ new Map()), [e, m] = h(null), r = a(null), c = a(null), v = s((t, o) => {
-    i.current.set(t, o);
-  }, []), I = s((t) => {
-    i.current.delete(t);
-  }, []), n = s((t) => {
-    if (!r.current || !c.current) return;
-    const o = i.current.get(t);
-    if (!o) return;
-    const u = o.getBoundingClientRect(), R = c.current.getBoundingClientRect(), p = u.left - R.left + c.current.scrollLeft, w = u.width;
-    r.current.style.opacity = "1", r.current.style.transform = `translateX(${p}px)`, r.current.style.width = `${w}px`;
-  }, []), g = s(
-    (t) => {
-      m(t), n(t);
-    },
-    [n]
-  );
-  return l(() => {
-    e && n(e);
-  }, [e, n]), l(() => {
-    const t = () => {
-      e && n(e);
-    };
-    return window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
-  }, [e, n]), /* @__PURE__ */ x(
-    d.Provider,
-    {
-      value: {
-        registerItem: v,
-        unregisterItem: I,
-        setActiveItem: g,
-        containerRef: c,
-        indicatorRef: r
-      },
-      children: f
-    }
-  );
-}, A = () => b(d);
-export {
-  z as NavbarIndicatorProvider,
-  A as useNavbarIndicator
-};