@gearbox-protocol/ui-kit 4.0.0-next.45 → 4.0.0-next.47

package/dist/cjs/components/base/health-factor-block/health-factor-block.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),p=require("../text/use-title-text.cjs"),i=require("../../fadeout-loading/fadeout-loading.cjs"),d=require("../../health-factor/health-factor.cjs"),u=require("../../typed-intl/index.cjs"),T=require("../../vertical-indicator/vertical-indicator.cjs"),t=require("./constants.cjs");function x({healthFactor:o,healthFactorTo:a,debt:c,debtTo:h,zone:s,isLoading:l,title:n,tip:F,testId:v}){const m=p.useTitleText(),r=a!==void 0;return e.jsx(T.VerticalIndicator,{align:"center",dimPreviousValue:!1,"data-testid":v??t.HealthFactorBlockTest.root,label:n!==void 0?m(n):e.jsx(u.FormattedMessageTyped,{messageId:"components.healthFactorBlock.label"}),tip:F??e.jsx(u.FormattedMessageTyped,{messageId:"components.healthFactorBlock.tip"}),value:e.jsx(i.FadeoutLoading,{loading:l,children:o===void 0?e.jsx("span",{"data-testid":t.HealthFactorBlockTest.value,children:"—"}):e.jsx(d.HealthFactor,{value:o,debt:c,zone:r?void 0:s,"data-testid":t.HealthFactorBlockTest.value})}),valueTo:r?e.jsx(i.FadeoutLoading,{loading:l,children:e.jsx(d.HealthFactor,{value:a,debt:h??c,zone:s,"data-testid":t.HealthFactorBlockTest.valueTo})}):void 0})}exports.HealthFactorBlockTest=t.HealthFactorBlockTest;exports.HealthFactorBlock=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),_=require("../text/use-title-text.cjs"),d=require("../../fadeout-loading/fadeout-loading.cjs"),u=require("../../health-factor/health-factor.cjs"),h=require("../../typed-intl/index.cjs"),v=require("../../vertical-indicator/vertical-indicator.cjs"),m=require("../../../utils/format.cjs"),t=require("./constants.cjs");function j({healthFactor:o,healthFactorTo:s,debt:l,debtTo:x,approximate:c,zone:n,isLoading:r,title:i,tip:p,testId:F}){const T=_.useTitleText(),a=s!==void 0;return e.jsx(v.VerticalIndicator,{align:"center",dimPreviousValue:!1,"data-testid":F??t.HealthFactorBlockTest.root,label:i!==void 0?T(i):e.jsx(h.FormattedMessageTyped,{messageId:"components.healthFactorBlock.label"}),tip:p??e.jsx(h.FormattedMessageTyped,{messageId:"components.healthFactorBlock.tip"}),value:e.jsx(d.FadeoutLoading,{loading:r,children:o===void 0?e.jsx("span",{"data-testid":t.HealthFactorBlockTest.value,children:"—"}):e.jsxs("span",{className:"inline-flex items-center","data-testid":t.HealthFactorBlockTest.value,children:[c&&!a?e.jsx("span",{className:"mr-0.5",children:m.APPROXIMATE_SYMBOL}):null,e.jsx(u.HealthFactor,{value:o,debt:l,zone:a?void 0:n})]})}),valueTo:a?e.jsx(d.FadeoutLoading,{loading:r,children:e.jsxs("span",{className:"inline-flex items-center","data-testid":t.HealthFactorBlockTest.valueTo,children:[c?e.jsx("span",{className:"mr-0.5",children:m.APPROXIMATE_SYMBOL}):null,e.jsx(u.HealthFactor,{value:s,debt:x??l,zone:n})]})}):void 0})}exports.HealthFactorBlockTest=t.HealthFactorBlockTest;exports.HealthFactorBlock=j;

package/dist/cjs/components/base/liquidation-price-block/liquidation-price-block.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),P=require("../text/use-title-text.cjs"),d=require("../../fadeout-loading/fadeout-loading.cjs"),T=require("../../formatted-number/formatted-number.cjs"),v=require("../../status-elements/status-elements.cjs"),m=require("../../typed-intl/index.cjs"),j=require("../../vertical-indicator/vertical-indicator.cjs"),b=require("../../../utils/format.cjs"),g=require("../../../utils/parse-input-to-bn.cjs"),n=require("./constants.cjs");function L(t,i){if(!(!t||!i))return`${t.symbol} / ${i.symbol}`}function f({price:t,priceTo:i,collateral:o,underlying:s,approximate:r,zone:a,isLoading:c,title:l,tip:x,testId:_}){const p=P.useTitleText(),u=i!==void 0;return e.jsx(j.VerticalIndicator,{align:"center",dimPreviousValue:!1,"data-testid":_??n.LiquidationPriceBlockTest.root,label:l!==void 0?p(l):e.jsx(m.FormattedMessageTyped,{messageId:"components.liquidationPriceBlock.label"}),tip:x??e.jsx(m.FormattedMessageTyped,{messageId:"components.liquidationPriceBlock.tip"}),value:e.jsx(d.FadeoutLoading,{loading:c,children:e.jsx(q,{price:t,approximate:r,zone:u?void 0:a,testId:n.LiquidationPriceBlockTest.value})}),valueTo:u?e.jsx(d.FadeoutLoading,{loading:c,children:e.jsx(q,{price:i??null,approximate:r,zone:a,testId:n.LiquidationPriceBlockTest.valueTo})}):void 0,valueDescription:L(o,s)})}function q({price:t,approximate:i,zone:o,testId:s}){return e.jsxs("span",{className:"inline-flex items-center","data-testid":s,children:[t===void 0?"—":t===null||t===0n?"N/A":e.jsxs(e.Fragment,{children:[i?e.jsx("span",{className:"mr-0.5",children:b.APPROXIMATE_SYMBOL}):null,e.jsx(T.FormattedNumberString,{value:g.bnToLiquidationPriceView(t)})]}),o?e.jsx("span",{className:"ml-1.5",children:e.jsx(v.HealthDot,{zone:o})}):null]})}exports.LiquidationPriceBlockTest=n.LiquidationPriceBlockTest;exports.LiquidationPriceBlock=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),P=require("../text/use-title-text.cjs"),d=require("../../fadeout-loading/fadeout-loading.cjs"),T=require("../../formatted-number/formatted-number.cjs"),v=require("../../status-elements/status-elements.cjs"),m=require("../../typed-intl/index.cjs"),j=require("../../vertical-indicator/vertical-indicator.cjs"),b=require("../../../utils/format.cjs"),g=require("../../../utils/parse-input-to-bn.cjs"),n=require("./constants.cjs");function L(t,i){if(!(!t||!i))return`${t.symbol} / ${i.symbol}`}function f({price:t,priceTo:i,collateral:o,underlying:s,approximate:r,zone:c,isLoading:l,title:u,tip:x,testId:p}){const _=P.useTitleText(),a=i!==void 0;return e.jsx(j.VerticalIndicator,{align:"center",dimPreviousValue:!1,"data-testid":p??n.LiquidationPriceBlockTest.root,label:u!==void 0?_(u):e.jsx(m.FormattedMessageTyped,{messageId:"components.liquidationPriceBlock.label"}),tip:x??e.jsx(m.FormattedMessageTyped,{messageId:"components.liquidationPriceBlock.tip"}),value:e.jsx(d.FadeoutLoading,{loading:l,children:e.jsx(q,{price:t,approximate:r&&!a,zone:a?void 0:c,testId:n.LiquidationPriceBlockTest.value})}),valueTo:a?e.jsx(d.FadeoutLoading,{loading:l,children:e.jsx(q,{price:i??null,approximate:r,zone:c,testId:n.LiquidationPriceBlockTest.valueTo})}):void 0,valueDescription:L(o,s)})}function q({price:t,approximate:i,zone:o,testId:s}){return e.jsxs("span",{className:"inline-flex items-center","data-testid":s,children:[t===void 0?"—":t===null||t===0n?"N/A":e.jsxs(e.Fragment,{children:[i?e.jsx("span",{className:"mr-0.5",children:b.APPROXIMATE_SYMBOL}):null,e.jsx(T.FormattedNumberString,{value:g.bnToLiquidationPriceView(t)})]}),o?e.jsx("span",{className:"ml-1.5",children:e.jsx(v.HealthDot,{zone:o})}):null]})}exports.LiquidationPriceBlockTest=n.LiquidationPriceBlockTest;exports.LiquidationPriceBlock=f;

