@gearbox-protocol/ui-kit 3.13.0 → 3.13.1

package/dist/esm/components/composites/pool-table/pool-table.js

@@ -1,79 +1,78 @@
-import { jsx as t, Fragment as G, jsxs as N } from "react/jsx-runtime";
-import * as L from "react";
-import { HeadCell as F } from "../../head-cell/head-cell.js";
-import { HelpTip as B } from "../../help-tip/help-tip.js";
-import { RWA_POOL_ROW_HOVER_WRAPPER_CLASS as V } from "../../rwa-styles/index.js";
-import { GridLoadingLine as X } from "../../table/grid-loading-line.js";
-import { GridTable as q, GridTableHeader as J, GridTableBody as K, GridTableRow as H, GridTableHead as Q, GridTableCell as $ } from "../../table/grid-table.js";
-import { TableLoaderGuard as U } from "../../table/table-loader-guard.js";
+import { jsx as t, Fragment as I, jsxs as N } from "react/jsx-runtime";
+import * as C from "react";
+import { HeadCell as q } from "../../head-cell/head-cell.js";
+import { HelpTip as R } from "../../help-tip/help-tip.js";
+import { GridLoadingLine as J } from "../../table/grid-loading-line.js";
+import { GridTable as K, GridTableHeader as Q, GridTableBody as U, GridTableRow as O, GridTableHead as V, GridTableCell as j } from "../../table/grid-table.js";
+import { TableLoaderGuard as W } from "../../table/table-loader-guard.js";
 import { TableLineSm as Y, TableCellSm as Z } from "../../table/table-sm.js";
 import "@gearbox-protocol/sdk/common-utils";
 import "@gearbox-protocol/sdk";
