@gearbox-protocol/ui-kit 3.6.0-next.2 → 3.6.0

package/dist/esm/components/pool-apy-tooltip/pool-apy-tooltip.js

@@ -1,5 +1,5 @@
-import { jsx as e, jsxs as o, Fragment as b } from "react/jsx-runtime";
-import { faPlus as N } from "@fortawesome/free-solid-svg-icons";
+import { jsx as e, jsxs as n, Fragment as b } from "react/jsx-runtime";
+import { faPlus as P } from "@fortawesome/free-solid-svg-icons";
 import { IconLighting as T } from "@gearbox-protocol/static";
 import { getRewardTokenSymbol as k } from "../compound-apy/compound-apy.js";
 import { FaIcon as S } from "../icons/fa-icon.js";
@@ -7,22 +7,22 @@ import { PointsIcon as _ } from "../points-icon/points-icon.js";
 import { Skeleton as z } from "../skeleton/skeleton.js";
 import "react";
 import "@gearbox-protocol/sdk";
-import { cn as y } from "../../utils/cn.js";
+import { cn as u } from "../../utils/cn.js";
 import "sonner";
 import { percentTemplate as r } from "../../utils/format-money.js";
 import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
 import { TokenIcon as C } from "../token-icon/token-icon.js";
-import { SimpleTooltip as Y } from "../tooltip/simple-tooltip.js";
+import { SimpleTooltip as L } from "../tooltip/simple-tooltip.js";
 import "../tooltip/tooltip.js";