package/dist/cjs/components/base/position-assets/constants.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class s{static root="position-assets-root";static row="position-assets-row";static empty="position-assets-empty"}exports.PositionAssetsTest=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class s{static root="position-assets-root";static row="position-assets-row";static worth="position-assets-worth";static empty="position-assets-empty"}exports.PositionAssetsTest=s;

package/dist/cjs/components/base/position-assets/position-assets.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),h=require("../stack/stack.cjs");require("../../help-tip/help-tip.cjs");require("react");require("react-intl");require("@gearbox-protocol/sdk/onchain");require("clsx");require("tailwind-merge");require("sonner");const m=require("../../../utils/format.cjs");require("luxon");require("../../../utils/z-index.cjs");require("../../points-icon/points-icon.cjs");const u=require("../values/scalars.cjs");require("../../badge/badge.cjs");require("../../badge/chip.cjs");const p=require("../../short-string/short-string.cjs"),k=require("../../token-symbol/token-symbol.cjs"),g=require("../../typography/typography.cjs"),c=require("./constants.cjs"),_=1,f=20;function q({assets:r,to:o,empty:i,approximate:l,testId:e}){const n=d(r,o),a=o!==void 0;return t.jsx(h.Stack,{gap:"sm",align:"end","data-testid":e??c.PositionAssetsTest.root,children:n.length===0?i!==void 0&&t.jsx(g.Typography,{variant:"caption",color:"secondary",as:"div","data-testid":c.PositionAssetsTest.empty,children:i}):n.map(s=>t.jsxs("span",{className:"flex items-center gap-2","data-testid":c.PositionAssetsTest.row,children:[t.jsx(k.TokenSymbol,{size:20,token:s.token}),t.jsxs("span",{className:"flex items-center",children:[a&&t.jsxs(t.Fragment,{children:[t.jsx("span",{className:"text-secondary-foreground line-through [&_*]:text-secondary-foreground [&_*]:line-through",children:t.jsx(u.TokenBigint,{data:s.value,token:s.token,showSymbol:!1})}),t.jsx("span",{className:"px-1.5 text-gray-70",children:"→"})]}),l?t.jsx("span",{children:m.APPROXIMATE_SYMBOL}):null,t.jsx(u.TokenBigint,{data:a?s.valueTo:s.value,token:s.token,showSymbol:!1}),t.jsx(p.ShortString,{className:"ml-1",maxLength:f,children:s.token.symbol})]})]},s.token.address))})}function d(r,o){const i=new Map,l=(e,n)=>{const a=e.token.address.toLowerCase(),s=i.get(a);i.set(a,{token:s?.token??e.token,value:n==="from"?e.value:s?.value??0n,valueTo:n==="to"?e.value:s?.valueTo??0n,worth:v(s?.worth,e.valueUsd)})};for(const e of r??[])l(e,"from");for(const e of o??[])l(e,"to");return[...i.values()].filter(e=>e.worth===null||e.worth>=_).sort((e,n)=>(n.worth??0)-(e.worth??0)||e.token.address.localeCompare(n.token.address))}function v(r,o){return r===void 0?o:r===null||o===null?null:Math.max(r,o)}exports.PositionAssetsTest=c.PositionAssetsTest;exports.PositionAssets=q;exports.visibleAssets=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("../stack/stack.cjs"),v=require("../values/no-value.cjs");require("react");require("@gearbox-protocol/sdk/onchain");require("clsx");require("tailwind-merge");require("sonner");const f=require("../../../utils/format.cjs"),_=require("../../../utils/format-money.cjs");require("luxon");require("../../../utils/z-index.cjs");require("../../points-icon/points-icon.cjs");const d=require("../values/scalars.cjs");require("../../badge/badge.cjs");require("../../badge/chip.cjs");require("react-intl");const x=require("../../short-string/short-string.cjs"),y=require("../../token-symbol/token-symbol.cjs"),h=require("../../typography/typography.cjs"),l=require("./constants.cjs"),g=1,k=20;function q({assets:r,to:n,empty:a,approximate:c,testId:e}){const o=m(r,n),i=n!==void 0;return t.jsx(p.Stack,{gap:"sm",align:"end","data-testid":e??l.PositionAssetsTest.root,children:o.length===0?a!==void 0&&t.jsx(h.Typography,{variant:"caption",color:"secondary",as:"div","data-testid":l.PositionAssetsTest.empty,children:a}):o.map(s=>{const u=i?s.valueToUsd:s.valueUsd;return t.jsxs("span",{className:"flex flex-col items-end","data-testid":l.PositionAssetsTest.row,children:[t.jsxs("span",{className:"flex items-center gap-2",children:[t.jsx(y.TokenSymbol,{size:20,token:s.token}),t.jsxs("span",{className:"flex items-center",children:[i&&t.jsxs(t.Fragment,{children:[t.jsx("span",{className:"text-secondary-foreground line-through [&_*]:text-secondary-foreground [&_*]:line-through",children:t.jsx(d.TokenBigint,{data:s.value,token:s.token,showSymbol:!1})}),t.jsx("span",{className:"px-1.5 text-gray-70",children:"→"})]}),c?t.jsx("span",{children:f.APPROXIMATE_SYMBOL}):null,t.jsx(d.TokenBigint,{data:i?s.valueTo:s.value,token:s.token,showSymbol:!1}),t.jsx(x.ShortString,{className:"ml-1",maxLength:k,children:s.token.symbol})]})]}),t.jsx(h.Typography,{as:"span",variant:"caption",color:"secondary","data-testid":l.PositionAssetsTest.worth,children:u===null?t.jsx(v.NoValue,{}):_.formatMoney(u)})]},s.token.address)})})}function m(r,n){const a=new Map,c=(e,o)=>{const i=e.token.address.toLowerCase(),s=a.get(i);a.set(i,{token:s?.token??e.token,value:o==="from"?e.value:s?.value??0n,valueTo:o==="to"?e.value:s?.valueTo??0n,valueUsd:o==="from"?e.valueUsd:s?.valueUsd??null,valueToUsd:o==="to"?e.valueUsd:s?.valueToUsd??null,worth:T(s?.worth,e.valueUsd)})};for(const e of r??[])c(e,"from");for(const e of n??[])c(e,"to");return[...a.values()].filter(e=>e.worth===null||e.worth>=g).sort((e,o)=>(o.worth??0)-(e.worth??0)||e.token.address.localeCompare(o.token.address))}function T(r,n){return r===void 0?n:r===null||n===null?null:Math.max(r,n)}exports.PositionAssetsTest=l.PositionAssetsTest;exports.PositionAssets=q;exports.visibleAssets=m;

