@gearbox-protocol/permissionless-ui 1.27.0 → 2.0.0-next.1

package/dist/esm/components/breadcrumbs/breadcrumbs.js

@@ -5,10 +5,11 @@ import "react";
 import "@gearbox-protocol/sdk";
 import { cn as c } from "../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
 const u = "text-sm! transition-colors text-muted-foreground! hover:text-foreground!";
-function R({
+function T({
   items: n,
   onClick: d,
   currentStep: m,
@@ -61,5 +62,5 @@ function R({
   }) }) });
 }
 export {
-  R as BreadCrumbs
+  T as BreadCrumbs
 };

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

@@ -1,37 +1,40 @@
-import { jsxs as n, jsx as i } from "react/jsx-runtime";
-import { cva as m } from "class-variance-authority";
+import { jsxs as i, jsx as m } from "react/jsx-runtime";
+import { cva as p } from "class-variance-authority";
 import * as d from "react";
 import "@gearbox-protocol/sdk";
-import { cn as p } from "../../utils/cn.js";
+import { cn as s } from "../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
-const s = m(
+const u = p(
   [
     "flex cursor-pointer select-none items-center border rounded-md p-3",
     "mb-0 border-gray-20",
     "data-[checked=true]:outline data-[checked=true]:outline-2 data-[checked=true]:outline-primary"
   ].join(" ")
-), u = d.forwardRef(
+), l = d.forwardRef(
   ({
     checked: e,
     disabled: o = !1,
     onChange: t,
     children: r,
-    className: a
-  }, c) => /* @__PURE__ */ n(
+    className: a,
+    ...c
+  }, n) => /* @__PURE__ */ i(
     "label",
     {
-      ref: c,
+      ...c,
+      ref: n,
       "data-checked": e,
-      className: p(
-        s(),
+      className: s(
+        u(),
         o && "cursor-not-allowed opacity-50",
         a
       ),
       children: [
         r,
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ m(
           "input",
           {
             type: "checkbox",
@@ -45,7 +48,7 @@ const s = m(
     }
   )
 );
-u.displayName = "ButtonCheckbox";
+l.displayName = "ButtonCheckbox";
 export {
-  u as ButtonCheckbox
+  l as ButtonCheckbox
 };

package/dist/esm/components/buttons/back-button/back-button.js

@@ -6,6 +6,7 @@ import "react";
 import "@gearbox-protocol/sdk";
 import { cn as p } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 const x = f("flex items-center transition-colors", {
@@ -34,20 +35,20 @@ function l({
 }) {
   return /* @__PURE__ */ a("a", { href: t, className: r, onClick: o, children: e });
 }
-function L({
+function N({
   href: t,
   text: r,
   onClick: o,
   className: e,
   variant: i,
-  size: n,
-  LinkComponent: m = l
+  size: m,
+  LinkComponent: n = l
 }) {
   return /* @__PURE__ */ s(
-    m,
+    n,
     {
       href: t,
-      className: p(x({ variant: i, size: n, className: e })),
+      className: p(x({ variant: i, size: m, className: e })),
       onClick: o,
       children: [
         /* @__PURE__ */ a(c, { icon: u, className: "mr-2 size-4" }),
@@ -57,6 +58,6 @@ function L({
   );
 }
 export {
-  L as BackButton,
+  N as BackButton,
   x as backButtonVariants
 };

package/dist/esm/components/buttons/button/button.js

@@ -1,10 +1,11 @@
-import { jsx as p } from "react/jsx-runtime";
+import { jsx as u } from "react/jsx-runtime";
 import { Slot as c } from "@radix-ui/react-slot";
 import { cva as x } from "class-variance-authority";
 import * as y from "react";
 import "@gearbox-protocol/sdk";
 import { cn as e } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 const h = x(
@@ -81,20 +82,20 @@ const h = x(
     onClick: n,
     ...b
   }, g) => {
-    const l = s ? c : "button", u = (r) => {
+    const l = s ? c : "button", p = (r) => {
       if (o) {
         r.preventDefault(), r.stopPropagation();
         return;
       }
       n?.(r);
     };
-    return /* @__PURE__ */ p(
+    return /* @__PURE__ */ u(
       l,
       {
         className: e(h({ variant: d, size: a, className: t, width: i })),
         ref: g,
         disabled: o,
-        onClick: u,
+        onClick: p,
         ...b
       }
     );

package/dist/esm/components/buttons/copy-button/copy-button.js

@@ -5,8 +5,9 @@ import { Button as C } from "../button/button.js";
 import { faCheck as x } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as w } from "../../icons/fa-icon.js";
 import "@gearbox-protocol/sdk";
-import { cn as a } from "../../../utils/cn.js";
+import { cn as i } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 const N = {
@@ -22,7 +23,7 @@ const N = {
   5: 20,
   6: 24
 }, j = r.forwardRef(
-  ({ text: n, className: l, iconSize: i = "3.5", successDuration: p = 1500, ...m }, u) => {
+  ({ text: n, className: l, iconSize: a = "3.5", successDuration: p = 1500, ...m }, u) => {
     const [e, s] = r.useState(!1), o = r.useRef(null), f = async () => {
       try {
         await navigator.clipboard.writeText(n), o.current && clearTimeout(o.current), s(!0), o.current = setTimeout(() => {
@@ -31,14 +32,14 @@ const N = {
       } catch (d) {
         console.error("Failed to copy:", d);
       }
-    }, c = N[i];
+    }, c = N[a];
     return /* @__PURE__ */ y(
       C,
       {
         ref: u,
         variant: "text",
         size: "auto",
-        className: a("p-1! border-0! relative", l),
+        className: i("p-1! border-0! relative", l),
         onClick: f,
         title: e ? "Copied!" : "Copy to clipboard",
         ...m,
@@ -46,7 +47,7 @@ const N = {
           /* @__PURE__ */ t(
             "span",
             {
-              className: a(
+              className: i(
                 "absolute inset-0 flex items-center justify-center transition-all duration-200",
                 e ? "opacity-100 scale-100 text-green-500" : "opacity-0 scale-50 text-green-500"
               ),
@@ -56,11 +57,11 @@ const N = {
           /* @__PURE__ */ t(
             "span",
             {
-              className: a(
+              className: i(
                 "flex items-center justify-center transition-all duration-200",
                 e ? "opacity-0 scale-50" : "opacity-100 scale-100"
               ),
-              children: /* @__PURE__ */ t(h, { size: b[i], className: c })
+              children: /* @__PURE__ */ t(h, { size: b[a], className: c })
             }
           )
         ]

package/dist/esm/components/buttons/external-button/external-button.js

@@ -1,10 +1,11 @@
 import { jsx as t } from "react/jsx-runtime";
-import { IconExternal as m } from "@gearbox-protocol/static";
+import { IconExternal as e } from "@gearbox-protocol/static";
 import * as p from "react";
 import { Button as s } from "../button/button.js";
 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 c = {
@@ -20,17 +21,17 @@ const c = {
   5: 20,
   6: 24
 }, w = p.forwardRef(
-  ({ url: n, className: i, iconSize: o = "3.5", ...a }, e) => /* @__PURE__ */ t(
+  ({ url: i, className: n, iconSize: o = "3.5", ...m }, a) => /* @__PURE__ */ t(
     s,
     {
-      ref: e,
+      ref: a,
       variant: "text",
       size: "auto",
-      className: r("p-1! border-0!", i),
-      onClick: () => window.open(n, "_blank"),
-      ...a,
+      className: r("p-1! border-0!", n),
+      onClick: () => window.open(i, "_blank"),
+      ...m,
       children: /* @__PURE__ */ t(
-        m,
+        e,
         {
           size: l[o],
           className: r(c[o])

package/dist/esm/components/buttons/navigation-button/navigation-button.js

@@ -1,16 +1,17 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
 import * as a from "react";
 import { BaseLink as s } from "../../base-link/base-link.js";
 import "@gearbox-protocol/sdk";
 import { cn as d } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
-const m = a.forwardRef(({ href: o, text: r, isActive: e, ...t }, n) => /* @__PURE__ */ i(
+const m = a.forwardRef(({ href: o, text: r, isActive: e, ...t }, i) => /* @__PURE__ */ n(
   s,
   {
     href: o,
-    ref: n,
+    ref: i,
     className: d(
       "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:pointer-events-none disabled:opacity-50 relative",
       "text-decoration-none text-foreground hover:text-foreground hover:bg-secondary px-4 py-2",

package/dist/esm/components/buttons/range-buttons/range-buttons.js

@@ -3,9 +3,10 @@ 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";
-function b({
+function f({
   range: n,
   rangeList: o,
   setRange: i,
@@ -31,5 +32,5 @@ function b({
   )) });
 }
 export {
-  b as RangeButtons
+  f as RangeButtons
 };

package/dist/esm/components/card-grid/card-grid.js

@@ -4,6 +4,7 @@ import * as e from "react";
 import "@gearbox-protocol/sdk";
 import { cn as n } from "../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
 const p = a("grid w-full", {
@@ -68,11 +69,11 @@ const p = a("grid w-full", {
     columnsSm: d,
     gap: t,
     justifyItemContent: l,
-    ...c
-  }, m) => /* @__PURE__ */ g(
+    ...m
+  }, c) => /* @__PURE__ */ g(
     "div",
     {
-      ref: m,
+      ref: c,
       className: n(
         p({
           columns: r,
@@ -84,7 +85,7 @@ const p = a("grid w-full", {
           className: s
         })
       ),
-      ...c
+      ...m
     }
   )
 );

package/dist/esm/components/cards/card/card.js

@@ -4,6 +4,7 @@ import * as o from "react";
 import "@gearbox-protocol/sdk";
 import { cn as d } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 const n = s(

package/dist/esm/components/cards/expandable-call/expandable-call.js

@@ -1,38 +1,39 @@
-import { jsxs as e, jsx as o } from "react/jsx-runtime";
-import * as m from "react";
+import { jsxs as t, jsx as o } from "react/jsx-runtime";
+import * as n from "react";
 import { faCaretDown as d } from "@fortawesome/free-solid-svg-icons";
-import { FaIcon as c } from "../../icons/fa-icon.js";
+import { FaIcon as p } from "../../icons/fa-icon.js";
 import "@gearbox-protocol/sdk";
-import { cn as p } from "../../../utils/cn.js";
+import { cn as c } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
-function v({
+function y({
   header: a,
-  children: s,
-  index: i,
-  isExpandable: t = !0
+  children: i,
+  index: s,
+  isExpandable: e = !0
 }) {
-  const [r, n] = m.useState(!1);
-  return /* @__PURE__ */ e("div", { className: "rounded bg-gray-900/50", children: [
-    /* @__PURE__ */ e(
+  const [r, m] = n.useState(!1);
+  return /* @__PURE__ */ t("div", { className: "rounded bg-gray-900/50", children: [
+    /* @__PURE__ */ t(
       "div",
       {
-        className: `flex ${t ? "cursor-pointer" : ""} items-center gap-2 p-3`,
+        className: `flex ${e ? "cursor-pointer" : ""} items-center gap-2 p-3`,
         onClick: () => {
-          t && n(!r);
+          e && m(!r);
         },
         children: [
-          /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: [
+          /* @__PURE__ */ t("span", { className: "text-muted-foreground", children: [
             "#",
-            i
+            s
           ] }),
           a,
           /* @__PURE__ */ o(
-            c,
+            p,
             {
               icon: d,
-              className: p(
+              className: c(
                 "ml-auto size-4 text-muted-foreground",
                 r ? "rotate-180" : "",
                 "transition-transform duration-200 ease-in-out"
@@ -42,9 +43,9 @@ function v({
         ]
       }
     ),
-    r && /* @__PURE__ */ o("div", { className: "border-t border-gray-800 p-4 space-y-2", children: s })
+    r && /* @__PURE__ */ o("div", { className: "border-t border-gray-800 p-4 space-y-2", children: i })
   ] });
 }
 export {
-  v as ExpandablCall
+  y as ExpandablCall
 };

package/dist/esm/components/cards/expandable-card/expandable-card.js

@@ -1,21 +1,22 @@
-import { jsxs as o, jsx as e } from "react/jsx-runtime";
-import * as m from "react";
+import { jsxs as e, jsx as o } from "react/jsx-runtime";
+import * as a from "react";
 import { faCaretDown as d } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as c } from "../../icons/fa-icon.js";
 import "@gearbox-protocol/sdk";
 import { cn as n } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 import { Card as f, CardContent as p } from "../card/card.js";
-function v({
+function I({
   header: i,
   children: s,
   alwaysExpanded: r = !1
 }) {
-  const [t, a] = m.useState(r);
-  return /* @__PURE__ */ o(f, { children: [
-    /* @__PURE__ */ o(
+  const [t, m] = a.useState(r);
+  return /* @__PURE__ */ e(f, { children: [
+    /* @__PURE__ */ e(
       "div",
       {
         className: n(
@@ -24,11 +25,11 @@ function v({
           t ? "" : "rounded-b-xl"
         ),
         onClick: () => {
-          r || a(!t);
+          r || m(!t);
         },
         children: [
-          /* @__PURE__ */ e("div", { className: "flex-1", children: i }),
-          !r && /* @__PURE__ */ e("span", { className: "text-muted-foreground transform transition-transform", children: /* @__PURE__ */ e(
+          /* @__PURE__ */ o("div", { className: "flex-1", children: i }),
+          !r && /* @__PURE__ */ o("span", { className: "text-muted-foreground transform transition-transform", children: /* @__PURE__ */ o(
             c,
             {
               icon: d,
@@ -42,9 +43,9 @@ function v({
         ]
       }
     ),
-    t && /* @__PURE__ */ e(p, { className: "border-t border-input bg-gray-900/30", children: s })
+    t && /* @__PURE__ */ o(p, { className: "border-t border-input bg-gray-900/30", children: s })
   ] });
 }
 export {
-  v as ExpandableCard
+  I as ExpandableCard
 };

package/dist/esm/components/carousel/carousel.js

@@ -4,38 +4,39 @@ import { jsx as r } from "react/jsx-runtime";
 import * as N from "react";
 import w from "../../_virtual/index2.js";
 import { faChevronRight as h, faChevronLeft as x } from "@fortawesome/free-solid-svg-icons";
-import { FaIcon as a } from "../icons/fa-icon.js";
+import { FaIcon as i } from "../icons/fa-icon.js";
 import "@gearbox-protocol/sdk";
 import { cn as s } from "../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
-const b = ({ onClick: e, className: o, style: t }) => /* @__PURE__ */ r(
+const b = ({ onClick: o, className: e, style: t }) => /* @__PURE__ */ r(
   "button",
   {
     type: "button",
-    onClick: e,
-    className: s("slick-arrow slick-prev", o),
+    onClick: o,
+    className: s("slick-arrow slick-prev", e),
     style: t,
     "aria-label": "Previous slide",
-    children: /* @__PURE__ */ r(a, { icon: x, className: "size-4" })
+    children: /* @__PURE__ */ r(i, { icon: x, className: "size-4" })
   }
-), y = ({ onClick: e, className: o, style: t }) => /* @__PURE__ */ r(
+), y = ({ onClick: o, className: e, style: t }) => /* @__PURE__ */ r(
   "button",
   {
     type: "button",
-    onClick: e,
-    className: s("slick-arrow slick-next", o),
+    onClick: o,
+    className: s("slick-arrow slick-next", e),
     style: t,
     "aria-label": "Next slide",
-    children: /* @__PURE__ */ r(a, { icon: h, className: "size-4" })
+    children: /* @__PURE__ */ r(i, { icon: h, className: "size-4" })
   }
 ), k = N.forwardRef(
   ({
-    className: e,
-    children: o,
+    className: o,
+    children: e,
     infinite: t = !0,
-    arrows: i = !1,
+    arrows: a = !1,
     dots: l = !0,
     autoplay: c = !1,
     autoplaySpeed: m = 5e3,
@@ -45,7 +46,7 @@ const b = ({ onClick: e, className: o, style: t }) => /* @__PURE__ */ r(
   }, u) => {
     const d = {
       infinite: t,
-      arrows: i,
+      arrows: a,
       dots: l,
       autoplay: c,
       autoplaySpeed: m,
@@ -56,7 +57,7 @@ const b = ({ onClick: e, className: o, style: t }) => /* @__PURE__ */ r(
     }, v = {
       "--carousel-gap": `${p}px`
     };
-    return /* @__PURE__ */ r("div", { className: s("carousel-clip relative w-full", e), children: /* @__PURE__ */ r("div", { className: "carousel-root", style: v, children: /* @__PURE__ */ r(w, { ref: u, ...d, children: o }) }) });
+    return /* @__PURE__ */ r("div", { className: s("carousel-clip relative w-full", o), children: /* @__PURE__ */ r("div", { className: "carousel-root", style: v, children: /* @__PURE__ */ r(w, { ref: u, ...d, children: e }) }) });
   }
 );
 k.displayName = "Carousel";

package/dist/esm/components/checkbox/checkbox-labeled.js

@@ -4,6 +4,7 @@ import * as o from "react";
 import "@gearbox-protocol/sdk";
 import { cn as h } from "../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
 import "../accordion/accordion.js";

package/dist/esm/components/checkbox/checkbox.js

@@ -7,6 +7,7 @@ import { FaIcon as o } from "../icons/fa-icon.js";
 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 h = y("", {

package/dist/esm/components/checkbox-item/checkbox-item.js

@@ -1,43 +1,44 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
 import * as l from "react";
 import { faCheck as f } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as x } from "../icons/fa-icon.js";
 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 d = l.forwardRef(
-  ({ className: n, children: s, checked: e, onCheckedChange: i, disabled: o, ...a }, m) => /* @__PURE__ */ c(
+  ({ className: n, children: s, checked: r, onCheckedChange: i, disabled: o, ...m }, a) => /* @__PURE__ */ c(
     "label",
     {
-      ref: m,
+      ref: a,
       className: t(
         "relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors",
         "hover:bg-secondary",
         o && "pointer-events-none opacity-50",
         n
       ),
-      ...a,
+      ...m,
       children: [
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ e(
           "input",
           {
             type: "checkbox",
-            checked: e,
+            checked: r,
             onChange: (p) => i?.(p.target.checked),
             disabled: o,
             className: "sr-only"
           }
         ),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ e(
           "span",
           {
             className: t(
               "absolute left-2 flex h-4 w-4 items-center justify-center rounded-[4px] border border-primary shadow transition-colors",
-              e && "bg-primary text-primary-foreground"
+              r && "bg-primary text-primary-foreground"
             ),
-            children: e && /* @__PURE__ */ r(x, { icon: f, className: "size-3!" })
+            children: r && /* @__PURE__ */ e(x, { icon: f, className: "size-3!" })
           }
         ),
         s

package/dist/esm/components/client-adapters/styled-button/styled-button.js

@@ -1,9 +1,10 @@
 import { jsx as a } from "react/jsx-runtime";
 import * as n from "react";
-import { Button as l } from "../../buttons/button/button.js";
+import { Button as p } from "../../buttons/button/button.js";
 import "@gearbox-protocol/sdk";
-import { cn as p } from "../../../utils/cn.js";
+import { cn as l } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 const s = {
@@ -20,13 +21,13 @@ const s = {
     className: e,
     ...i
   }, m) => /* @__PURE__ */ a(
-    l,
+    p,
     {
       ref: m,
       size: t === "md" ? "default" : t,
       width: r,
       variant: s[o],
-      className: p("inline-block whitespace-normal", e),
+      className: l("inline-block whitespace-normal", e),
       ...i
     }
   )

package/dist/esm/components/client-adapters/styled-dialog-container/styled-dialog-container.js

@@ -4,6 +4,7 @@ import { DialogContainer as d } from "../../dialog/dialog-container.js";
 import "@gearbox-protocol/sdk";
 import { cn as c } from "../../../utils/cn.js";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 const g = f.forwardRef(

package/dist/esm/components/client-adapters/styled-rounded-image/styled-rounded-image.js

@@ -8,6 +8,7 @@ import "@gearbox-protocol/sdk";
 import "clsx";
 import "tailwind-merge";
 import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 import "../../alert-badge/alert-badge.js";