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

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

@@ -1,11 +1,11 @@
-import { jsx as s } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
 import { cva as g } from "class-variance-authority";
-import * as l from "react";
-import { BaseLink as C } from "../base-link/base-link.js";
+import * as n from "react";
+import { BaseLink as H } from "../base-link/base-link.js";
 import { Col as j } from "../layout/col/col.js";
-import { Grid as H } from "../layout/grid/grid.js";
+import { Grid as k } from "../layout/grid/grid.js";
 import { cn as r } from "../../utils/cn.js";
-const k = g("w-full", {
+const D = g("w-full", {
   variants: {
     size: {
       sm: "text-xs",
@@ -16,20 +16,20 @@ const k = g("w-full", {
   defaultVariants: {
     size: "default"
   }
-}), D = l.forwardRef(
-  ({ className: e, size: t, cols: a = 12, gap: n = 0, wrapperClassName: i, ...f }, c) => /* @__PURE__ */ s("div", { className: r("relative w-full overflow-auto", i), children: /* @__PURE__ */ s(
-    H,
+}), C = n.forwardRef(
+  ({ className: e, size: t, cols: a = 12, gap: d = 0, wrapperClassName: s, ...f }, c) => /* @__PURE__ */ i("div", { className: r("relative w-full overflow-auto", s), children: /* @__PURE__ */ i(
+    k,
     {
       ref: c,
       cols: a,
-      gap: n,
-      className: r(k({ size: t, className: e })),
+      gap: d,
+      className: r(D({ size: t, className: e })),
       ...f
     }
   ) })
 );
-D.displayName = "GridTable";
-const K = l.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ s(
+C.displayName = "GridTable";
+const K = n.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ i(
   "div",
   {
     ref: a,
@@ -45,7 +45,7 @@ const K = l.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ s(
   }
 ));
 K.displayName = "GridTableHeader";
-const A = l.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ s(
+const A = n.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ i(
   "div",
   {
     ref: a,
@@ -54,55 +54,43 @@ const A = l.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ s(
   }
 ));
 A.displayName = "GridTableBody";
-const F = l.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ s(
-  "div",
-  {
-    ref: a,
-    className: r(
-      "contents [&>*]:border-t [&>*]:bg-muted/50 [&>*]:font-medium",
-      e
-    ),
-    ...t
-  }
-));
-F.displayName = "GridTableFooter";
-const R = l.forwardRef(
+const S = n.forwardRef(
   ({
     className: e,
     cols: t,
     gap: a = 0,
-    last: n,
-    height: i,
+    last: d,
+    height: s,
     hideValue: f,
     noHover: c,
     noRound: y,
-    onRowClick: o,
+    onRowClick: l,
     href: x,
-    target: w,
-    rel: z,
+    target: z,
+    rel: w,
     style: B,
-    children: m,
-    ...u
+    children: u,
+    ...m
   }, b) => {
-    const T = typeof i == "number" ? `${i}px` : i, v = l.useCallback(
-      (d) => {
-        !o || d.target.closest(
+    const T = typeof s == "number" ? `${s}px` : s, v = n.useCallback(
+      (o) => {
+        !l || o.target.closest(
           "a, button, input, select, textarea, [role='button']"
-        ) || o(d);
+        ) || l(o);
       },
-      [o]
-    ), N = l.useCallback(
-      (d) => {
-        if (o && (d.key === "Enter" || d.key === " ")) {
-          if (d.preventDefault(), d.target.closest(
+      [l]
+    ), h = n.useCallback(
+      (o) => {
+        if (l && (o.key === "Enter" || o.key === " ")) {
+          if (o.preventDefault(), o.target.closest(
             "a, button, input, select, textarea, [role='button']"
           ))
             return;
-          o(d);
+          l(o);
         }
       },
-      [o]
-    ), h = r(
+      [l]
+    ), N = r(
       "[&>*]:relative [&>*]:transition-colors data-[state=selected]:[&>*]:bg-muted",
       "[&>*]:after:absolute [&>*]:after:bottom-0 [&>*]:after:inset-x-0 [&>*]:after:h-px [&>*]:after:bg-border",
       !y && [
@@ -115,36 +103,36 @@ const R = l.forwardRef(
         "hover:[&>*]:before:opacity-100",
         !y && "[&>*:first-child]:before:rounded-l-lg [&>*:last-child]:before:rounded-r-lg"
       ],
-      n && "[&>*]:after:hidden",
+      d && "[&>*]:after:hidden",
       f && "[&>*]:opacity-0"
     ), G = r(
       "grid grid-cols-subgrid col-span-full",
-      h,
+      N,
       "cursor-pointer",
       e
     ), p = {
       ...B,
       ...T ? { height: T } : {}
     };
-    return x ? /* @__PURE__ */ s(
-      C,
+    return x ? /* @__PURE__ */ i(
+      H,
       {
         ref: b,
         href: x,
-        target: w,
-        rel: z,
+        target: z,
+        rel: w,
         size: "unset",
         variant: "unset",
         className: r("no-underline text-foreground!", G),
         style: p,
-        onClick: o ? v : void 0,
-        onKeyDown: o ? N : void 0,
-        ...u,
-        children: m
+        onClick: l ? v : void 0,
+        onKeyDown: l ? h : void 0,
+        ...m,
+        children: u
       }
-    ) : o ? (
+    ) : l ? (
       // biome-ignore lint/a11y/useSemanticElements: Using div with subgrid layout, not a semantic table
-      /* @__PURE__ */ s(
+      /* @__PURE__ */ i(
         "div",
         {
           ref: b,
@@ -153,29 +141,29 @@ const R = l.forwardRef(
           className: G,
           style: p,
           onClick: v,
-          onKeyDown: N,
-          ...u,
-          children: m
+          onKeyDown: h,
+          ...m,
+          children: u
         }
       )
-    ) : /* @__PURE__ */ s(
+    ) : /* @__PURE__ */ i(
       "div",
       {
         ref: b,
         className: r(
           "grid grid-cols-subgrid col-span-full",
-          h,
+          N,
           e
         ),
         style: p,
-        ...u,
-        children: m
+        ...m,
+        children: u
       }
     );
   }
 );
-R.displayName = "GridTableRow";
-const S = g(
+S.displayName = "GridTableRow";
+const E = g(
   "flex items-center justify-start text-left align-middle font-medium text-muted-foreground !bg-transparent",
   {
     variants: {
@@ -201,21 +189,21 @@ const S = g(
       gapBefore: "none"
     }
   }
-), E = l.forwardRef(
-  ({ className: e, size: t, span: a = 1, justify: n = "start", gapBefore: i, ...f }, c) => /* @__PURE__ */ s(
+), I = n.forwardRef(
+  ({ className: e, size: t, span: a = 1, justify: d = "start", gapBefore: s, ...f }, c) => /* @__PURE__ */ i(
     j,
     {
       ref: c,
       span: a,
       className: r(
-        S({ size: t, justify: n, gapBefore: i, className: e })
+        E({ size: t, justify: d, gapBefore: s, className: e })
       ),
       ...f
     }
   )
 );
-E.displayName = "GridTableHead";
-const I = g("flex items-center align-middle", {
+I.displayName = "GridTableHead";
+const L = g("flex items-center align-middle", {
   variants: {
     size: {
       sm: "px-1 py-2",
@@ -238,42 +226,25 @@ const I = g("flex items-center align-middle", {
     textAlign: "left",
     gapBefore: "none"
   }
-}), L = l.forwardRef(
-  ({ className: e, size: t, span: a = 1, textAlign: n, gapBefore: i, ...f }, c) => /* @__PURE__ */ s(
+}), $ = n.forwardRef(
+  ({ className: e, size: t, span: a = 1, textAlign: d, gapBefore: s, ...f }, c) => /* @__PURE__ */ i(
     j,
     {
       ref: c,
       span: a,
       className: r(
-        I({ size: t, textAlign: n, gapBefore: i, className: e })
+        L({ size: t, textAlign: d, gapBefore: s, className: e })
       ),
       ...f
     }
   )
 );
-L.displayName = "GridTableCell";
-const $ = l.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ s(
-  "div",
-  {
-    ref: a,
-    className: r(
-      "col-span-full mt-4 text-sm text-muted-foreground",
-      e
-    ),
-    ...t
-  }
-));
-$.displayName = "GridTableCaption";
+$.displayName = "GridTableCell";
 export {
-  D as GridTable,
+  C as GridTable,
   A as GridTableBody,
-  $ as GridTableCaption,
-  L as GridTableCell,
-  F as GridTableFooter,
-  E as GridTableHead,
+  $ as GridTableCell,
+  I as GridTableHead,
   K as GridTableHeader,
-  R as GridTableRow,
-  I as gridTableCellVariants,
-  S as gridTableHeadVariants,
-  k as gridTableVariants
+  S as GridTableRow
 };

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

@@ -1,31 +1,11 @@
-import { GridErrorLine as r } from "./grid-error-line.js";
-import { GridLoadingLine as i } from "./grid-loading-line.js";
-import { GridTable as d, GridTableBody as o, GridTableCaption as T, GridTableCell as t, GridTableFooter as n, GridTableHead as G, GridTableHeader as m, GridTableRow as p, gridTableCellVariants as s, gridTableHeadVariants as C, gridTableVariants as H } from "./grid-table.js";
-import { Table as f, TableBody as x, TableCell as g, TableHead as L, TableHeader as w, TableRow as y, tableCellVariants as B, tableHeadVariants as R, tableVariants as S } from "./table.js";
-import { TableCellSm as F, TableLineSm as c } from "./table-sm.js";
+import { GridErrorLine as a } from "./grid-error-line.js";
+import { Table as o, TableBody as b, TableCell as T, TableHead as d, TableHeader as f, TableRow as i } from "./table.js";
 export {
-  r as GridErrorLine,
-  i as GridLoadingLine,
-  d as GridTable,
-  o as GridTableBody,
-  T as GridTableCaption,
-  t as GridTableCell,
-  n as GridTableFooter,
-  G as GridTableHead,
-  m as GridTableHeader,
-  p as GridTableRow,
-  f as Table,
-  x as TableBody,
-  g as TableCell,
-  F as TableCellSm,
-  L as TableHead,
-  w as TableHeader,
-  c as TableLineSm,
-  y as TableRow,
-  s as gridTableCellVariants,
-  C as gridTableHeadVariants,
-  H as gridTableVariants,
-  B as tableCellVariants,
-  R as tableHeadVariants,
-  S as tableVariants
+  a as GridErrorLine,
+  o as Table,
+  b as TableBody,
+  T as TableCell,
+  d as TableHead,
+  f as TableHeader,
+  i as TableRow
 };

package/dist/esm/components/table/table-sm.js

@@ -1,34 +1,33 @@
 import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { cn as a } from "../../utils/cn.js";
 import "@gearbox-protocol/sdk/onchain";
-import { cn as t } from "../../utils/cn.js";
-import "luxon";
 import "../../utils/z-index.js";
-function h({
+function N({
   title: s,
   className: r,
   children: o,
   ...l
 }) {
-  return /* @__PURE__ */ i("div", { className: t("flex flex-col gap-1", r), ...l, children: [
+  return /* @__PURE__ */ i("div", { className: a("flex flex-col gap-1", r), ...l, children: [
     s && /* @__PURE__ */ e("div", { className: "text-xs text-muted-foreground font-medium uppercase", children: s }),
     /* @__PURE__ */ e("div", { className: "text-sm", children: o })
   ] });
 }
-function S({
+function h({
   title: s,
   columnsXs: r = 1,
   columnsSm: o,
   columnsMd: l,
-  columns: a,
+  columns: t,
   className: n,
   children: p,
   ...x
 }) {
-  const c = r, d = o ?? c, m = l ?? d, g = a ?? m;
+  const c = r, d = o ?? c, m = l ?? d, g = t ?? m;
   return /* @__PURE__ */ i(
     "div",
     {
-      className: t(
+      className: a(
         "flex flex-col gap-3 py-3 px-0 md:px-4 border-b border-border last:border-b-0",
         n
       ),
@@ -53,6 +52,6 @@ function S({
   );
 }
 export {
-  h as TableCellSm,
-  S as TableLineSm
+  N as TableCellSm,
+  h as TableLineSm
 };

package/dist/esm/components/table/table.js

@@ -5,9 +5,8 @@ import * as i from "react";
 import { FaIcon as y } from "../icons/fa-icon.js";
 import "../tooltip/simple-tooltip.js";
 import { TooltipProvider as N, Tooltip as v, TooltipTrigger as w, TooltipContent as R } from "../tooltip/tooltip.js";
-import "@gearbox-protocol/sdk/onchain";
 import { cn as o } from "../../utils/cn.js";
-import "luxon";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
 const C = d("w-full caption-bottom", {
   variants: {
@@ -104,7 +103,7 @@ const S = d(
       size: "default"
     }
   }
-), c = i.forwardRef(
+), m = i.forwardRef(
   ({ className: a, size: t, ...e }, l) => /* @__PURE__ */ r(
     "th",
     {
@@ -114,7 +113,7 @@ const S = d(
     }
   )
 );
-c.displayName = "TableHead";
+m.displayName = "TableHead";
 const j = d("align-middle", {
   variants: {
     size: {
@@ -156,7 +155,7 @@ const I = i.forwardRef(function({
   className: p,
   ...u
 }, g) {
-  const x = e && l === "asc" ? h : T, m = /* @__PURE__ */ r(
+  const x = e && l === "asc" ? h : T, c = /* @__PURE__ */ r(
     "span",
     {
       className: o(
@@ -166,7 +165,7 @@ const I = i.forwardRef(function({
       children: /* @__PURE__ */ r(y, { icon: x, className: "size-3 text-muted-foreground" })
     }
   );
-  return /* @__PURE__ */ r(c, { ref: g, className: p, ...u, children: /* @__PURE__ */ r(N, { children: /* @__PURE__ */ n(v, { delayDuration: 200, children: [
+  return /* @__PURE__ */ r(m, { ref: g, className: p, ...u, children: /* @__PURE__ */ r(N, { children: /* @__PURE__ */ n(v, { delayDuration: 200, children: [
     /* @__PURE__ */ r(w, { asChild: !0, children: /* @__PURE__ */ n(
       "button",
       {
@@ -177,9 +176,9 @@ const I = i.forwardRef(function({
           "cursor-pointer hover:text-foreground transition-colors"
         ),
         children: [
-          f === "left" && m,
+          f === "left" && c,
           b,
-          f === "right" && m
+          f === "right" && c
         ]
       }
     ) }),
@@ -194,10 +193,7 @@ export {
   z as Table,
   V as TableBody,
   B as TableCell,
-  c as TableHead,
+  m as TableHead,
   H as TableHeader,
-  F as TableRow,
-  j as tableCellVariants,
-  S as tableHeadVariants,
-  C as tableVariants
+  F as TableRow
 };

package/dist/esm/components/tabs/tabs.js

@@ -1,48 +1,47 @@
 import { jsx as o } from "react/jsx-runtime";
 import * as e from "@radix-ui/react-tabs";
 import * as i from "react";
-import "@gearbox-protocol/sdk/onchain";
 import { cn as s } from "../../utils/cn.js";
-import "luxon";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
-const p = e.Root, n = i.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ o(
+const g = e.Root, n = i.forwardRef(({ className: t, ...a }, r) => /* @__PURE__ */ o(
   e.List,
   {
-    ref: a,
+    ref: r,
     className: s(
       "inline-flex h-fit items-center justify-start bg-muted p-1 text-muted-foreground bg-transparent p-0 space-x-6 overflow-x-auto overflow-y-hidden navbar-scrollbar min-w-max",
       t
     ),
-    ...r
+    ...a
   }
 ));
 n.displayName = e.List.displayName;
-const d = i.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ o(
+const d = i.forwardRef(({ className: t, ...a }, r) => /* @__PURE__ */ o(
   e.Trigger,
   {
-    ref: a,
+    ref: r,
     className: s(
       "inline-flex items-center justify-center whitespace-nowrap px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow rounded-none border-b-2 border-transparent px-2 py-2 text-gray-400 hover:text-foreground data-[state=active]:border-foreground data-[state=active]:bg-transparent data-[state=active]:text-foreground focus:outline-none cursor-pointer shrink-0",
       t
     ),
-    ...r
+    ...a
   }
 ));
 d.displayName = e.Trigger.displayName;
-const f = i.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ o(
+const f = i.forwardRef(({ className: t, ...a }, r) => /* @__PURE__ */ o(
   e.Content,
   {
-    ref: a,
+    ref: r,
     className: s(
       "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
       t
     ),
-    ...r
+    ...a
   }
 ));
 f.displayName = e.Content.displayName;
 export {
-  p as Tabs,
+  g as Tabs,
   f as TabsContent,
   n as TabsList,
   d as TabsTrigger

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

@@ -1,9 +1,8 @@
-import { jsxs as v, Fragment as D, jsx as e } from "react/jsx-runtime";
+import { jsxs as v, Fragment as D, jsx as t } from "react/jsx-runtime";
 import { cva as n } from "class-variance-authority";
 import * as g from "react";
-import "@gearbox-protocol/sdk/onchain";
 import { cn as o } from "../../utils/cn.js";
-import "luxon";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
 const f = n("", {
   variants: {
@@ -49,32 +48,32 @@ const f = n("", {
     children: y,
     icon: s,
     size: h = "default",
-    buttonColor: t = "primaryDashed",
+    buttonColor: e = "primaryDashed",
     width: x = "compact",
     as: a = "button",
     className: b,
     disabled: r,
     ...d
   }, c) => {
-    const i = a === "a", p = o(
+    const i = a === "a", l = o(
       "group inline-block p-0 leading-[100%] font-normal bg-transparent border-none cursor-pointer transition-colors",
       w({ size: h, width: x }),
-      !i && f({ buttonColor: t }),
+      !i && f({ buttonColor: e }),
       r && "text-gray-110 cursor-default [&_svg]:text-gray-110",
       b
-    ), l = i ? o(f({ buttonColor: t }), r && "text-gray-110") : null, u = /* @__PURE__ */ v(D, { children: [
-      /* @__PURE__ */ e(
+    ), p = i ? o(f({ buttonColor: e }), r && "text-gray-110") : null, u = /* @__PURE__ */ v(D, { children: [
+      /* @__PURE__ */ t(
         "span",
         {
           className: o(
             "inline-block",
-            N({ borderColor: t }),
-            r && t !== "empty" && "border-gray-110"
+            N({ borderColor: e }),
+            r && e !== "empty" && "border-gray-110"
           ),
           children: y
         }
       ),
-      s && /* @__PURE__ */ e(
+      s && /* @__PURE__ */ t(
         "span",
         {
           className: o(
@@ -84,20 +83,20 @@ const f = n("", {
           children: s
         }
       )
-    ] }), m = l ? /* @__PURE__ */ e("span", { className: l, children: u }) : u;
-    return a === "button" ? /* @__PURE__ */ e(
+    ] }), m = p ? /* @__PURE__ */ t("span", { className: p, children: u }) : u;
+    return a === "button" ? /* @__PURE__ */ t(
       "button",
       {
         ref: c,
         type: "button",
-        className: p,
+        className: l,
         disabled: r,
         ...d,
         children: m
       }
     ) : g.createElement(
       a,
-      { ref: c, className: p, ...d },
+      { ref: c, className: l, ...d },
       m
     );
   }

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

@@ -1,5 +1,4 @@
-import { Textarea as r, textareaVariants as t } from "./textarea.js";
+import { Textarea as a } from "./textarea.js";
 export {
-  r as Textarea,
-  t as textareaVariants
+  a as Textarea
 };

package/dist/esm/components/textarea/textarea.js

@@ -1,9 +1,8 @@
 import { jsx as i } from "react/jsx-runtime";
 import { cva as l } from "class-variance-authority";
 import * as s from "react";
-import "@gearbox-protocol/sdk/onchain";
 import { cn as n } from "../../utils/cn.js";
-import "luxon";
+import "@gearbox-protocol/sdk/onchain";
 import "../../utils/z-index.js";
 const d = l(
   "flex w-full rounded-md border border-[rgb(100,100,100)] px-3 py-2 shadow-sm transition-colors placeholder:text-muted-foreground/70 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm bg-[rgb(40,40,40)] text-foreground focus:bg-[rgb(40,40,40)] active:bg-[rgb(40,40,40)] [&:not(:placeholder-shown)]:bg-[rgb(40,40,40)] autofill:bg-[rgb(40,40,40)] [-webkit-autofill]:bg-[rgb(40,40,40)] [&:-webkit-autofill]:shadow-[0_0_0_1000px_rgb(40,40,40)_inset] [&:-webkit-autofill]:[text-fill-color:currentColor] outline-none",
@@ -25,10 +24,10 @@ const d = l(
     }
   }
 ), b = s.forwardRef(
-  ({ className: t, size: r, variant: e, ...o }, a) => /* @__PURE__ */ i(
+  ({ className: t, size: e, variant: r, ...o }, a) => /* @__PURE__ */ i(
     "textarea",
     {
-      className: n(d({ size: r, variant: e, className: t })),
+      className: n(d({ size: e, variant: r, className: t })),
       ref: a,
       ...o
     }
@@ -36,6 +35,5 @@ const d = l(
 );
 b.displayName = "Textarea";
 export {
-  b as Textarea,
-  d as textareaVariants
+  b as Textarea
 };

package/dist/esm/components/tip-card/index.js

@@ -1,5 +1,4 @@
-import { TipCard as i, tipCardVariants as p } from "./tip-card.js";
+import { TipCard as p } from "./tip-card.js";
 export {
-  i as TipCard,
-  p as tipCardVariants
+  p as TipCard
 };