package/dist/cjs/components/base/time-to-liquidation-block/time-to-liquidation-block.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("../text/use-title-text.cjs"),u=require("../../fadeout-loading/fadeout-loading.cjs"),_=require("../../status-elements/status-elements.cjs"),r=require("../../typed-intl/index.cjs"),L=require("../../vertical-indicator/vertical-indicator.cjs"),p=require("../../../utils/format.cjs"),c=require("../../../utils/ttl.cjs"),l=require("./constants.cjs");function g({data:t,dataTo:n,approximate:s,zone:a,isLoading:o,title:i,tip:m,testId:v}){const q=x.useTitleText(),d=n!==void 0;return e.jsx(L.VerticalIndicator,{align:"center",dimPreviousValue:!1,"data-testid":v??l.TimeToLiquidationBlockTest.root,label:i!==void 0?q(i):e.jsx(r.FormattedMessageTyped,{messageId:"components.timeToLiquidationBlock.label"}),tip:m??e.jsx(r.FormattedMessageTyped,{messageId:"components.timeToLiquidationBlock.tip"}),value:e.jsx(u.FadeoutLoading,{loading:o,children:e.jsx(T,{milliseconds:t,approximate:s,zone:d?void 0:a,testId:l.TimeToLiquidationBlockTest.value})}),valueTo:d?e.jsx(u.FadeoutLoading,{loading:o,children:e.jsx(T,{milliseconds:n??null,approximate:s,zone:a,testId:l.TimeToLiquidationBlockTest.valueTo})}):void 0})}function T({milliseconds:t,approximate:n,zone:s,testId:a}){const o=t==null?void 0:c.ttlLeft(t),i=s??(t==null?void 0:c.getTTLZones(t));return e.jsxs("span",{className:"inline-flex items-center","data-testid":a,children:[t===void 0?"—":t===null?"N/A":e.jsxs(e.Fragment,{children:[n?e.jsx("span",{className:"mr-0.5",children:p.APPROXIMATE_SYMBOL}):null,o?.months!==void 0?`${o.months}mo`:o?.day!==void 0?`${o.day}d`:"<1d"]}),t!=null&&i?e.jsx("span",{className:"ml-1.5",children:e.jsx(_.HealthDot,{zone:i})}):null]})}exports.TimeToLiquidationBlockTest=l.TimeToLiquidationBlockTest;exports.TimeToLiquidationBlock=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("../text/use-title-text.cjs"),u=require("../../fadeout-loading/fadeout-loading.cjs"),p=require("../../status-elements/status-elements.cjs"),r=require("../../typed-intl/index.cjs"),_=require("../../vertical-indicator/vertical-indicator.cjs"),L=require("../../../utils/format.cjs"),c=require("../../../utils/ttl.cjs"),l=require("./constants.cjs");function g({data:t,dataTo:n,approximate:s,zone:a,isLoading:o,title:i,tip:m,testId:v}){const q=x.useTitleText(),d=n!==void 0;return e.jsx(_.VerticalIndicator,{align:"center",dimPreviousValue:!1,"data-testid":v??l.TimeToLiquidationBlockTest.root,label:i!==void 0?q(i):e.jsx(r.FormattedMessageTyped,{messageId:"components.timeToLiquidationBlock.label"}),tip:m??e.jsx(r.FormattedMessageTyped,{messageId:"components.timeToLiquidationBlock.tip"}),value:e.jsx(u.FadeoutLoading,{loading:o,children:e.jsx(T,{milliseconds:t,approximate:s&&!d,zone:d?void 0:a,testId:l.TimeToLiquidationBlockTest.value})}),valueTo:d?e.jsx(u.FadeoutLoading,{loading:o,children:e.jsx(T,{milliseconds:n??null,approximate:s,zone:a,testId:l.TimeToLiquidationBlockTest.valueTo})}):void 0})}function T({milliseconds:t,approximate:n,zone:s,testId:a}){const o=t==null?void 0:c.ttlLeft(t),i=s??(t==null?void 0:c.getTTLZones(t));return e.jsxs("span",{className:"inline-flex items-center","data-testid":a,children:[t===void 0?"—":t===null?"N/A":e.jsxs(e.Fragment,{children:[n?e.jsx("span",{className:"mr-0.5",children:L.APPROXIMATE_SYMBOL}):null,o?.months!==void 0?`${o.months}mo`:o?.day!==void 0?`${o.day}d`:"<1d"]}),t!=null&&i?e.jsx("span",{className:"ml-1.5",children:e.jsx(p.HealthDot,{zone:i})}):null]})}exports.TimeToLiquidationBlockTest=l.TimeToLiquidationBlockTest;exports.TimeToLiquidationBlock=g;

