@gearbox-protocol/ui-kit 4.0.0-next.26 → 4.0.0-next.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.cjs +1 -1
- package/dist/cjs/components/base/values/scalars.cjs +1 -1
- package/dist/cjs/components/compound-apy/compound-apy.cjs +1 -1
- package/dist/esm/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.js +99 -73
- package/dist/esm/components/base/values/scalars.js +11 -10
- package/dist/esm/components/compound-apy/compound-apy.js +20 -18
- package/dist/types/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.d.ts +3 -1
- package/dist/types/components/base/values/scalars.d.ts +3 -1
- package/dist/types/components/compound-apy/compound-apy.d.ts +3 -1
- package/package.json +1 -1
package/dist/cjs/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),A=require("../../points-icon/points-icon.cjs"),B=require("../../token-icon/token-icon.cjs"),o=require("../../typed-intl/index.cjs");require("react");const g=require("../../../utils/apy-breakdown.cjs");require("@gearbox-protocol/sdk/onchain");const T=require("../../../utils/bps.cjs"),x=require("../../../utils/cn.cjs");require("sonner");const i=require("../../../utils/format-leverage.cjs");require("@gearbox-protocol/sdk/common-utils");require("luxon");require("../../../utils/z-index.cjs");const l=require("./constants.cjs"),h="—";function y(r,n,s){return r==="7d"?s:n}function I({data:r,showFormula:n=!1,period:s}){const{leverage:a,collateralApy:d}=r,m=g.totalApyOf(r.netApy),j=m+r.borrowCost,w=d?g.positiveTokenRewardsOf(d):[],f=d?g.pointProgramsOf(d):[],v=w.map(t=>({reward:t,value:Math.round(a*(t.supplyApr??0))})),b=j-v.reduce((t,u)=>t+u.value,0),k=a>0?b/a:void 0;return e.jsxs("div",{className:"flex w-full min-w-0 flex-col gap-4 rounded-xl border border-border bg-card p-4","data-testid":l.StrategyApyBreakdownCardTest.root,children:[e.jsxs("div",{className:"flex h-6 items-center justify-between gap-3",children:[e.jsx("span",{className:"text-base font-semibold leading-4 text-foreground",children:e.jsx(o.FormattedMessageTyped,{messageId:y(s,"components.yieldBreakdown.titleNetAtLeverage","components.yieldBreakdown.titleNetAtLeverage7d"),values:{leverage:i.formatLeverage(a)}})}),e.jsx("span",{className:x.cn("rounded-md px-2 py-0.5 text-sm font-semibold tabular-nums",m>0?"bg-success/20 text-success":"bg-muted text-muted-foreground"),"data-testid":l.StrategyApyBreakdownCardTest.net,children:c(m)})]}),e.jsxs("div",{className:"flex flex-col gap-3",children:[e.jsx(p,{testId:l.StrategyApyBreakdownCardTest.collateral,label:e.jsx(o.FormattedMessageTyped,{messageId:y(s,"components.yieldBreakdown.collateralApy","components.yieldBreakdown.collateralApy7d")}),value:c(b),subtext:n&&k!==void 0?e.jsx(o.FormattedMessageTyped,{messageId:"components.strategyApyBreakdownCard.formula",values:{leverage:i.formatLeverage(a),base:c(k)}}):void 0}),v.map(({reward:t,value:u})=>e.jsx(p,{label:e.jsxs("span",{className:"inline-flex items-center gap-1.5",children:[e.jsx("span",{children:e.jsx(o.FormattedMessageTyped,{messageId:"components.apyParts.extraAPY",values:{symbol:t.token.symbol}})}),e.jsx(B.TokenIcon,{token:t.token,symbol:t.token.symbol,size:16,className:"shrink-0"})]}),value:c(u),subtext:n?e.jsx(o.FormattedMessageTyped,{messageId:"components.strategyApyBreakdownCard.formula",values:{leverage:i.formatLeverage(a),base:c(t.supplyApr??0)}}):void 0},`incentive-${t.token.address}-${t.supplyApr??0}`)),e.jsx(p,{muted:!0,testId:l.StrategyApyBreakdownCardTest.borrow,label:e.jsx(o.FormattedMessageTyped,{messageId:y(s,"components.yieldBreakdown.borrowRate","components.yieldBreakdown.borrowRate7d")}),value:c(-r.borrowCost)}),f.length>0?e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"h-px w-full bg-divider"}),f.map(t=>e.jsx(p,{valueTestId:l.StrategyApyBreakdownCardTest.points,label:e.jsxs("span",{className:"inline-flex items-center gap-1.5",children:[e.jsx("span",{children:e.jsx(o.FormattedMessageTyped,{messageId:"components.yieldBreakdown.programPoints",values:{name:t.name}})}),e.jsx(A.PointsIcon,{reward:{name:t.name,type:t.id},size:16,className:"shrink-0"})]}),value:t.multiplier!=null?`${i.formatLeverage(t.multiplier*a)}×`:h,subtext:n&&t.multiplier!=null?e.jsx(o.FormattedMessageTyped,{messageId:"components.strategyApyBreakdownCard.formula",values:{leverage:i.formatLeverage(a),base:i.formatLeverage(t.multiplier)}}):void 0},t.id))]}):null]})]})}function c(r){const n=T.bpsToPercent(r),s=`${Math.abs(n).toFixed(2)}%`;return n<0?`−${s}`:s}function p({label:r,value:n,subtext:s,muted:a=!1,testId:d,valueTestId:m=l.StrategyApyBreakdownCardTest.value}){return e.jsxs("div",{className:"flex items-start justify-between gap-3","data-testid":d,children:[e.jsx("span",{className:x.cn("min-w-0 text-sm font-semibold leading-5",a?"text-muted-foreground":"text-foreground"),children:r}),e.jsxs("span",{className:"flex shrink-0 flex-col items-end",children:[e.jsx("span",{className:x.cn("text-sm font-semibold leading-5 tabular-nums",a?"text-muted-foreground":"text-foreground"),"data-testid":m,children:n}),s!=null?e.jsx("span",{className:"text-xs leading-4 text-muted-foreground","data-testid":l.StrategyApyBreakdownCardTest.caption,children:s}):null]})]})}exports.StrategyApyBreakdownCardTest=l.StrategyApyBreakdownCardTest;exports.StrategyApyBreakdownCard=I;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("viem"),c=require("../../compound-apy/compound-apy.cjs"),d=require("../../tooltip/simple-tooltip.cjs");require("../../tooltip/tooltip.cjs");require("react");require("@gearbox-protocol/sdk/onchain");const p=require("../../../utils/cn.cjs");require("sonner");const m=require("../../../utils/format-asset-amount.cjs"),f=require("../../../utils/format-leverage.cjs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("viem"),c=require("../../compound-apy/compound-apy.cjs"),d=require("../../tooltip/simple-tooltip.cjs");require("../../tooltip/tooltip.cjs");require("react");require("@gearbox-protocol/sdk/onchain");const p=require("../../../utils/cn.cjs");require("sonner");const m=require("../../../utils/format-asset-amount.cjs"),f=require("../../../utils/format-leverage.cjs"),l=require("../../../utils/format-money.cjs");require("@gearbox-protocol/sdk/common-utils");require("luxon");require("../../../utils/z-index.cjs");const n=require("./constants.cjs"),x="—";function i(){return t.jsx("span",{"data-testid":n.ValueTest.placeholder,children:x})}function u(e){return`${l.formatPercentAmount(e/100,2)}%`}function j({data:e,tooltip:r=!0,period:s}){return e===void 0?t.jsx(i,{}):typeof e=="number"?t.jsx("span",{"data-testid":n.ValueTest.apy,children:u(e)}):t.jsx("span",{"data-testid":n.ValueTest.apy,children:t.jsx(c.CompoundAPY,{apy:e,tooltip:r,period:s})})}function V({data:e}){return e==null?t.jsx(i,{}):t.jsx("span",{"data-testid":n.ValueTest.usd,children:l.formatMoney(e)})}function h({data:e}){return e===void 0?t.jsx(i,{}):t.jsx("span",{"data-testid":n.ValueTest.leverage,children:`${f.formatLeverage(e)}x`})}function q({data:e}){return e===void 0?t.jsx(i,{}):t.jsx("span",{"data-testid":n.ValueTest.utilization,children:u(e)})}function v({data:e}){if(e===void 0)return t.jsx(i,{});const r=e<1e4?"text-destructive":e<11e3?"text-warning":"text-success";return t.jsx("span",{"data-testid":n.ValueTest.healthFactor,className:p.cn(r),children:(e/1e4).toFixed(2)})}function y({data:e,token:r,showSymbol:s=!0}){if(e===void 0||r===void 0)return t.jsx(i,{});const o=a.formatUnits(e,r.decimals);return t.jsxs("span",{"data-testid":n.ValueTest.tokenBigint,title:`${o} ${r.symbol}`,children:[t.jsx(d.SimpleTooltip,{placement:"top",className:"break-all",title:t.jsx("span",{children:m.formatAssetAmount(e,r.decimals)}),children:t.jsx("span",{children:o})}),s&&` ${r.symbol}`]})}exports.ApyValue=j;exports.HealthFactorValue=v;exports.LeverageValue=h;exports.TokenBigint=y;exports.UsdValue=V;exports.UtilizationValue=q;exports.bps=u;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("react"),w=require("../yield-breakdown-tooltip/yield-breakdown-tooltip.cjs"),t=require("../../utils/apy-breakdown.cjs");require("@gearbox-protocol/sdk/onchain");const q=require("../../utils/bps.cjs"),v=require("../../utils/cn.cjs");require("sonner");const C=require("../../utils/format-money.cjs");require("@gearbox-protocol/sdk/common-utils");require("luxon");require("../../utils/z-index.cjs");const l=14;function k(){const n=`additional-incentives-${j.useId().replace(/:/g,"")}`;return e.jsxs("svg",{width:l,height:l,viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"size-3.5 shrink-0 overflow-clip",role:"img","aria-label":"Incentives",children:[e.jsx("title",{children:"Incentives"}),e.jsx("path",{d:"M7 14C10.866 14 14 10.866 14 7C14 3.13401 10.866 0 7 0C3.13401 0 0 3.13401 0 7C0 10.866 3.13401 14 7 14Z",fill:`url(#${n})`}),e.jsx("path",{d:"M7 3.75V10.25M3.75 7H10.25",stroke:"white",strokeWidth:"1.5",strokeLinecap:"round"}),e.jsx("defs",{children:e.jsxs("linearGradient",{id:n,x1:"0",y1:"7",x2:"14",y2:"7",gradientUnits:"userSpaceOnUse",children:[e.jsx("stop",{stopColor:"#FF2D8D"}),e.jsx("stop",{offset:"1",stopColor:"#FF6C20"})]})})]})}function c(n){return n==null?!1:t.positiveTokenRewardsOf(n).length>0||t.pointProgramsOf(n).length>0}function y({apy:n,maxLeverage:u,collateralApy:r,borrowApy:d,quotaRate:a,decimals:p=2,tooltip:h=!0,period:x,className:s}){if(!n)return e.jsx("span",{className:"text-secondary-foreground",children:"—"});const i=t.totalApyOf(n),f=c(n)||c(r),g=h&&i>=1,o=()=>{const m=C.formatCompactPercent(q.bpsToPercent(i),p);return e.jsxs("div",{className:v.cn("inline-flex items-center gap-1.5",s),children:[e.jsx("span",{className:"inline-flex items-center",children:m}),f?e.jsx(k,{}):null]})};return g?e.jsx(w.YieldBreakdownTooltip,{supplyApy:n,maxLeverage:u,collateralApy:r,borrowApy:d,quotaRate:a,period:x,className:s,children:o()}):o()}exports.CompoundAPY=y;
|
|
@@ -1,76 +1,93 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { PointsIcon as
|
|
3
|
-
import { TokenIcon as
|
|
1
|
+
import { jsxs as r, jsx as e, Fragment as A } from "react/jsx-runtime";
|
|
2
|
+
import { PointsIcon as N } from "../../points-icon/points-icon.js";
|
|
3
|
+
import { TokenIcon as B } from "../../token-icon/token-icon.js";
|
|
4
4
|
import { FormattedMessageTyped as l } from "../../typed-intl/index.js";
|
|
5
5
|
import "react";
|
|
6
|
-
import { totalApyOf as
|
|
6
|
+
import { totalApyOf as I, positiveTokenRewardsOf as C, pointProgramsOf as T } from "../../../utils/apy-breakdown.js";
|
|
7
7
|
import "@gearbox-protocol/sdk/onchain";
|
|
8
|
-
import { bpsToPercent as
|
|
9
|
-
import { cn as
|
|
8
|
+
import { bpsToPercent as P } from "../../../utils/bps.js";
|
|
9
|
+
import { cn as b } from "../../../utils/cn.js";
|
|
10
10
|
import "sonner";
|
|
11
|
-
import { formatLeverage as
|
|
11
|
+
import { formatLeverage as m } from "../../../utils/format-leverage.js";
|
|
12
12
|
import "@gearbox-protocol/sdk/common-utils";
|
|
13
13
|
import "luxon";
|
|
14
14
|
import "../../../utils/z-index.js";
|
|
15
|
-
import { StrategyApyBreakdownCardTest as
|
|
16
|
-
const
|
|
17
|
-
function
|
|
15
|
+
import { StrategyApyBreakdownCardTest as d } from "./constants.js";
|
|
16
|
+
const R = "—";
|
|
17
|
+
function g(s, n, a) {
|
|
18
|
+
return s === "7d" ? a : n;
|
|
19
|
+
}
|
|
20
|
+
function K({
|
|
18
21
|
data: s,
|
|
19
|
-
showFormula:
|
|
22
|
+
showFormula: n = !1,
|
|
23
|
+
period: a
|
|
20
24
|
}) {
|
|
21
|
-
const { leverage:
|
|
25
|
+
const { leverage: o, collateralApy: i } = s, p = I(s.netApy), w = p + s.borrowCost, h = i ? C(i) : [], v = i ? T(i) : [], y = h.map((t) => ({
|
|
22
26
|
reward: t,
|
|
23
|
-
value: Math.round(
|
|
24
|
-
})), x =
|
|
25
|
-
return /* @__PURE__ */
|
|
27
|
+
value: Math.round(o * (t.supplyApr ?? 0))
|
|
28
|
+
})), x = w - y.reduce((t, f) => t + f.value, 0), k = o > 0 ? x / o : void 0;
|
|
29
|
+
return /* @__PURE__ */ r(
|
|
26
30
|
"div",
|
|
27
31
|
{
|
|
28
32
|
className: "flex w-full min-w-0 flex-col gap-4 rounded-xl border border-border bg-card p-4",
|
|
29
|
-
"data-testid":
|
|
33
|
+
"data-testid": d.root,
|
|
30
34
|
children: [
|
|
31
|
-
/* @__PURE__ */
|
|
35
|
+
/* @__PURE__ */ r("div", { className: "flex h-6 items-center justify-between gap-3", children: [
|
|
32
36
|
/* @__PURE__ */ e("span", { className: "text-base font-semibold leading-4 text-foreground", children: /* @__PURE__ */ e(
|
|
33
37
|
l,
|
|
34
38
|
{
|
|
35
|
-
messageId:
|
|
36
|
-
|
|
39
|
+
messageId: g(
|
|
40
|
+
a,
|
|
41
|
+
"components.yieldBreakdown.titleNetAtLeverage",
|
|
42
|
+
"components.yieldBreakdown.titleNetAtLeverage7d"
|
|
43
|
+
),
|
|
44
|
+
values: { leverage: m(o) }
|
|
37
45
|
}
|
|
38
46
|
) }),
|
|
39
47
|
/* @__PURE__ */ e(
|
|
40
48
|
"span",
|
|
41
49
|
{
|
|
42
|
-
className:
|
|
50
|
+
className: b(
|
|
43
51
|
"rounded-md px-2 py-0.5 text-sm font-semibold tabular-nums",
|
|
44
|
-
|
|
52
|
+
p > 0 ? "bg-success/20 text-success" : "bg-muted text-muted-foreground"
|
|
45
53
|
),
|
|
46
|
-
"data-testid":
|
|
47
|
-
children:
|
|
54
|
+
"data-testid": d.net,
|
|
55
|
+
children: c(p)
|
|
48
56
|
}
|
|
49
57
|
)
|
|
50
58
|
] }),
|
|
51
|
-
/* @__PURE__ */
|
|
59
|
+
/* @__PURE__ */ r("div", { className: "flex flex-col gap-3", children: [
|
|
52
60
|
/* @__PURE__ */ e(
|
|
53
|
-
|
|
61
|
+
u,
|
|
54
62
|
{
|
|
55
|
-
testId:
|
|
56
|
-
label: /* @__PURE__ */ e(
|
|
57
|
-
|
|
58
|
-
|
|
63
|
+
testId: d.collateral,
|
|
64
|
+
label: /* @__PURE__ */ e(
|
|
65
|
+
l,
|
|
66
|
+
{
|
|
67
|
+
messageId: g(
|
|
68
|
+
a,
|
|
69
|
+
"components.yieldBreakdown.collateralApy",
|
|
70
|
+
"components.yieldBreakdown.collateralApy7d"
|
|
71
|
+
)
|
|
72
|
+
}
|
|
73
|
+
),
|
|
74
|
+
value: c(x),
|
|
75
|
+
subtext: n && k !== void 0 ? /* @__PURE__ */ e(
|
|
59
76
|
l,
|
|
60
77
|
{
|
|
61
78
|
messageId: "components.strategyApyBreakdownCard.formula",
|
|
62
79
|
values: {
|
|
63
|
-
leverage:
|
|
64
|
-
base:
|
|
80
|
+
leverage: m(o),
|
|
81
|
+
base: c(k)
|
|
65
82
|
}
|
|
66
83
|
}
|
|
67
84
|
) : void 0
|
|
68
85
|
}
|
|
69
86
|
),
|
|
70
|
-
|
|
71
|
-
|
|
87
|
+
y.map(({ reward: t, value: f }) => /* @__PURE__ */ e(
|
|
88
|
+
u,
|
|
72
89
|
{
|
|
73
|
-
label: /* @__PURE__ */
|
|
90
|
+
label: /* @__PURE__ */ r("span", { className: "inline-flex items-center gap-1.5", children: [
|
|
74
91
|
/* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
|
|
75
92
|
l,
|
|
76
93
|
{
|
|
@@ -79,7 +96,7 @@ function G({
|
|
|
79
96
|
}
|
|
80
97
|
) }),
|
|
81
98
|
/* @__PURE__ */ e(
|
|
82
|
-
|
|
99
|
+
B,
|
|
83
100
|
{
|
|
84
101
|
token: t.token,
|
|
85
102
|
symbol: t.token.symbol,
|
|
@@ -88,14 +105,14 @@ function G({
|
|
|
88
105
|
}
|
|
89
106
|
)
|
|
90
107
|
] }),
|
|
91
|
-
value:
|
|
92
|
-
subtext:
|
|
108
|
+
value: c(f),
|
|
109
|
+
subtext: n ? /* @__PURE__ */ e(
|
|
93
110
|
l,
|
|
94
111
|
{
|
|
95
112
|
messageId: "components.strategyApyBreakdownCard.formula",
|
|
96
113
|
values: {
|
|
97
|
-
leverage:
|
|
98
|
-
base:
|
|
114
|
+
leverage: m(o),
|
|
115
|
+
base: c(t.supplyApr ?? 0)
|
|
99
116
|
}
|
|
100
117
|
}
|
|
101
118
|
) : void 0
|
|
@@ -103,21 +120,30 @@ function G({
|
|
|
103
120
|
`incentive-${t.token.address}-${t.supplyApr ?? 0}`
|
|
104
121
|
)),
|
|
105
122
|
/* @__PURE__ */ e(
|
|
106
|
-
|
|
123
|
+
u,
|
|
107
124
|
{
|
|
108
125
|
muted: !0,
|
|
109
|
-
testId:
|
|
110
|
-
label: /* @__PURE__ */ e(
|
|
111
|
-
|
|
126
|
+
testId: d.borrow,
|
|
127
|
+
label: /* @__PURE__ */ e(
|
|
128
|
+
l,
|
|
129
|
+
{
|
|
130
|
+
messageId: g(
|
|
131
|
+
a,
|
|
132
|
+
"components.yieldBreakdown.borrowRate",
|
|
133
|
+
"components.yieldBreakdown.borrowRate7d"
|
|
134
|
+
)
|
|
135
|
+
}
|
|
136
|
+
),
|
|
137
|
+
value: c(-s.borrowCost)
|
|
112
138
|
}
|
|
113
139
|
),
|
|
114
|
-
|
|
140
|
+
v.length > 0 ? /* @__PURE__ */ r(A, { children: [
|
|
115
141
|
/* @__PURE__ */ e("div", { className: "h-px w-full bg-divider" }),
|
|
116
|
-
|
|
117
|
-
|
|
142
|
+
v.map((t) => /* @__PURE__ */ e(
|
|
143
|
+
u,
|
|
118
144
|
{
|
|
119
|
-
valueTestId:
|
|
120
|
-
label: /* @__PURE__ */
|
|
145
|
+
valueTestId: d.points,
|
|
146
|
+
label: /* @__PURE__ */ r("span", { className: "inline-flex items-center gap-1.5", children: [
|
|
121
147
|
/* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
|
|
122
148
|
l,
|
|
123
149
|
{
|
|
@@ -126,7 +152,7 @@ function G({
|
|
|
126
152
|
}
|
|
127
153
|
) }),
|
|
128
154
|
/* @__PURE__ */ e(
|
|
129
|
-
|
|
155
|
+
N,
|
|
130
156
|
{
|
|
131
157
|
reward: { name: t.name, type: t.id },
|
|
132
158
|
size: 16,
|
|
@@ -134,14 +160,14 @@ function G({
|
|
|
134
160
|
}
|
|
135
161
|
)
|
|
136
162
|
] }),
|
|
137
|
-
value: t.multiplier != null ? `${
|
|
138
|
-
subtext:
|
|
163
|
+
value: t.multiplier != null ? `${m(t.multiplier * o)}×` : R,
|
|
164
|
+
subtext: n && t.multiplier != null ? /* @__PURE__ */ e(
|
|
139
165
|
l,
|
|
140
166
|
{
|
|
141
167
|
messageId: "components.strategyApyBreakdownCard.formula",
|
|
142
168
|
values: {
|
|
143
|
-
leverage:
|
|
144
|
-
base:
|
|
169
|
+
leverage: m(o),
|
|
170
|
+
base: m(t.multiplier)
|
|
145
171
|
}
|
|
146
172
|
}
|
|
147
173
|
) : void 0
|
|
@@ -154,51 +180,51 @@ function G({
|
|
|
154
180
|
}
|
|
155
181
|
);
|
|
156
182
|
}
|
|
157
|
-
function
|
|
158
|
-
const
|
|
159
|
-
return
|
|
183
|
+
function c(s) {
|
|
184
|
+
const n = P(s), a = `${Math.abs(n).toFixed(2)}%`;
|
|
185
|
+
return n < 0 ? `−${a}` : a;
|
|
160
186
|
}
|
|
161
|
-
function
|
|
187
|
+
function u({
|
|
162
188
|
label: s,
|
|
163
|
-
value:
|
|
189
|
+
value: n,
|
|
164
190
|
subtext: a,
|
|
165
|
-
muted:
|
|
166
|
-
testId:
|
|
167
|
-
valueTestId:
|
|
191
|
+
muted: o = !1,
|
|
192
|
+
testId: i,
|
|
193
|
+
valueTestId: p = d.value
|
|
168
194
|
}) {
|
|
169
|
-
return /* @__PURE__ */
|
|
195
|
+
return /* @__PURE__ */ r(
|
|
170
196
|
"div",
|
|
171
197
|
{
|
|
172
198
|
className: "flex items-start justify-between gap-3",
|
|
173
|
-
"data-testid":
|
|
199
|
+
"data-testid": i,
|
|
174
200
|
children: [
|
|
175
201
|
/* @__PURE__ */ e(
|
|
176
202
|
"span",
|
|
177
203
|
{
|
|
178
|
-
className:
|
|
204
|
+
className: b(
|
|
179
205
|
"min-w-0 text-sm font-semibold leading-5",
|
|
180
|
-
|
|
206
|
+
o ? "text-muted-foreground" : "text-foreground"
|
|
181
207
|
),
|
|
182
208
|
children: s
|
|
183
209
|
}
|
|
184
210
|
),
|
|
185
|
-
/* @__PURE__ */
|
|
211
|
+
/* @__PURE__ */ r("span", { className: "flex shrink-0 flex-col items-end", children: [
|
|
186
212
|
/* @__PURE__ */ e(
|
|
187
213
|
"span",
|
|
188
214
|
{
|
|
189
|
-
className:
|
|
215
|
+
className: b(
|
|
190
216
|
"text-sm font-semibold leading-5 tabular-nums",
|
|
191
|
-
|
|
217
|
+
o ? "text-muted-foreground" : "text-foreground"
|
|
192
218
|
),
|
|
193
|
-
"data-testid":
|
|
194
|
-
children:
|
|
219
|
+
"data-testid": p,
|
|
220
|
+
children: n
|
|
195
221
|
}
|
|
196
222
|
),
|
|
197
223
|
a != null ? /* @__PURE__ */ e(
|
|
198
224
|
"span",
|
|
199
225
|
{
|
|
200
226
|
className: "text-xs leading-4 text-muted-foreground",
|
|
201
|
-
"data-testid":
|
|
227
|
+
"data-testid": d.caption,
|
|
202
228
|
children: a
|
|
203
229
|
}
|
|
204
230
|
) : null
|
|
@@ -208,6 +234,6 @@ function p({
|
|
|
208
234
|
);
|
|
209
235
|
}
|
|
210
236
|
export {
|
|
211
|
-
|
|
212
|
-
|
|
237
|
+
K as StrategyApyBreakdownCard,
|
|
238
|
+
d as StrategyApyBreakdownCardTest
|
|
213
239
|
};
|
|
@@ -18,14 +18,15 @@ const x = "—";
|
|
|
18
18
|
function n() {
|
|
19
19
|
return /* @__PURE__ */ r("span", { "data-testid": i.placeholder, children: x });
|
|
20
20
|
}
|
|
21
|
-
function
|
|
21
|
+
function s(t) {
|
|
22
22
|
return `${h(t / 100, 2)}%`;
|
|
23
23
|
}
|
|
24
24
|
function H({
|
|
25
25
|
data: t,
|
|
26
|
-
tooltip: e = !0
|
|
26
|
+
tooltip: e = !0,
|
|
27
|
+
period: o
|
|
27
28
|
}) {
|
|
28
|
-
return t === void 0 ? /* @__PURE__ */ r(n, {}) : typeof t == "number" ? /* @__PURE__ */ r("span", { "data-testid": i.apy, children:
|
|
29
|
+
return t === void 0 ? /* @__PURE__ */ r(n, {}) : typeof t == "number" ? /* @__PURE__ */ r("span", { "data-testid": i.apy, children: s(t) }) : /* @__PURE__ */ r("span", { "data-testid": i.apy, children: /* @__PURE__ */ r(p, { apy: t, tooltip: e, period: o }) });
|
|
29
30
|
}
|
|
30
31
|
function N({
|
|
31
32
|
data: t
|
|
@@ -40,7 +41,7 @@ function w({
|
|
|
40
41
|
function D({
|
|
41
42
|
data: t
|
|
42
43
|
}) {
|
|
43
|
-
return t === void 0 ? /* @__PURE__ */ r(n, {}) : /* @__PURE__ */ r("span", { "data-testid": i.utilization, children:
|
|
44
|
+
return t === void 0 ? /* @__PURE__ */ r(n, {}) : /* @__PURE__ */ r("span", { "data-testid": i.utilization, children: s(t) });
|
|
44
45
|
}
|
|
45
46
|
function M({
|
|
46
47
|
data: t
|
|
@@ -53,26 +54,26 @@ function M({
|
|
|
53
54
|
function O({
|
|
54
55
|
data: t,
|
|
55
56
|
token: e,
|
|
56
|
-
showSymbol:
|
|
57
|
+
showSymbol: o = !0
|
|
57
58
|
}) {
|
|
58
59
|
if (t === void 0 || e === void 0)
|
|
59
60
|
return /* @__PURE__ */ r(n, {});
|
|
60
|
-
const
|
|
61
|
+
const l = u(t, e.decimals);
|
|
61
62
|
return (
|
|
62
63
|
// `title` also keeps the amount where a hover tooltip cannot reach:
|
|
63
64
|
// keyboard, touch, and the browser's own find — and keeps the symbol
|
|
64
65
|
// reachable there even when the row is the one printing it
|
|
65
|
-
/* @__PURE__ */ m("span", { "data-testid": i.tokenBigint, title: `${
|
|
66
|
+
/* @__PURE__ */ m("span", { "data-testid": i.tokenBigint, title: `${l} ${e.symbol}`, children: [
|
|
66
67
|
/* @__PURE__ */ r(
|
|
67
68
|
a,
|
|
68
69
|
{
|
|
69
70
|
placement: "top",
|
|
70
71
|
className: "break-all",
|
|
71
72
|
title: /* @__PURE__ */ r("span", { children: d(t, e.decimals) }),
|
|
72
|
-
children: /* @__PURE__ */ r("span", { children:
|
|
73
|
+
children: /* @__PURE__ */ r("span", { children: l })
|
|
73
74
|
}
|
|
74
75
|
),
|
|
75
|
-
|
|
76
|
+
o && ` ${e.symbol}`
|
|
76
77
|
] })
|
|
77
78
|
);
|
|
78
79
|
}
|
|
@@ -83,5 +84,5 @@ export {
|
|
|
83
84
|
O as TokenBigint,
|
|
84
85
|
N as UsdValue,
|
|
85
86
|
D as UtilizationValue,
|
|
86
|
-
|
|
87
|
+
s as bps
|
|
87
88
|
};
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { jsx as e, jsxs as r } from "react/jsx-runtime";
|
|
2
|
-
import { useId as
|
|
3
|
-
import { YieldBreakdownTooltip as
|
|
4
|
-
import { totalApyOf as
|
|
2
|
+
import { useId as x } from "react";
|
|
3
|
+
import { YieldBreakdownTooltip as v } from "../yield-breakdown-tooltip/yield-breakdown-tooltip.js";
|
|
4
|
+
import { totalApyOf as C, positiveTokenRewardsOf as I, pointProgramsOf as k } from "../../utils/apy-breakdown.js";
|
|
5
5
|
import "@gearbox-protocol/sdk/onchain";
|
|
6
|
-
import { bpsToPercent as
|
|
7
|
-
import { cn as
|
|
6
|
+
import { bpsToPercent as P } from "../../utils/bps.js";
|
|
7
|
+
import { cn as A } from "../../utils/cn.js";
|
|
8
8
|
import "sonner";
|
|
9
|
-
import { formatCompactPercent as
|
|
9
|
+
import { formatCompactPercent as O } from "../../utils/format-money.js";
|
|
10
10
|
import "@gearbox-protocol/sdk/common-utils";
|
|
11
11
|
import "luxon";
|
|
12
12
|
import "../../utils/z-index.js";
|
|
13
13
|
const l = 14;
|
|
14
|
-
function
|
|
15
|
-
const t = `additional-incentives-${
|
|
14
|
+
function F() {
|
|
15
|
+
const t = `additional-incentives-${x().replace(/:/g, "")}`;
|
|
16
16
|
return /* @__PURE__ */ r(
|
|
17
17
|
"svg",
|
|
18
18
|
{
|
|
@@ -62,9 +62,9 @@ function O() {
|
|
|
62
62
|
);
|
|
63
63
|
}
|
|
64
64
|
function c(t) {
|
|
65
|
-
return t == null ? !1 :
|
|
65
|
+
return t == null ? !1 : I(t).length > 0 || k(t).length > 0;
|
|
66
66
|
}
|
|
67
|
-
function
|
|
67
|
+
function Z({
|
|
68
68
|
apy: t,
|
|
69
69
|
maxLeverage: p,
|
|
70
70
|
collateralApy: n,
|
|
@@ -72,30 +72,32 @@ function U({
|
|
|
72
72
|
quotaRate: a,
|
|
73
73
|
decimals: m = 2,
|
|
74
74
|
tooltip: f = !0,
|
|
75
|
+
period: h,
|
|
75
76
|
className: o
|
|
76
77
|
}) {
|
|
77
78
|
if (!t)
|
|
78
79
|
return /* @__PURE__ */ e("span", { className: "text-secondary-foreground", children: "—" });
|
|
79
|
-
const i =
|
|
80
|
-
const
|
|
81
|
-
return /* @__PURE__ */ r("div", { className:
|
|
82
|
-
/* @__PURE__ */ e("span", { className: "inline-flex items-center", children:
|
|
83
|
-
|
|
80
|
+
const i = C(t), u = c(t) || c(n), g = f && i >= 1, s = () => {
|
|
81
|
+
const w = O(P(i), m);
|
|
82
|
+
return /* @__PURE__ */ r("div", { className: A("inline-flex items-center gap-1.5", o), children: [
|
|
83
|
+
/* @__PURE__ */ e("span", { className: "inline-flex items-center", children: w }),
|
|
84
|
+
u ? /* @__PURE__ */ e(F, {}) : null
|
|
84
85
|
] });
|
|
85
86
|
};
|
|
86
|
-
return
|
|
87
|
-
|
|
87
|
+
return g ? /* @__PURE__ */ e(
|
|
88
|
+
v,
|
|
88
89
|
{
|
|
89
90
|
supplyApy: t,
|
|
90
91
|
maxLeverage: p,
|
|
91
92
|
collateralApy: n,
|
|
92
93
|
borrowApy: d,
|
|
93
94
|
quotaRate: a,
|
|
95
|
+
period: h,
|
|
94
96
|
className: o,
|
|
95
97
|
children: s()
|
|
96
98
|
}
|
|
97
99
|
) : s();
|
|
98
100
|
}
|
|
99
101
|
export {
|
|
100
|
-
|
|
102
|
+
Z as CompoundAPY
|
|
101
103
|
};
|
package/dist/types/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.d.ts
CHANGED
|
@@ -29,6 +29,8 @@ export interface StrategyApyBreakdownCardProps {
|
|
|
29
29
|
* it. Off in a tooltip, where it is a glance.
|
|
30
30
|
*/
|
|
31
31
|
readonly showFormula?: boolean;
|
|
32
|
+
/** When `"7d"`, labels carry the averaging-window suffix. */
|
|
33
|
+
readonly period?: "7d";
|
|
32
34
|
}
|
|
33
35
|
/**
|
|
34
36
|
* How a strategy's net APY is arrived at: collateral yield on the leveraged
|
|
@@ -45,4 +47,4 @@ export interface StrategyApyBreakdownCardProps {
|
|
|
45
47
|
* remainder, so the column adds up to the chip even when each reward rounds
|
|
46
48
|
* its own way.
|
|
47
49
|
*/
|
|
48
|
-
export declare function StrategyApyBreakdownCard({ data, showFormula, }: StrategyApyBreakdownCardProps): React.ReactElement;
|
|
50
|
+
export declare function StrategyApyBreakdownCard({ data, showFormula, period, }: StrategyApyBreakdownCardProps): React.ReactElement;
|
|
@@ -22,13 +22,15 @@ export interface ApyValueProps {
|
|
|
22
22
|
* @default true
|
|
23
23
|
*/
|
|
24
24
|
readonly tooltip?: boolean;
|
|
25
|
+
/** When `"7d"`, the breakdown tooltip labels carry the averaging-window suffix. */
|
|
26
|
+
readonly period?: "7d";
|
|
25
27
|
}
|
|
26
28
|
/**
|
|
27
29
|
* Any APY the model carries, in one place: `supplyApy`, `netApy`, `borrowApy`.
|
|
28
30
|
* A breakdown renders the reference chip (reward icons + breakdown tooltip)
|
|
29
31
|
* via `CompoundAPY`; a bare `Bps` stays a plain percentage.
|
|
30
32
|
*/
|
|
31
|
-
export declare function ApyValue({ data, tooltip, }: ApyValueProps): React.ReactElement;
|
|
33
|
+
export declare function ApyValue({ data, tooltip, period, }: ApyValueProps): React.ReactElement;
|
|
32
34
|
export declare function UsdValue({ data, }: {
|
|
33
35
|
readonly data: number | null | undefined;
|
|
34
36
|
}): React.ReactElement;
|
|
@@ -33,6 +33,8 @@ export interface CompoundAPYProps {
|
|
|
33
33
|
* @default true
|
|
34
34
|
*/
|
|
35
35
|
tooltip?: boolean;
|
|
36
|
+
/** When `"7d"`, tooltip labels carry the averaging-window suffix. */
|
|
37
|
+
period?: "7d";
|
|
36
38
|
className?: string;
|
|
37
39
|
}
|
|
38
40
|
/**
|
|
@@ -41,4 +43,4 @@ export interface CompoundAPYProps {
|
|
|
41
43
|
* No `tokensList`, no external APY, no 7D history, no "soon" points state.
|
|
42
44
|
* For the legacy percent-based API see {@link CompoundAPYLegacy}.
|
|
43
45
|
*/
|
|
44
|
-
export declare function CompoundAPY({ apy, maxLeverage, collateralApy, borrowApy, quotaRate, decimals, tooltip, className, }: CompoundAPYProps): import("react").JSX.Element;
|
|
46
|
+
export declare function CompoundAPY({ apy, maxLeverage, collateralApy, borrowApy, quotaRate, decimals, tooltip, period, className, }: CompoundAPYProps): import("react").JSX.Element;
|