@gearbox-protocol/ui-kit 4.5.2 → 4.6.1

package/dist/esm/components/yield-breakdown-tooltip/yield-breakdown.js

@@ -1,140 +1,153 @@
-import { jsx as e, jsxs as p, Fragment as B } from "react/jsx-runtime";
-import { ApyBreakdownBody as A, formatBreakdownRate as c, ApyBreakdownRow as u, periodMessageId as w, ApyBreakdownDivider as v } from "../base/apy-breakdown-body/apy-breakdown-body.js";
-import { PoolApyBreakdownCard as h } from "../base/pool-apy-breakdown-card/pool-apy-breakdown-card.js";
-import { PointsIcon as b } from "../points-icon/points-icon.js";
-import { TokenIcon as I } from "../token-icon/token-icon.js";
-import { FormattedMessageTyped as a } from "../typed-intl/index.js";
-import { formatLeverage as P } from "../../utils/format-leverage.js";
-import { tokenRewardsOf as R, pointProgramsOf as T, totalApyOf as x } from "../../utils/internal/apy-breakdown.js";
-import { ApyBreakdownTooltip as N } from "./yield-breakdown-tooltip.js";
-function E({
-  supplyApy: l,
-  maxLeverage: r,
-  collateralApy: y,
-  borrowApy: s,
-  quotaRate: i,
-  period: t,
+import { jsx as e, jsxs as r, Fragment as A } from "react/jsx-runtime";
+import { ApyBreakdownBody as v, formatBreakdownRate as u, ApyBreakdownRow as y, periodMessageId as f, RewardLinks as h, ApyBreakdownDivider as b } from "../base/apy-breakdown-body/apy-breakdown-body.js";
+import { PoolApyBreakdownCard as I } from "../base/pool-apy-breakdown-card/pool-apy-breakdown-card.js";
+import { PointsIcon as P } from "../points-icon/points-icon.js";
+import { TokenIcon as x } from "../token-icon/token-icon.js";
+import { FormattedMessageTyped as s } from "../typed-intl/index.js";
+import { formatLeverage as N } from "../../utils/format-leverage.js";
+import { tokenRewardsOf as R, pointProgramsOf as T, totalApyOf as $ } from "../../utils/internal/apy-breakdown.js";
+import { ApyBreakdownTooltip as O } from "./yield-breakdown-tooltip.js";
+function H({
+  supplyApy: t,
+  maxLeverage: a,
+  collateralApy: g,
+  borrowApy: i,
+  quotaRate: d,
+  period: l,
+  hideRewardLinks: m = !1,
   children: n,
-  className: d,
-  open: g
+  className: p,
+  open: k
 }) {
-  const m = r !== void 0 && r > 0;
+  const c = a !== void 0 && a > 0;
   return /* @__PURE__ */ e(
-    N,
+    O,
     {
       placement: "bottom",
-      title: /* @__PURE__ */ e("span", { className: d, children: n }),
-      triggerClassName: d,
-      open: g,
-      children: m ? /* @__PURE__ */ e(
-        $,
+      title: /* @__PURE__ */ e("span", { className: p, children: n }),
+      triggerClassName: p,
+      open: k,
+      children: c ? /* @__PURE__ */ e(
+        S,
         {
-          supplyApy: l,
-          maxLeverage: r,
-          collateralApy: y,
-          borrowApy: s,
-          quotaRate: i,
-          period: t
+          supplyApy: t,
+          maxLeverage: a,
+          collateralApy: g,
+          borrowApy: i,
+          quotaRate: d,
+          period: l,
+          hideRewardLinks: m
         }
-      ) : /* @__PURE__ */ e(h, { data: l, period: t })
+      ) : /* @__PURE__ */ e(
+        I,
+        {
+          data: t,
+          period: l,
+          hideRewardLinks: m
+        }
+      )
     }
   );
 }
-function $({
-  supplyApy: l,
-  maxLeverage: r,
-  collateralApy: y,
-  borrowApy: s,
-  quotaRate: i,
-  period: t
+function S({
+  supplyApy: t,
+  maxLeverage: a,
+  collateralApy: g,
+  borrowApy: i,
+  quotaRate: d,
+  period: l,
+  hideRewardLinks: m
 }) {
-  const n = y, d = n ? R(n) : [], g = T(l), m = x(l), k = s != null || i != null ? (s ?? 0) + (i ?? 0) : void 0, f = g.filter((o) => o.multiplier != null);
-  return /* @__PURE__ */ p(
-    A,
+  const n = g, p = n ? R(n) : [], k = T(t), c = $(t), w = i != null || d != null ? (i ?? 0) + (d ?? 0) : void 0, B = k.filter((o) => o.multiplier != null);
+  return /* @__PURE__ */ r(
+    v,
     {
       title: /* @__PURE__ */ e(
-        a,
+        s,
         {
-          messageId: w(
-            t,
+          messageId: f(
+            l,
             "components.yieldBreakdown.titleNetAtLeverage",
             "components.yieldBreakdown.titleNetAtLeverage7d"
           ),
-          values: { leverage: P(r) }
+          values: { leverage: N(a) }
         }
       ),
-      chip: c(m, !0),
-      chipPositive: m > 0,
+      chip: u(c, !0),
+      chipPositive: c > 0,
       children: [
         n?.organicApy != null ? /* @__PURE__ */ e(
-          u,
+          y,
           {
             muted: n.organicApy < 0,
             label: /* @__PURE__ */ e(
-              a,
+              s,
               {
-                messageId: w(
-                  t,
+                messageId: f(
+                  l,
                   "components.yieldBreakdown.collateralApy",
                   "components.yieldBreakdown.collateralApy7d"
                 )
               }
             ),
-            value: c(n.organicApy)
+            value: u(n.organicApy)
           }
         ) : null,
-        d.map(
+        p.map(
           (o) => o.supplyApr == null ? null : /* @__PURE__ */ e(
-            u,
+            y,
             {
               muted: o.supplyApr < 0,
-              label: /* @__PURE__ */ p("span", { className: "inline-flex items-center gap-1.5", children: [
-                /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
-                  a,
-                  {
-                    messageId: "components.apyParts.extraAPY",
-                    values: { symbol: o.token.symbol }
-                  }
-                ) }),
-                /* @__PURE__ */ e(I, { token: o.token, size: 20 })
+              label: /* @__PURE__ */ r("span", { className: "flex flex-col gap-0.5", children: [
+                /* @__PURE__ */ r("span", { className: "inline-flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
+                    s,
+                    {
+                      messageId: "components.apyParts.extraAPY",
+                      values: { symbol: o.token.symbol }
+                    }
+                  ) }),
+                  /* @__PURE__ */ e(x, { token: o.token, size: 20 })
+                ] }),
+                m ? null : /* @__PURE__ */ e(h, { links: o.links })
               ] }),
-              value: c(o.supplyApr)
+              value: u(o.supplyApr)
             },
             `incentive-${o.token.address}-${o.supplyApr}`
           )
         ),
-        k != null ? /* @__PURE__ */ e(
-          u,
+        w != null ? /* @__PURE__ */ e(
+          y,
           {
             muted: !0,
             label: /* @__PURE__ */ e(
-              a,
+              s,
               {
-                messageId: w(
-                  t,
+                messageId: f(
+                  l,
                   "components.yieldBreakdown.borrowRate",
                   "components.yieldBreakdown.borrowRate7d"
                 )
               }
             ),
-            value: c(k)
+            value: u(w)
           }
         ) : null,
-        f.length > 0 ? /* @__PURE__ */ p(B, { children: [
-          /* @__PURE__ */ e(v, {}),
-          f.map((o) => /* @__PURE__ */ e(
-            u,
+        B.length > 0 ? /* @__PURE__ */ r(A, { children: [
+          /* @__PURE__ */ e(b, {}),
+          B.map((o) => /* @__PURE__ */ e(
+            y,
             {
-              label: /* @__PURE__ */ p("span", { className: "inline-flex items-center gap-1.5", children: [
+              label: /* @__PURE__ */ r("span", { className: "inline-flex items-center gap-1.5", children: [
                 /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
-                  a,
+                  s,
                   {
                     messageId: "components.yieldBreakdown.programPoints",
                     values: { name: o.name }
                   }
                 ) }),
                 /* @__PURE__ */ e(
-                  b,
+                  P,
                   {
                     reward: {
                       name: o.name,
@@ -154,5 +167,5 @@ function $({
   );
 }
 export {
-  E as YieldBreakdownTooltip
+  H as YieldBreakdownTooltip
 };

package/dist/types/components/base/apy-breakdown-body/apy-breakdown-body.d.ts

@@ -44,4 +44,9 @@ export interface ApyBreakdownRowProps {
     readonly captionTestId?: string;
 }
 export declare function ApyBreakdownRow({ label, value, subtext, muted, testId, valueTestId, captionTestId, }: ApyBreakdownRowProps): React.ReactElement;
+export interface RewardLinksProps {
+    readonly links?: readonly string[];
+}
+/** "merkl.xyz ↗" under an incentive row, one link per campaign page. */
+export declare function RewardLinks({ links, }: RewardLinksProps): React.ReactElement | null;
 export declare function ApyBreakdownDivider(): React.ReactElement;

package/dist/types/components/base/pool-apy-breakdown-card/pool-apy-breakdown-card.d.ts

@@ -7,6 +7,8 @@ export interface PoolApyBreakdownCardProps {
     readonly data?: ApyBreakdown;
     /** When `"7d"`, labels carry the averaging-window suffix. */
     readonly period?: "7d";
+    /** Leaves the campaign links out, where the breakdown sits in a list. */
+    readonly hideRewardLinks?: boolean;
 }
 /**
  * How a pool's net APY is arrived at: base yield plus incentives.
@@ -15,4 +17,4 @@ export interface PoolApyBreakdownCardProps {
  * that row is still shown as Incentive APY at 0%. Points sit under a divider
  * when present; they are not addends.
  */
-export declare function PoolApyBreakdownCard({ data, period, }: PoolApyBreakdownCardProps): React.ReactElement;
+export declare function PoolApyBreakdownCard({ data, period, hideRewardLinks, }: PoolApyBreakdownCardProps): React.ReactElement;

package/dist/types/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.d.ts

@@ -24,6 +24,8 @@ export interface StrategyApyBreakdownCardProps {
     readonly showFormula?: boolean;
     /** When `"7d"`, labels carry the averaging-window suffix. */
     readonly period?: "7d";
+    /** Leaves the campaign links out, where the breakdown sits in a list. */
+    readonly hideRewardLinks?: boolean;
 }
 /**
  * How a strategy's net APY is arrived at: collateral yield on the leveraged
@@ -42,4 +44,4 @@ export interface StrategyApyBreakdownCardProps {
  * remainder, so the column adds up to the chip even when each reward rounds
  * its own way.
  */
-export declare function StrategyApyBreakdownCard({ data, leverage, showFormula, period, }: StrategyApyBreakdownCardProps): React.ReactElement;
+export declare function StrategyApyBreakdownCard({ data, leverage, showFormula, period, hideRewardLinks, }: StrategyApyBreakdownCardProps): React.ReactElement;

package/dist/types/components/compound-apy/compound-apy.d.ts

@@ -35,6 +35,8 @@ export interface CompoundAPYProps {
     tooltip?: boolean;
     /** When `"7d"`, tooltip labels carry the averaging-window suffix. */
     period?: "7d";
+    /** Forwarded to {@link YieldBreakdownTooltip}. */
+    hideRewardLinks?: boolean;
     className?: string;
 }
 /**
@@ -43,4 +45,4 @@ export interface CompoundAPYProps {
  * No `tokensList`, no external APY, no 7D history, no "soon" points state.
  * For the legacy percent-based API see {@link CompoundAPYLegacy}.
  */
-export declare function CompoundAPY({ apy, maxLeverage, collateralApy, borrowApy, quotaRate, decimals, tooltip, period, className, }: CompoundAPYProps): import("react").JSX.Element;
+export declare function CompoundAPY({ apy, maxLeverage, collateralApy, borrowApy, quotaRate, decimals, tooltip, period, hideRewardLinks, className, }: CompoundAPYProps): import("react").JSX.Element;

package/dist/types/components/yield-breakdown-tooltip/yield-breakdown.d.ts

@@ -26,6 +26,8 @@ export interface YieldBreakdownTooltipProps {
     quotaRate?: Bps;
     /** When `"7d"`, labels carry the averaging-window suffix. */
     period?: "7d";
+    /** Leaves the campaign links out, where the breakdown sits in a list. */
+    hideRewardLinks?: boolean;
     children?: React.ReactNode;
     className?: string;
     /** Controlled open state. Specs pass it because jsdom has no hover. */
@@ -35,4 +37,4 @@ export interface YieldBreakdownTooltipProps {
  * Earn APY tooltip — a pool hands {@link PoolApyBreakdownCard}; a strategy
  * (positions list) still itemises unlevered collateral, borrow and rewards.
  */
-export declare function YieldBreakdownTooltip({ supplyApy, maxLeverage, collateralApy, borrowApy, quotaRate, period, children, className, open, }: YieldBreakdownTooltipProps): React.JSX.Element;
+export declare function YieldBreakdownTooltip({ supplyApy, maxLeverage, collateralApy, borrowApy, quotaRate, period, hideRewardLinks, children, className, open, }: YieldBreakdownTooltipProps): React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/ui-kit",
-  "version": "4.5.2",
+  "version": "4.6.1",
   "description": "Internal UI components",
   "repository": {
     "type": "git",
@@ -110,7 +110,7 @@
     "@commitlint/cli": "^20.1.0",
     "@commitlint/config-conventional": "^20.0.0",
     "@gearbox-protocol/biome-config": "^1.0.2",
-    "@gearbox-protocol/sdk": "16.0.0",
+    "@gearbox-protocol/sdk": "17.5.0",
     "@rollup/plugin-typescript": "^12.3.0",
     "@storybook/addon-a11y": "^10.0.8",
     "@storybook/addon-docs": "^10.0.8",