-import { useIsMobile as w, useIsMedium as ee } from "../../../hooks/use-media-query.js";
-import { poolTableTestIds as j } from "../../../test-ids/pool-table.js";
-import { cn as u } from "../../../utils/cn.js";
-function k({
+import { useIsMobile as _, useIsMedium as w } from "../../../hooks/use-media-query.js";
+import { poolTableTestIds as k } from "../../../test-ids/pool-table.js";
+import { cn as L } from "../../../utils/cn.js";
+function H({
   last: e,
   className: l,
   ...d
 }) {
   return /* @__PURE__ */ t(
-    H,
+    O,
     {
-      className: u(e && "*:after:hidden", l),
+      className: L(e && "*:after:hidden", l),
       ...d
     }
   );
 }
-function ie({
+function ee({
   columns: e,
   sort: l,
   isMedium: d
 }) {
-  return /* @__PURE__ */ t(H, { noHover: !0, height: "35px", children: e.map((i) => {
+  return /* @__PURE__ */ t(O, { noHover: !0, height: "35px", children: e.map((i) => {
     if (i.hideOnMedium && d) return null;
     const s = i.sort, a = s && l ? {
       direction: l.state?.field === s.field ? l.state.sort : null,
       onSort: () => l.set(s.field, s.defaultDirection ?? "desc")
-    } : void 0, m = typeof i.header == "function" ? i.header(a) : i.header;
+    } : void 0, p = typeof i.header == "function" ? i.header(a) : i.header;
     return /* @__PURE__ */ t(
-      Q,
+      V,
       {
         justify: i.align === "right" ? "end" : i.align === "center" ? "center" : "start",
         size: "sm",
         gapBefore: i.gapBefore,
-        className: u(i.className, i.headerClassName),
-        children: a ? /* @__PURE__ */ N(G, { children: [
+        className: L(i.className, i.headerClassName),
+        children: a ? /* @__PURE__ */ N(I, { children: [
           /* @__PURE__ */ t(
-            F,
+            q,
             {
-              title: m,
+              title: p,
               sortDirection: a.direction ?? void 0,
               onSort: a.onSort
             }
           ),
-          i.headerTip && /* @__PURE__ */ t(B, { className: "ml-1.5", children: i.headerTip })
-        ] }) : /* @__PURE__ */ N(G, { children: [
-          m,
-          i.headerTip && /* @__PURE__ */ t(B, { className: "ml-1.5", children: i.headerTip })
+          i.headerTip && /* @__PURE__ */ t(R, { className: "ml-1.5", children: i.headerTip })
+        ] }) : /* @__PURE__ */ N(I, { children: [
+          p,
+          i.headerTip && /* @__PURE__ */ t(R, { className: "ml-1.5", children: i.headerTip })
         ] })
       },
       i.id
     );
   }) });
 }
-function te({
+function ie({
   row: e,
   columns: l,
   last: d,
   rowHeight: i,
   isSmall: s,
   isMedium: a,
-  mobileColumnsXs: m,
-  mobileColumnsMd: h,
-  rowTestId: g
+  mobileColumnsXs: p,
+  mobileColumnsMd: c,
+  rowTestId: u
 }) {
-  const c = L.useMemo(
+  const f = C.useMemo(
     () => ({
       pool: e.pool,
       tokensList: e.tokensList,
@@ -85,120 +84,113 @@ function te({
       isMobile: s
     }),
     [e, s]
-  ), M = a ? l.filter((r) => !r.hideOnMedium) : l;
+  ), M = a ? l.filter((n) => !n.hideOnMedium) : l;
   if (s) {
-    const r = l.filter((n) => !n.hideOnMobile), [b, ...x] = r, T = (n) => n.mobileCell ? n.mobileCell(c) : n.cell(c);
-    return /* @__PURE__ */ t(k, { last: d, href: e.href, "data-testid": g, children: /* @__PURE__ */ t($, { span: "full", size: "sm", className: "px-3 py-0!", children: /* @__PURE__ */ t(
+    const n = l.filter((r) => !r.hideOnMobile), [g, ...x] = n, T = (r) => r.mobileCell ? r.mobileCell(f) : r.cell(f);
+    return /* @__PURE__ */ t(H, { last: d, href: e.href, "data-testid": u, children: /* @__PURE__ */ t(j, { span: "full", size: "sm", className: "px-3 py-0!", children: /* @__PURE__ */ t(
       Y,
       {
-        title: b ? T(b) : void 0,
-        columnsXs: m,
-        columnsMd: h,
+        title: g ? T(g) : void 0,
+        columnsXs: p,
+        columnsMd: c,
         className: "w-full",
-        children: x.map((n) => /* @__PURE__ */ t(Z, { title: n.mobileTitle, children: T(n) }, n.id))
+        children: x.map((r) => /* @__PURE__ */ t(Z, { title: r.mobileTitle, children: T(r) }, r.id))
       }
     ) }) });
   }
   return /* @__PURE__ */ t(
-    k,
+    H,
     {
-      className: u(
-        e.pool.poolType === "rwa" && "[&>*]:before:bg-[#7fc8ea]/40"
-      ),
       last: d,
       href: e.href,
       height: `${i}px`,
-      "data-testid": g,
-      children: M.map((r) => /* @__PURE__ */ t(
-        $,
+      "data-testid": u,
+      children: M.map((n) => /* @__PURE__ */ t(
+        j,
         {
-          textAlign: r.align ?? "left",
+          textAlign: n.align ?? "left",
           size: "sm",
-          gapBefore: r.gapBefore,
-          className: r.className,
-          children: r.cell(c)
+          gapBefore: n.gapBefore,
+          className: n.className,
+          children: n.cell(f)
         },
-        r.id
+        n.id
       ))
     }
   );
 }
-function ge({
+function fe({
   columns: e,
   rows: l,
   loading: d = !1,
   partialLoading: i = !1,
   error: s,
   emptyContent: a,
-  skeletonRows: m = 5,
-  rowHeight: h = 75,
-  size: g = "lg",
-  mobileColumnsXs: c = 3,
+  skeletonRows: p = 5,
+  rowHeight: c = 75,
+  size: u = "lg",
+  mobileColumnsXs: f = 3,
   mobileColumnsMd: M = 3,
-  className: r,
-  wrapperClassName: b,
+  className: n,
+  wrapperClassName: g,
   sort: x,
   rowTestId: T,
-  loaderTestId: n
+  loaderTestId: r
 }) {
-  const _ = T ?? j.poolLine, P = n ?? j.poolLineLoading, f = w(), C = ee(), p = L.useMemo(
-    () => C ? e.filter((o) => !o.hideOnMedium) : e,
-    [e, C]
-  ), A = L.useMemo(() => f ? "1fr" : p.map((o) => o.width ?? "1fr").join(" "), [f, p]), S = L.useMemo(() => {
-    const o = p.map((E, W) => {
-      const v = E.gapBefore;
-      if (!v || v === "none") return null;
-      const D = v === "md" ? "pl-10" : "pl-5";
-      return `[&:nth-child(${W + 1})]:${D}`;
-    }).filter(Boolean).join(" "), R = p[p.length - 1]?.className?.includes("pr-4") ? "last:pr-4" : "";
-    return u("px-1 py-2 first:pl-4", R, o);
-  }, [p]), y = d || !l, z = !y && l && l.length === 0, I = i && !y;
-  return s ? null : z && a ? /* @__PURE__ */ t(G, { children: a }) : /* @__PURE__ */ N(
-    q,
+  const z = T ?? k.poolLine, B = r ?? k.poolLineLoading, h = _(), b = w(), m = C.useMemo(
+    () => b ? e.filter((o) => !o.hideOnMedium) : e,
+    [e, b]
+  ), D = C.useMemo(() => h ? "1fr" : m.map((o) => o.width ?? "1fr").join(" "), [h, m]), S = C.useMemo(() => {
+    const o = m.map((E, F) => {
+      const G = E.gapBefore;
+      if (!G || G === "none") return null;
+      const X = G === "md" ? "pl-10" : "pl-5";
+      return `[&:nth-child(${F + 1})]:${X}`;
+    }).filter(Boolean).join(" "), v = m[m.length - 1]?.className?.includes("pr-4") ? "last:pr-4" : "";
+    return L("px-1 py-2 first:pl-4", v, o);
+  }, [m]), y = d || !l, A = !y && l && l.length === 0, $ = i && !y;
+  return s ? null : A && a ? /* @__PURE__ */ t(I, { children: a }) : /* @__PURE__ */ N(
+    K,
     {
-      cols: A,
+      cols: D,
       gap: 0,
-      size: g,
-      wrapperClassName: u(
-        "overflow-visible",
-        V,
-        b
-      ),
-      className: r,
+      size: u,
+      wrapperClassName: L("overflow-visible", g),
+      className: n,
       children: [
-        !f && /* @__PURE__ */ t(J, { children: /* @__PURE__ */ t(ie, { columns: e, sort: x, isMedium: C }) }),
+        !h && /* @__PURE__ */ t(Q, { children: /* @__PURE__ */ t(ee, { columns: e, sort: x, isMedium: b }) }),
         /* @__PURE__ */ t(
-          U,
+          W,
           {
             showGuard: y,
-            rows: m,
-            columns: f ? 1 : p.length,
-            height: `${h}px`,
-            "data-testid": P,
-            cellClassName: f ? "px-1 py-2 first:pl-4 last:pr-4" : S,
-            children: /* @__PURE__ */ N(K, { children: [
-              l?.map((o, O, R) => /* @__PURE__ */ t(
-                te,
+            rows: p,
+            columns: h ? 1 : m.length,
+            height: `${c}px`,
+            "data-testid": B,
+            cellClassName: h ? "px-1 py-2 first:pl-4 last:pr-4" : S,
+            children: /* @__PURE__ */ N(U, { children: [
+              l?.map((o, P, v) => /* @__PURE__ */ t(
+                ie,
                 {
                   row: o,
                   columns: e,
-                  last: O === R.length - 1 && !I,
-                  rowHeight: h,
-                  isSmall: f,
-                  isMedium: C,
-                  mobileColumnsXs: c,
+                  last: P === v.length - 1 && !$,
+                  rowHeight: c,
+                  isSmall: h,
+                  isMedium: b,
+                  mobileColumnsXs: f,
                   mobileColumnsMd: M,
-                  rowTestId: _
+                  rowTestId: z
                 },
                 `${o.chainId}-${o.pool.address}`
               )),
-              I && /* @__PURE__ */ t(
-                X,
+              $ && /* @__PURE__ */ t(
+                J,
                 {
-                  height: `${h}px`,
-                  columns: p.length,
+                  height: `${c}px`,
+                  columns: m.length,
                   cellClassName: S,
-                  "data-testid": P,
+                  "data-testid": B,
                   last: !0
                 }
               )
@@ -210,5 +202,5 @@ function ge({
   );
 }
 export {
-  ge as PoolTable
+  fe as PoolTable
 };

package/dist/esm/components/composites/strategies-table/columns.js

@@ -59,7 +59,7 @@ function S({ ctx: e }) {
       ) }),
       /* @__PURE__ */ t(g, { disabled: d, children: /* @__PURE__ */ t(b, { token: r, size: 24 }) })
     ] }),
-    /* @__PURE__ */ o("div", { className: "flex items-center gap-x-3", children: [
+    /* @__PURE__ */ o("div", { className: "flex items-center gap-x-2", children: [
       /* @__PURE__ */ t(w, { maxLength: l, children: i.name }),
       s && /* @__PURE__ */ t(T, { disabledStyle: d }),
       a.isZeroSlippagePair && /* @__PURE__ */ t(

package/dist/esm/components/composites/strategies-table/components/cells/cells.js

@@ -15,46 +15,49 @@ import { APYFeature as b } from "../apy-feature/apy-feature.js";
 import { PointsFeature as T } from "../points-feature/points-feature.js";
 import { Plus as v, DisabledWrap as L } from "./cells.styles.js";
 function K({
-  token: n,
+  token: i,
   disabledStyle: r
 }) {
-  const l = () => /* @__PURE__ */ e("span", { className: R(r && "opacity-60 pointer-events-none"), children: /* @__PURE__ */ e(b, { children: /* @__PURE__ */ e(m, { messageId: "components.strategiesTable.line.0slippage" }) }) });
-  return /* @__PURE__ */ e(N, { children: r ? l() : /* @__PURE__ */ e(
+  const n = () => /* @__PURE__ */ e("span", { className: R(r && "opacity-60 pointer-events-none"), children: /* @__PURE__ */ e(b, { children: /* @__PURE__ */ e(m, { messageId: "components.strategiesTable.line.0slippage" }) }) });
+  return /* @__PURE__ */ e(N, { children: r ? n() : /* @__PURE__ */ e(
     F,
     {
       placement: "top",
       triangle: !1,
-      title: l(),
+      title: n(),
       children: /* @__PURE__ */ e(
         m,
         {
           messageId: "components.strategiesTable.line.0slippage.tip",
           values: {
-            symbol: n?.title || ""
+            symbol: i?.title || ""
           }
         }
       )
     }
   ) });
 }
-function Q({ disabledStyle: n }) {
-  const r = /* @__PURE__ */ e(
+function Q({
+  disabledStyle: i,
+  tooltip: r = /* @__PURE__ */ e(m, { messageId: "components.strategiesTable.line.rwa.tip" })
+}) {
+  const n = /* @__PURE__ */ e(
     "span",
     {
       className: R(
-        "rounded-xl px-[10px] py-1 text-xs leading-none",
+        "rounded-xl px-[6px] py-1 text-xs leading-none",
         S,
-        n && "opacity-60 pointer-events-none"
+        i && "opacity-60 pointer-events-none"
       ),
       children: /* @__PURE__ */ e(m, { messageId: "components.strategiesTable.line.rwa" })
     }
   );
-  return /* @__PURE__ */ e(N, { children: n ? r : /* @__PURE__ */ e(F, { placement: "top", triangle: !1, title: r, children: /* @__PURE__ */ e(m, { messageId: "components.strategiesTable.line.rwa.tip" }) }) });
+  return /* @__PURE__ */ e(N, { children: i ? n : /* @__PURE__ */ e(F, { placement: "top", triangle: !1, title: n, children: r }) });
 }
 function U({
-  maxAPY: n,
+  maxAPY: i,
   bonusAPY: r,
-  rewards: l,
+  rewards: n,
   rewardRates: d,
   debtRewards: u,
   debtRewardRates: f,
@@ -65,31 +68,31 @@ function U({
   apyLoading: h,
   apyFormat: t = "feature"
 }) {
-  const i = (o) => t === "feature" ? /* @__PURE__ */ x(b, { children: [
-    c(o),
+  const o = (l) => t === "feature" ? /* @__PURE__ */ x(b, { children: [
+    c(l),
     "% APR"
-  ] }) : `${c(o)}%`, I = (o) => t === "feature" ? /* @__PURE__ */ x(b, { children: [
+  ] }) : `${c(l)}%`, I = (l) => t === "feature" ? /* @__PURE__ */ x(b, { children: [
     "exp. ",
-    c(o),
+    c(l),
     "% APR"
-  ] }) : `exp. ${c(o)}%`;
+  ] }) : `exp. ${c(l)}%`;
   return /* @__PURE__ */ x("div", { className: "flex-row-row items-center gap-2", children: [
     (() => {
-      const o = [
+      const l = [
         a ? /* @__PURE__ */ e(
           P,
           {
             className: "inline-block align-text-bottom",
             width: 50,
             loading: h,
-            children: i(n)
+            children: o(i)
           },
           "apy"
         ) : void 0,
         s || g ? /* @__PURE__ */ e(
           j,
           {
-            rewards: l,
+            rewards: n,
             rewardRates: d,
             debtRewards: u,
             debtRewardRates: f,
@@ -100,7 +103,7 @@ function U({
           "points"
         ) : void 0
       ].filter(Boolean);
-      return o.flatMap((w, A) => A === o.length - 1 ? [w] : [w, /* @__PURE__ */ e(v, { children: "+" }, `plus-${A}`)]);
+      return l.flatMap((w, A) => A === l.length - 1 ? [w] : [w, /* @__PURE__ */ e(v, { children: "+" }, `plus-${A}`)]);
     })(),
     r && /* @__PURE__ */ e(v, { children: ":" }),
     r && /* @__PURE__ */ e(
@@ -115,9 +118,9 @@ function U({
   ] });
 }
 function j({
-  rewards: n,
+  rewards: i,
   rewardRates: r,
-  debtRewards: l,
+  debtRewards: n,
   debtRewardRates: d,
   hasRewards: u,
   hasDebtRewards: f,
@@ -126,28 +129,28 @@ function j({
 }) {
   return (() => {
     const p = [
-      u ? n.map((t, i) => /* @__PURE__ */ e(
+      u ? i.map((t, o) => /* @__PURE__ */ e(
         "span",
         {
           children: /* @__PURE__ */ e(L, { disabled: a, children: /* @__PURE__ */ e(
             T,
             {
               reward: t,
-              points: r?.[i] || 0n,
+              points: r?.[o] || 0n,
               theme: s
             }
           ) })
         },
         ["base", t.multiplier, t.name, t.type, t.units].join("-")
       )) : void 0,
-      f ? l.map((t, i) => /* @__PURE__ */ e(
+      f ? n.map((t, o) => /* @__PURE__ */ e(
         "span",
         {
           children: /* @__PURE__ */ e(L, { disabled: a, children: /* @__PURE__ */ e(
             T,
             {
               reward: t,
-              points: d?.[i] || 0n,
+              points: d?.[o] || 0n,
               theme: s
             }
           ) })
@@ -157,7 +160,7 @@ function j({
         )
       )) : void 0
     ].filter(Boolean);
-    return p.flatMap((t, i) => i === p.length - 1 ? [t] : [t, /* @__PURE__ */ e(v, { children: "+" }, `plus-points-${i}`)]);
+    return p.flatMap((t, o) => o === p.length - 1 ? [t] : [t, /* @__PURE__ */ e(v, { children: "+" }, `plus-points-${o}`)]);
   })();
 }
 export {

package/dist/esm/locale/en.json.js

@@ -102,6 +102,7 @@ const e = {
   "components.poolTable.notFound.description.dashboard": "Choose earn above.",
   "components.poolTable.notFound.description.list": "Choose another chain or toggle Show All Markets",
   "components.poolTable.externalApy.tooltipShort": "{value} APY boost when depositing via {name}",
+  "components.poolTable.line.rwa.tip": "This is RWA market.",
   "components.rewardsTooltip.without.title": "Without Leverage",
   "components.rewardsTooltip.without.extra": "Extra APY",
   "components.rewardsTooltip.without.extra.tip": "Any deposit through Gearbox",