package/dist/cjs/components/base/token-amount/token-amount.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("../stack/stack.cjs"),i=require("../values/no-value.cjs");require("react");require("@gearbox-protocol/sdk/onchain");require("clsx");require("tailwind-merge");require("sonner");const a=require("../../../utils/format-money.cjs");require("luxon");require("../../../utils/z-index.cjs");require("../../points-icon/points-icon.cjs");require("viem");require("../../token-icon/token-icon.cjs");require("react-intl");require("../../tooltip/simple-tooltip.cjs");require("../../tooltip/tooltip.cjs");require("../../badge/badge.cjs");require("../../badge/chip.cjs");const c=require("../../token-template/token-template.cjs"),l=require("../../typography/typography.cjs"),n=require("./constants.cjs");function q({data:e,token:o,align:t="end"}){if(e===null)return r.jsx("span",{className:"text-secondary-foreground","data-testid":n.TokenAmountTest.root,children:"—"});const s=o??e.token;return r.jsxs(u.Stack,{gap:"xs",align:t,"data-testid":n.TokenAmountTest.root,children:[r.jsx(c.TokenTemplate,{value:e.value,token:s}),r.jsx(l.Typography,{as:"span",variant:"caption",color:"secondary",children:e.valueUsd===null?r.jsx(i.NoValue,{}):a.formatMoney(e.valueUsd)})]})}exports.TokenAmountTest=n.TokenAmountTest;exports.TokenAmount=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../stack/stack.cjs"),a=require("../values/no-value.cjs");require("react");require("@gearbox-protocol/sdk/onchain");require("clsx");require("tailwind-merge");require("sonner");const c=require("../../../utils/format.cjs"),l=require("../../../utils/format-money.cjs");require("luxon");require("../../../utils/z-index.cjs");require("../../points-icon/points-icon.cjs");require("viem");require("../../token-icon/token-icon.cjs");require("react-intl");require("../../tooltip/simple-tooltip.cjs");require("../../tooltip/tooltip.cjs");require("../../badge/badge.cjs");require("../../badge/chip.cjs");const m=require("../../token-template/token-template.cjs"),q=require("../../typography/typography.cjs"),n=require("./constants.cjs");function p({data:r,token:o,align:t="end",approximate:s}){if(r===null)return e.jsx("span",{className:"text-secondary-foreground","data-testid":n.TokenAmountTest.root,children:"—"});const u=o??r.token;return e.jsxs(i.Stack,{gap:"xs",align:t,"data-testid":n.TokenAmountTest.root,children:[e.jsxs("span",{className:"flex items-center",children:[s?e.jsx("span",{className:"mr-0.5",children:c.APPROXIMATE_SYMBOL}):null,e.jsx(m.TokenTemplate,{value:r.value,token:u})]}),e.jsx(q.Typography,{as:"span",variant:"caption",color:"secondary",children:r.valueUsd===null?e.jsx(a.NoValue,{}):l.formatMoney(r.valueUsd)})]})}exports.TokenAmountTest=n.TokenAmountTest;exports.TokenAmount=p;

package/dist/esm/components/base/health-factor-block/health-factor-block.js

@@ -1,52 +1,72 @@
-import { jsx as o } from "react/jsx-runtime";
-import { useTitleText as h } from "../text/use-title-text.js";
-import { FadeoutLoading as s } from "../../fadeout-loading/fadeout-loading.js";
-import { HealthFactor as c } from "../../health-factor/health-factor.js";
-import { FormattedMessageTyped as n } from "../../typed-intl/index.js";
-import { VerticalIndicator as g } from "../../vertical-indicator/vertical-indicator.js";
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
+import { useTitleText as x } from "../text/use-title-text.js";
+import { FadeoutLoading as c } from "../../fadeout-loading/fadeout-loading.js";
+import { HealthFactor as p } from "../../health-factor/health-factor.js";
+import { FormattedMessageTyped as u } from "../../typed-intl/index.js";
+import { VerticalIndicator as B } from "../../vertical-indicator/vertical-indicator.js";
+import { APPROXIMATE_SYMBOL as v } from "../../../utils/format.js";
 import { HealthFactorBlockTest as t } from "./constants.js";