-import { FormattedMessageTyped as n } from "../typed-intl/index.js";
-import { VerticalIndicator as l } from "../vertical-indicator/vertical-indicator.js";
-import { VerticalList as u } from "../vertical-list/vertical-list.js";
-const A = {
+import { FormattedMessageTyped as o } from "../typed-intl/index.js";
+import { VerticalIndicator as d } from "../vertical-indicator/vertical-indicator.js";
+import { VerticalList as y } from "../vertical-list/vertical-list.js";
+const $ = {
   supplyAPY: "components.apyParts.supplyAPY",
   tokenYield: "components.apyParts.tokenYield"
-}, L = {
+}, O = {
   supplyAPY: "components.apyParts.supplyAPY.tip",
   tokenYield: "components.apyParts.tokenYield.tip"
 }, v = {
@@ -30,29 +30,29 @@ const A = {
   "cross-chain-deposit": "components.apyParts.points.condition.crossDeposit",
   holding: void 0
 };
-function $({ children: d }) {
-  return /* @__PURE__ */ e("div", { className: "w-[110px] grid grid-cols-2 items-end text-end", children: d });
+function Y({ children: m }) {
+  return /* @__PURE__ */ e("div", { className: "w-[110px] grid grid-cols-2 items-end text-end", children: m });
 }
-function ne({
-  children: d,
+function oe({
+  children: m,
   totalAPY: f,
   baseAPY: c,
   extraAPY: h,
-  points: s,
+  points: i,
   apy7DAgo: a,
-  externalAPY: m,
+  externalAPY: s,
   tokensList: w,
   className: g
 }) {
-  if (!(f !== void 0 || c && c.length > 0 || h && h.length > 0 || s && s.length > 0))
-    return /* @__PURE__ */ e("span", { className: g, children: d });
-  const I = !a || !!a.totalAPYLoading || !!a.loading7DAgo, x = !!a, p = (t, i) => x ? /* @__PURE__ */ o($, { children: [
+  if (!(f !== void 0 || c && c.length > 0 || h && h.length > 0 || i && i.length > 0))
+    return /* @__PURE__ */ e("span", { className: g, children: m });
+  const I = !a || !!a.totalAPYLoading || !!a.loading7DAgo, x = !!a, p = (t, l) => x ? /* @__PURE__ */ n(Y, { children: [
     /* @__PURE__ */ e("span", { children: t }),
-    /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(z, { width: 30, height: 14, loading: I, children: i }) })
-  ] }) : t, P = /* @__PURE__ */ o(
+    /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(z, { width: 30, height: 14, loading: I, children: l }) })
+  ] }) : t, N = /* @__PURE__ */ n(
     "div",
     {
-      className: y(
+      className: u(
         "w-[370px] max-w-[calc(100vw-32px)] p-6",
         "bg-popover",
         "border border-border",
@@ -61,13 +61,13 @@ function ne({
         "text-left font-normal"
       ),
       children: [
-        /* @__PURE__ */ o(u, { children: [
+        /* @__PURE__ */ n(y, { children: [
           x && /* @__PURE__ */ e(
-            l,
+            d,
             {
               size: "sm",
               label: /* @__PURE__ */ e("span", { className: "uppercase text-muted-foreground text-xs", children: /* @__PURE__ */ e(
-                n,
+                o,
                 {
                   messageId: "components.apyParts.title"
                 }
@@ -75,33 +75,33 @@ function ne({
               value: /* @__PURE__ */ e("span", { className: "text-muted-foreground text-xs", children: p("1D", "7D") })
             }
           ),
-          c?.map((t, i) => /* @__PURE__ */ e(
-            l,
+          c?.map((t, l) => /* @__PURE__ */ e(
+            d,
             {
               size: "sm",
-              label: /* @__PURE__ */ e(n, { messageId: A[t.type] }),
+              label: /* @__PURE__ */ e(o, { messageId: $[t.type] }),
               description: /* @__PURE__ */ e(
-                n,
+                o,
                 {
-                  messageId: L[t.type]
+                  messageId: O[t.type]
                 }
               ),
               value: p(
                 r(t.apy),
-                r(a?.baseAPY?.[i]?.apy || 0)
+                r(a?.baseAPY?.[l]?.apy || 0)
               )
             },
             `base-${t.type}-${t.apy}`
           )),
           h?.map((t) => {
-            const i = w?.[t.rewardToken];
+            const l = w?.[t.rewardToken];
             return /* @__PURE__ */ e(
-              l,
+              d,
               {
                 size: "sm",
-                label: /* @__PURE__ */ o("span", { className: "inline-flex items-center", children: [
+                label: /* @__PURE__ */ n("span", { className: "inline-flex items-center", children: [
                   /* @__PURE__ */ e(
-                    n,
+                    o,
                     {
                       messageId: "components.apyParts.extraAPY",
                       values: { symbol: t.rewardTokenSymbol }
@@ -110,13 +110,13 @@ function ne({
                   /* @__PURE__ */ e("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ e(
                     C,
                     {
-                      symbol: k(i, t.rewardTokenSymbol),
+                      symbol: k(l, t.rewardTokenSymbol),
                       size: 14
                     }
                   ) })
                 ] }),
                 description: /* @__PURE__ */ e(
-                  n,
+                  o,
                   {
                     messageId: "components.apyParts.extraAPY.tip"
                   }
@@ -131,12 +131,12 @@ function ne({
           })
         ] }),
         /* @__PURE__ */ e("div", { className: "my-5 border-t border-border" }),
-        /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(
-          l,
+        /* @__PURE__ */ e(y, { children: /* @__PURE__ */ e(
+          d,
           {
             size: "sm",
             label: /* @__PURE__ */ e("span", { className: "font-bold", children: /* @__PURE__ */ e(
-              n,
+              o,
               {
                 messageId: "components.apyParts.totalAPY"
               }
@@ -147,55 +147,61 @@ function ne({
             )
           }
         ) }),
-        m && /* @__PURE__ */ e(
+        s && /* @__PURE__ */ e(
           "div",
           {
-            className: y(
+            className: u(
               "mt-5 px-8 pt-[18px] pb-4",
               "rounded-[10px]",
               "text-[13px] leading-[120%] text-center",
               "border border-dashed border-gray-40"
             ),
-            children: /* @__PURE__ */ e(
-              n,
-              {
-                messageId: m.tooltip,
-                values: {
-                  name: m.name,
-                  value: /* @__PURE__ */ o(b, { children: [
-                    /* @__PURE__ */ e("span", { className: "text-gray-90 mr-1.5", children: /* @__PURE__ */ e(T, { size: 14, style: { verticalAlign: "top" } }) }),
-                    /* @__PURE__ */ o("span", { className: "font-bold", children: [
-                      "+",
-                      r(m.apy)
-                    ] })
-                  ] })
+            children: (() => {
+              const t = /* @__PURE__ */ n(b, { children: [
+                /* @__PURE__ */ e("span", { className: "text-gray-90 mr-1.5", children: /* @__PURE__ */ e(T, { size: 14, style: { verticalAlign: "top" } }) }),
+                /* @__PURE__ */ n("span", { className: "font-bold", children: [
+                  "+",
+                  r(s.apy)
+                ] })
+              ] });
+              return s.tooltip ? /* @__PURE__ */ e(
+                o,
+                {
+                  messageId: s.tooltip,
+                  values: {
+                    name: s.name,
+                    value: t
+                  }
                 }
-              }
-            )
+              ) : /* @__PURE__ */ n("span", { className: "inline-flex flex-wrap items-center justify-center gap-x-1", children: [
+                /* @__PURE__ */ e("span", { children: s.name }),
+                t
+              ] });
+            })()
           }
         ),
-        s && s.length > 0 && /* @__PURE__ */ o(b, { children: [
+        i && i.length > 0 && /* @__PURE__ */ n(b, { children: [
           /* @__PURE__ */ e("div", { className: "relative my-2.5 mx-6 border-t-2 border-border", children: /* @__PURE__ */ e(
             "div",
             {
-              className: y(
+              className: u(
                 "absolute -top-[10px] left-0",
                 "w-5 h-5",
                 "flex items-center justify-center",
                 "rounded-full",
                 "bg-gray-20"
               ),
-              children: /* @__PURE__ */ e(S, { icon: N, className: "size-2.5 text-white" })
+              children: /* @__PURE__ */ e(S, { icon: P, className: "size-2.5 text-white" })
             }
           ) }),
           /* @__PURE__ */ e("div", { className: "h-6" }),
-          /* @__PURE__ */ e(u, { children: s.map((t) => /* @__PURE__ */ e(
-            l,
+          /* @__PURE__ */ e(y, { children: i.map((t) => /* @__PURE__ */ e(
+            d,
             {
               size: "sm",
-              label: /* @__PURE__ */ o("span", { className: "inline-flex items-center", children: [
+              label: /* @__PURE__ */ n("span", { className: "inline-flex items-center", children: [
                 /* @__PURE__ */ e(
-                  n,
+                  o,
                   {
                     messageId: "components.apyParts.points",
                     values: { symbol: t.name }
@@ -212,13 +218,13 @@ function ne({
                   }
                 ) })
               ] }),
-              description: /* @__PURE__ */ o("div", { children: [
+              description: /* @__PURE__ */ n("div", { children: [
                 /* @__PURE__ */ e("div", { children: `Per ${[
                   ...t.reward?.duration ? [t.reward.duration] : [],
                   ...t.tokenTitle ? [`1 ${t.tokenTitle}`] : []
                 ].join(" per ")}` }),
                 t.reward?.condition && v[t.reward.condition] && /* @__PURE__ */ e("span", { className: "text-warning", children: /* @__PURE__ */ e(
-                  n,
+                  o,
                   {
                     messageId: v[t.reward.condition]
                   }
@@ -233,19 +239,19 @@ function ne({
     }
   );
   return /* @__PURE__ */ e(
-    Y,
+    L,
     {
       placement: "bottom",
       triangle: !1,
       type: "modal-tooltip",
       minWidth: "100%",
       maxWidth: "100%",
-      title: /* @__PURE__ */ e("span", { className: g, children: d }),
+      title: /* @__PURE__ */ e("span", { className: g, children: m }),
       triggerClassName: g,
-      children: P
+      children: N
     }
   );
 }
 export {
-  ne as PoolAPYTooltip
+  oe as PoolAPYTooltip
 };