-function b({
-  healthFactor: e,
-  healthFactorTo: a,
-  debt: r,
-  debtTo: p,
-  zone: i,
-  isLoading: l,
+function j({
+  healthFactor: o,
+  healthFactorTo: l,
+  debt: i,
+  debtTo: f,
+  approximate: r,
+  zone: s,
+  isLoading: n,
   title: d,
-  tip: u,
-  testId: v
+  tip: h,
+  testId: T
 }) {
-  const f = h(), m = a !== void 0;
-  return /* @__PURE__ */ o(
-    g,
+  const g = x(), a = l !== void 0;
+  return /* @__PURE__ */ e(
+    B,
     {
       align: "center",
       dimPreviousValue: !1,
-      "data-testid": v ?? t.root,
-      label: d !== void 0 ? f(d) : /* @__PURE__ */ o(n, { messageId: "components.healthFactorBlock.label" }),
-      tip: u ?? /* @__PURE__ */ o(n, { messageId: "components.healthFactorBlock.tip" }),
-      value: /* @__PURE__ */ o(s, { loading: l, children: e === void 0 ? /* @__PURE__ */ o("span", { "data-testid": t.value, children: "—" }) : /* @__PURE__ */ o(
-        c,
+      "data-testid": T ?? t.root,
+      label: d !== void 0 ? g(d) : /* @__PURE__ */ e(u, { messageId: "components.healthFactorBlock.label" }),
+      tip: h ?? /* @__PURE__ */ e(u, { messageId: "components.healthFactorBlock.tip" }),
+      value: /* @__PURE__ */ e(c, { loading: n, children: o === void 0 ? /* @__PURE__ */ e("span", { "data-testid": t.value, children: "—" }) : /* @__PURE__ */ m(
+        "span",
         {
-          value: e,
-          debt: r,
-          zone: m ? void 0 : i,
-          "data-testid": t.value
+          className: "inline-flex items-center",
+          "data-testid": t.value,
+          children: [
+            r && !a ? /* @__PURE__ */ e("span", { className: "mr-0.5", children: v }) : null,
+            /* @__PURE__ */ e(
+              p,
+              {
+                value: o,
+                debt: i,
+                zone: a ? void 0 : s
+              }
+            )
+          ]
         }
       ) }),
-      valueTo: m ? /* @__PURE__ */ o(s, { loading: l, children: /* @__PURE__ */ o(
-        c,
+      valueTo: a ? /* @__PURE__ */ e(c, { loading: n, children: /* @__PURE__ */ m(
+        "span",
         {
-          value: a,
-          debt: p ?? r,
-          zone: i,
-          "data-testid": t.valueTo
+          className: "inline-flex items-center",
+          "data-testid": t.valueTo,
+          children: [
+            r ? /* @__PURE__ */ e("span", { className: "mr-0.5", children: v }) : null,
+            /* @__PURE__ */ e(
+              p,
+              {
+                value: l,
+                debt: f ?? i,
+                zone: s
+              }
+            )
+          ]
         }
       ) }) : void 0
     }
   );
 }
 export {
-  b as HealthFactorBlock,
+  j as HealthFactorBlock,
   t as HealthFactorBlockTest
 };

package/dist/esm/components/base/liquidation-price-block/liquidation-price-block.js

@@ -2,12 +2,12 @@ import { jsx as i, jsxs as c, Fragment as T } from "react/jsx-runtime";
 import { useTitleText as b } from "../text/use-title-text.js";
 import { FadeoutLoading as u } from "../../fadeout-loading/fadeout-loading.js";
 import { FormattedNumberString as g } from "../../formatted-number/formatted-number.js";
-import { HealthDot as I } from "../../status-elements/status-elements.js";
-import { FormattedMessageTyped as f } from "../../typed-intl/index.js";
-import { VerticalIndicator as q } from "../../vertical-indicator/vertical-indicator.js";
-import { APPROXIMATE_SYMBOL as x } from "../../../utils/format.js";
+import { HealthDot as x } from "../../status-elements/status-elements.js";
+import { FormattedMessageTyped as p } from "../../typed-intl/index.js";
+import { VerticalIndicator as I } from "../../vertical-indicator/vertical-indicator.js";
+import { APPROXIMATE_SYMBOL as q } from "../../../utils/format.js";
 import { bnToLiquidationPriceView as B } from "../../../utils/parse-input-to-bn.js";
-import { LiquidationPriceBlockTest as l } from "./constants.js";
+import { LiquidationPriceBlockTest as n } from "./constants.js";
 function L(e, o) {
   if (!(!e || !o))
     return `${e.symbol} / ${o.symbol}`;
@@ -17,45 +17,45 @@ function S({
   priceTo: o,
   collateral: t,
   underlying: r,
-  approximate: n,
-  zone: a,
-  isLoading: m,
-  title: s,
+  approximate: a,
+  zone: m,
+  isLoading: s,
+  title: d,
   tip: v,
   testId: P
 }) {
-  const h = b(), d = o !== void 0;
+  const h = b(), l = o !== void 0;
   return /* @__PURE__ */ i(
-    q,
+    I,
     {
       align: "center",
       dimPreviousValue: !1,
-      "data-testid": P ?? l.root,
-      label: s !== void 0 ? h(s) : /* @__PURE__ */ i(f, { messageId: "components.liquidationPriceBlock.label" }),
-      tip: v ?? /* @__PURE__ */ i(f, { messageId: "components.liquidationPriceBlock.tip" }),
-      value: /* @__PURE__ */ i(u, { loading: m, children: /* @__PURE__ */ i(
-        p,
+      "data-testid": P ?? n.root,
+      label: d !== void 0 ? h(d) : /* @__PURE__ */ i(p, { messageId: "components.liquidationPriceBlock.label" }),
+      tip: v ?? /* @__PURE__ */ i(p, { messageId: "components.liquidationPriceBlock.tip" }),
+      value: /* @__PURE__ */ i(u, { loading: s, children: /* @__PURE__ */ i(
+        f,
         {
           price: e,
-          approximate: n,
-          zone: d ? void 0 : a,
-          testId: l.value
+          approximate: a && !l,
+          zone: l ? void 0 : m,
+          testId: n.value
         }
       ) }),
-      valueTo: d ? /* @__PURE__ */ i(u, { loading: m, children: /* @__PURE__ */ i(
-        p,
+      valueTo: l ? /* @__PURE__ */ i(u, { loading: s, children: /* @__PURE__ */ i(
+        f,
         {
           price: o ?? null,
-          approximate: n,
-          zone: a,
-          testId: l.valueTo
+          approximate: a,
+          zone: m,
+          testId: n.valueTo
         }
       ) }) : void 0,
       valueDescription: L(t, r)
     }
   );
 }
-function p({
+function f({
   price: e,
   approximate: o,
   zone: t,
@@ -63,13 +63,13 @@ function p({
 }) {
   return /* @__PURE__ */ c("span", { className: "inline-flex items-center", "data-testid": r, children: [
     e === void 0 ? "—" : e === null || e === 0n ? "N/A" : /* @__PURE__ */ c(T, { children: [
-      o ? /* @__PURE__ */ i("span", { className: "mr-0.5", children: x }) : null,
+      o ? /* @__PURE__ */ i("span", { className: "mr-0.5", children: q }) : null,
       /* @__PURE__ */ i(g, { value: B(e) })
     ] }),
-    t ? /* @__PURE__ */ i("span", { className: "ml-1.5", children: /* @__PURE__ */ i(I, { zone: t }) }) : null
+    t ? /* @__PURE__ */ i("span", { className: "ml-1.5", children: /* @__PURE__ */ i(x, { zone: t }) }) : null
   ] });
 }
 export {
   S as LiquidationPriceBlock,
-  l as LiquidationPriceBlockTest
+  n as LiquidationPriceBlockTest
 };

package/dist/esm/components/base/position-assets/constants.js

@@ -1,6 +1,7 @@
 class t {
   static root = "position-assets-root";
   static row = "position-assets-row";
+  static worth = "position-assets-worth";
   static empty = "position-assets-empty";
 }
 export {

package/dist/esm/components/base/position-assets/position-assets.js

@@ -1,99 +1,117 @@
-import { jsx as e, jsxs as m, Fragment as p } from "react/jsx-runtime";
+import { jsx as e, jsxs as m, Fragment as f } from "react/jsx-runtime";
 import { Stack as h } from "../stack/stack.js";
-import "../../help-tip/help-tip.js";
+import { NoValue as v } from "../values/no-value.js";
 import "react";
-import "react-intl";
 import "@gearbox-protocol/sdk/onchain";
 import "clsx";
 import "tailwind-merge";
 import "sonner";
-import { APPROXIMATE_SYMBOL as f } from "../../../utils/format.js";
+import { APPROXIMATE_SYMBOL as k } from "../../../utils/format.js";
+import { formatMoney as g } from "../../../utils/format-money.js";
 import "luxon";
 import "../../../utils/z-index.js";
 import "../../points-icon/points-icon.js";
-import { TokenBigint as d } from "../values/scalars.js";
+import { TokenBigint as p } from "../values/scalars.js";
 import "../../badge/badge.js";
 import "../../badge/chip.js";
-import { ShortString as u } from "../../short-string/short-string.js";
-import { TokenSymbol as k } from "../../token-symbol/token-symbol.js";
-import { Typography as v } from "../../typography/typography.js";
-import { PositionAssetsTest as c } from "./constants.js";
-const g = 1, y = 20;
-function I({
+import "react-intl";
+import { ShortString as y } from "../../short-string/short-string.js";
+import { TokenSymbol as T } from "../../token-symbol/token-symbol.js";
+import { Typography as u } from "../../typography/typography.js";
+import { PositionAssetsTest as d } from "./constants.js";
+const x = 1, U = 20;
+function G({
   assets: s,
-  to: r,
+  to: n,
   empty: a,
-  approximate: l,
+  approximate: i,
   testId: o
 }) {
-  const n = S(s, r), i = r !== void 0;
-  return /* @__PURE__ */ e(h, { gap: "sm", align: "end", "data-testid": o ?? c.root, children: n.length === 0 ? a !== void 0 && /* @__PURE__ */ e(
-    v,
+  const r = S(s, n), l = n !== void 0;
+  return /* @__PURE__ */ e(h, { gap: "sm", align: "end", "data-testid": o ?? d.root, children: r.length === 0 ? a !== void 0 && /* @__PURE__ */ e(
+    u,
     {
       variant: "caption",
       color: "secondary",
       as: "div",
-      "data-testid": c.empty,
+      "data-testid": d.empty,
       children: a
     }
-  ) : n.map((t) => /* @__PURE__ */ m(
-    "span",
-    {
-      className: "flex items-center gap-2",
-      "data-testid": c.row,
-      children: [
-        /* @__PURE__ */ e(k, { size: 20, token: t.token }),
-        /* @__PURE__ */ m("span", { className: "flex items-center", children: [
-          i && /* @__PURE__ */ m(p, { children: [
-            /* @__PURE__ */ e("span", { className: "text-secondary-foreground line-through [&_*]:text-secondary-foreground [&_*]:line-through", children: /* @__PURE__ */ e(
-              d,
-              {
-                data: t.value,
-                token: t.token,
-                showSymbol: !1
-              }
-            ) }),
-            /* @__PURE__ */ e("span", { className: "px-1.5 text-gray-70", children: "→" })
+  ) : r.map((t) => {
+    const c = l ? t.valueToUsd : t.valueUsd;
+    return /* @__PURE__ */ m(
+      "span",
+      {
+        className: "flex flex-col items-end",
+        "data-testid": d.row,
+        children: [
+          /* @__PURE__ */ m("span", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ e(T, { size: 20, token: t.token }),
+            /* @__PURE__ */ m("span", { className: "flex items-center", children: [
+              l && /* @__PURE__ */ m(f, { children: [
+                /* @__PURE__ */ e("span", { className: "text-secondary-foreground line-through [&_*]:text-secondary-foreground [&_*]:line-through", children: /* @__PURE__ */ e(
+                  p,
+                  {
+                    data: t.value,
+                    token: t.token,
+                    showSymbol: !1
+                  }
+                ) }),
+                /* @__PURE__ */ e("span", { className: "px-1.5 text-gray-70", children: "→" })
+              ] }),
+              i ? /* @__PURE__ */ e("span", { children: k }) : null,
+              /* @__PURE__ */ e(
+                p,
+                {
+                  data: l ? t.valueTo : t.value,
+                  token: t.token,
+                  showSymbol: !1
+                }
+              ),
+              /* @__PURE__ */ e(y, { className: "ml-1", maxLength: U, children: t.token.symbol })
+            ] })
           ] }),
-          l ? /* @__PURE__ */ e("span", { children: f }) : null,
           /* @__PURE__ */ e(
-            d,
+            u,
             {
-              data: i ? t.valueTo : t.value,
-              token: t.token,
-              showSymbol: !1
+              as: "span",
+              variant: "caption",
+              color: "secondary",
+              "data-testid": d.worth,
+              children: c === null ? /* @__PURE__ */ e(v, {}) : g(c)
             }
-          ),
-          /* @__PURE__ */ e(u, { className: "ml-1", maxLength: y, children: t.token.symbol })
-        ] })
-      ]
-    },
-    t.token.address
-  )) });
+          )
+        ]
+      },
+      t.token.address
+    );
+  }) });
 }
-function S(s, r) {
-  const a = /* @__PURE__ */ new Map(), l = (o, n) => {
-    const i = o.token.address.toLowerCase(), t = a.get(i);
-    a.set(i, {
+function S(s, n) {
+  const a = /* @__PURE__ */ new Map(), i = (o, r) => {
+    const l = o.token.address.toLowerCase(), t = a.get(l);
+    a.set(l, {
       token: t?.token ?? o.token,
       // a token only the other side holds is a zero here, not a gap
-      value: n === "from" ? o.value : t?.value ?? 0n,
-      valueTo: n === "to" ? o.value : t?.valueTo ?? 0n,
-      worth: x(t?.worth, o.valueUsd)
+      value: r === "from" ? o.value : t?.value ?? 0n,
+      valueTo: r === "to" ? o.value : t?.valueTo ?? 0n,
+      valueUsd: r === "from" ? o.valueUsd : t?.valueUsd ?? null,
+      valueToUsd: r === "to" ? o.valueUsd : t?.valueToUsd ?? null,
+      worth: M(t?.worth, o.valueUsd)
     });
   };
-  for (const o of s ?? []) l(o, "from");
-  for (const o of r ?? []) l(o, "to");
-  return [...a.values()].filter((o) => o.worth === null || o.worth >= g).sort(
-    (o, n) => (n.worth ?? 0) - (o.worth ?? 0) || // a tie has to break the same way every render, or the rows drift
-    o.token.address.localeCompare(n.token.address)
+  for (const o of s ?? []) i(o, "from");
+  for (const o of n ?? []) i(o, "to");
+  return [...a.values()].filter((o) => o.worth === null || o.worth >= x).sort(
+    (o, r) => (r.worth ?? 0) - (o.worth ?? 0) || // a tie has to break the same way every render, or the rows drift
+    o.token.address.localeCompare(r.token.address)
   );
 }
-function x(s, r) {
-  return s === void 0 ? r : s === null || r === null ? null : Math.max(s, r);
+function M(s, n) {
+  return s === void 0 ? n : s === null || n === null ? null : Math.max(s, n);
 }
 export {
-  I as PositionAssets,
-  c as PositionAssetsTest,
+  G as PositionAssets,
+  d as PositionAssetsTest,
   S as visibleAssets
 };

package/dist/esm/components/base/time-to-liquidation-block/time-to-liquidation-block.js

@@ -4,44 +4,44 @@ import { FadeoutLoading as s } from "../../fadeout-loading/fadeout-loading.js";
 import { HealthDot as g } from "../../status-elements/status-elements.js";
 import { FormattedMessageTyped as u } from "../../typed-intl/index.js";
 import { VerticalIndicator as L } from "../../vertical-indicator/vertical-indicator.js";
-import { APPROXIMATE_SYMBOL as I } from "../../../utils/format.js";
-import { ttlLeft as x, getTTLZones as B } from "../../../utils/ttl.js";
-import { TimeToLiquidationBlockTest as a } from "./constants.js";
+import { APPROXIMATE_SYMBOL as x } from "../../../utils/format.js";
+import { ttlLeft as I, getTTLZones as B } from "../../../utils/ttl.js";
+import { TimeToLiquidationBlockTest as d } from "./constants.js";
 function j({
   data: o,
   dataTo: n,
   approximate: r,
-  zone: l,
+  zone: a,
   isLoading: e,
   title: i,
-  tip: v,
-  testId: p
+  tip: p,
+  testId: v
 }) {
-  const T = h(), d = n !== void 0;
+  const T = h(), l = n !== void 0;
   return /* @__PURE__ */ t(
     L,
     {
       align: "center",
       dimPreviousValue: !1,
-      "data-testid": p ?? a.root,
+      "data-testid": v ?? d.root,
       label: i !== void 0 ? T(i) : /* @__PURE__ */ t(u, { messageId: "components.timeToLiquidationBlock.label" }),
-      tip: v ?? /* @__PURE__ */ t(u, { messageId: "components.timeToLiquidationBlock.tip" }),
+      tip: p ?? /* @__PURE__ */ t(u, { messageId: "components.timeToLiquidationBlock.tip" }),
       value: /* @__PURE__ */ t(s, { loading: e, children: /* @__PURE__ */ t(
         c,
         {
           milliseconds: o,
-          approximate: r,
-          zone: d ? void 0 : l,
-          testId: a.value
+          approximate: r && !l,
+          zone: l ? void 0 : a,
+          testId: d.value
         }
       ) }),
-      valueTo: d ? /* @__PURE__ */ t(s, { loading: e, children: /* @__PURE__ */ t(
+      valueTo: l ? /* @__PURE__ */ t(s, { loading: e, children: /* @__PURE__ */ t(
         c,
         {
           milliseconds: n ?? null,
           approximate: r,
-          zone: l,
-          testId: a.valueTo
+          zone: a,
+          testId: d.valueTo
         }
       ) }) : void 0
     }
@@ -51,12 +51,12 @@ function c({
   milliseconds: o,
   approximate: n,
   zone: r,
-  testId: l
+  testId: a
 }) {
-  const e = o == null ? void 0 : x(o), i = r ?? (o == null ? void 0 : B(o));
-  return /* @__PURE__ */ m("span", { className: "inline-flex items-center", "data-testid": l, children: [
+  const e = o == null ? void 0 : I(o), i = r ?? (o == null ? void 0 : B(o));
+  return /* @__PURE__ */ m("span", { className: "inline-flex items-center", "data-testid": a, children: [
     o === void 0 ? "—" : o === null ? "N/A" : /* @__PURE__ */ m(f, { children: [
-      n ? /* @__PURE__ */ t("span", { className: "mr-0.5", children: I }) : null,
+      n ? /* @__PURE__ */ t("span", { className: "mr-0.5", children: x }) : null,
       e?.months !== void 0 ? `${e.months}mo` : e?.day !== void 0 ? `${e.day}d` : "<1d"
     ] }),
     o != null && i ? /* @__PURE__ */ t("span", { className: "ml-1.5", children: /* @__PURE__ */ t(g, { zone: i }) }) : null
@@ -64,5 +64,5 @@ function c({
 }
 export {
   j as TimeToLiquidationBlock,
-  a as TimeToLiquidationBlockTest
+  d as TimeToLiquidationBlockTest
 };

package/dist/esm/components/base/token-amount/token-amount.js

@@ -1,12 +1,13 @@
-import { jsx as r, jsxs as e } from "react/jsx-runtime";
-import { Stack as n } from "../stack/stack.js";
+import { jsx as r, jsxs as t } from "react/jsx-runtime";
+import { Stack as s } from "../stack/stack.js";
 import { NoValue as a } from "../values/no-value.js";
 import "react";
 import "@gearbox-protocol/sdk/onchain";
 import "clsx";
 import "tailwind-merge";
 import "sonner";
-import { formatMoney as s } from "../../../utils/format-money.js";
+import { APPROXIMATE_SYMBOL as l } from "../../../utils/format.js";
+import { formatMoney as c } from "../../../utils/format-money.js";
 import "luxon";
 import "../../../utils/z-index.js";
 import "../../points-icon/points-icon.js";
@@ -17,30 +18,34 @@ import "../../tooltip/simple-tooltip.js";
 import "../../tooltip/tooltip.js";
 import "../../badge/badge.js";
 import "../../badge/chip.js";
-import { TokenTemplate as l } from "../../token-template/token-template.js";
-import { Typography as u } from "../../typography/typography.js";
-import { TokenAmountTest as t } from "./constants.js";
-function C({
+import { TokenTemplate as u } from "../../token-template/token-template.js";
+import { Typography as f } from "../../typography/typography.js";
+import { TokenAmountTest as m } from "./constants.js";
+function Y({
   data: o,
-  token: m,
-  align: i = "end"
+  token: e,
+  align: i = "end",
+  approximate: n
 }) {
   if (o === null)
     return /* @__PURE__ */ r(
       "span",
       {
         className: "text-secondary-foreground",
-        "data-testid": t.root,
+        "data-testid": m.root,
         children: "—"
       }
     );
-  const p = m ?? o.token;
-  return /* @__PURE__ */ e(n, { gap: "xs", align: i, "data-testid": t.root, children: [
-    /* @__PURE__ */ r(l, { value: o.value, token: p }),
-    /* @__PURE__ */ r(u, { as: "span", variant: "caption", color: "secondary", children: o.valueUsd === null ? /* @__PURE__ */ r(a, {}) : s(o.valueUsd) })
+  const p = e ?? o.token;
+  return /* @__PURE__ */ t(s, { gap: "xs", align: i, "data-testid": m.root, children: [
+    /* @__PURE__ */ t("span", { className: "flex items-center", children: [
+      n ? /* @__PURE__ */ r("span", { className: "mr-0.5", children: l }) : null,
+      /* @__PURE__ */ r(u, { value: o.value, token: p })
+    ] }),
+    /* @__PURE__ */ r(f, { as: "span", variant: "caption", color: "secondary", children: o.valueUsd === null ? /* @__PURE__ */ r(a, {}) : c(o.valueUsd) })
   ] });
 }
 export {
-  C as TokenAmount,
-  t as TokenAmountTest
+  Y as TokenAmount,
+  m as TokenAmountTest
 };

package/dist/types/components/base/health-factor-block/health-factor-block.d.ts

@@ -13,6 +13,13 @@ export interface HealthFactorBlockProps {
     readonly debt: bigint;
     /** Debt after the operation (defaults to `debt`). */
     readonly debtTo?: bigint;
+    /**
+     * Prefixes the figure with {@link APPROXIMATE_SYMBOL}, for a factor the
+     * operation projects rather than promises. Only the projected side is
+     * marked: on a `from → to` row the "from" is where the account stands now,
+     * which is measured, not estimated.
+     */
+    readonly approximate?: boolean;
     /** Pre-computed zone; if not set, derived from the value. */
     readonly zone?: HFZones;
     readonly isLoading?: boolean;
@@ -26,4 +33,4 @@ export interface HealthFactorBlockProps {
  * "Health factor" row of a preview: label + help tip on the left, the zone-
  * colored HF (with optional from → to transition) on the right.
  */
-export declare function HealthFactorBlock({ healthFactor, healthFactorTo, debt, debtTo, zone, isLoading, title, tip, testId, }: HealthFactorBlockProps): React.ReactElement;
+export declare function HealthFactorBlock({ healthFactor, healthFactorTo, debt, debtTo, approximate, zone, isLoading, title, tip, testId, }: HealthFactorBlockProps): React.ReactElement;

package/dist/types/components/base/liquidation-price-block/liquidation-price-block.d.ts

@@ -17,10 +17,10 @@ export interface LiquidationPriceBlockProps {
     /** Underlying token of the quoted pair. */
     readonly underlying?: Token;
     /**
-     * Prefixes the figure with {@link APPROXIMATE_SYMBOL}. For a projection the
-     * operation cannot promise exactly — a routed leg the market can move under.
-     * Both columns are marked when the row renders `from → to`: the "from" of a
-     * projected pair is projected too.
+     * Prefixes the figure with {@link APPROXIMATE_SYMBOL}, for a value the
+     * operation projects rather than promises. Only the projected side is
+     * marked: on a `from → to` row the "from" is where the account stands now,
+     * which is measured, not estimated.
      */
     readonly approximate?: boolean;
     /** Zone dot next to the price. */

package/dist/types/components/base/position-assets/constants.d.ts

@@ -1,5 +1,6 @@
 export declare class PositionAssetsTest {
     static root: string;
     static row: string;
+    static worth: string;
     static empty: string;
 }

package/dist/types/components/base/position-assets/position-assets.d.ts

@@ -53,6 +53,10 @@ export interface AssetRow {
      * dust and order. `null` when a side the oracle cannot price is involved.
      */
     readonly worth: number | null;
+    /** USD of the "now" side; `null` where the oracle could not price it. */
+    readonly valueUsd: number | null;
+    /** USD of the "after" side, for the caption a paired row shows. */
+    readonly valueToUsd: number | null;
 }
 /**
  * What earns a row, most valuable first — decided across both sides, so a

package/dist/types/components/base/time-to-liquidation-block/time-to-liquidation-block.d.ts

@@ -12,10 +12,10 @@ export interface TimeToLiquidationBlockProps {
     /** Time after the operation; renders a from → to transition. */
     readonly dataTo?: bigint | null;
     /**
-     * Prefixes the figure with {@link APPROXIMATE_SYMBOL}. For a projection the
-     * operation cannot promise exactly — a routed leg the market can move under.
-     * Both columns are marked when the row renders `from → to`: the "from" of a
-     * projected pair is projected too.
+     * Prefixes the figure with {@link APPROXIMATE_SYMBOL}, for a value the
+     * operation projects rather than promises. Only the projected side is
+     * marked: on a `from → to` row the "from" is where the account stands now,
+     * which is measured, not estimated.
      */
     readonly approximate?: boolean;
     /** Pre-computed zone; if not set, derived from the value. */

package/dist/types/components/base/token-amount/token-amount.d.ts

@@ -28,5 +28,12 @@ export type TokenAmountProps = TokenAmountDataProps & {
      * wrapper sets. Pass `start` inside a card, where the left edge is right.
      */
     readonly align?: TokenAmountAlign;
+    /**
+     * Prefixes the token line with {@link APPROXIMATE_SYMBOL}, for a figure the
+     * operation projects rather than promises. The USD caption underneath is not
+     * marked: the mark belongs beside the amount it hedges, and repeating it on
+     * the second line only reads as a second claim.
+     */
+    readonly approximate?: boolean;
 };
-export declare function TokenAmount({ data, token, align, }: TokenAmountProps): React.ReactElement;
+export declare function TokenAmount({ data, token, align, approximate, }: TokenAmountProps): React.ReactElement;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/ui-kit",
-  "version": "4.0.0-next.45",
+  "version": "4.0.0-next.47",
   "description": "Internal UI components",
   "repository": {
     "type": "git",