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

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

@@ -16,8 +16,8 @@ export declare function formatBreakdownRate(value: Bps): string;
 export interface ApyBreakdownBodyProps {
     /** Heading to the left of the chip — "Net APY (7d)" and the like. */
     readonly title: React.ReactNode;
-    /** The figure the chip prints. */
-    readonly chip: string;
+    /** The figure the chip prints, or {@link NoValue} when there is none. */
+    readonly chip: React.ReactNode;
     /** Green chip when the net is positive; muted otherwise. */
     readonly chipPositive?: boolean;
     readonly chipTestId?: string;
@@ -31,7 +31,8 @@ export interface ApyBreakdownBodyProps {
 export declare function ApyBreakdownBody({ title, chip, chipPositive, chipTestId, children, testId, }: ApyBreakdownBodyProps): React.ReactElement;
 export interface ApyBreakdownRowProps {
     readonly label: React.ReactNode;
-    readonly value: string;
+    /** The rate, or {@link NoValue} when the feed has none. */
+    readonly value: React.ReactNode;
     readonly subtext?: React.ReactNode;
     readonly muted?: boolean;
     readonly testId?: string;

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

@@ -16,6 +16,13 @@ export interface LiquidationPriceBlockProps {
     readonly collateral?: Token | null;
     /** 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.
+     */
+    readonly approximate?: boolean;
     /** Zone dot next to the price. */
     readonly zone?: HFZones;
     readonly isLoading?: boolean;
@@ -29,4 +36,4 @@ export interface LiquidationPriceBlockProps {
  * "Liquidation price" row of a preview: label + help tip, the formatted price
  * (with optional from → to and zone dot), and the price pair underneath.
  */
-export declare function LiquidationPriceBlock({ price, priceTo, collateral, underlying, zone, isLoading, title, tip, testId, }: LiquidationPriceBlockProps): React.ReactElement;
+export declare function LiquidationPriceBlock({ price, priceTo, collateral, underlying, approximate, zone, isLoading, title, tip, testId, }: LiquidationPriceBlockProps): React.ReactElement;

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

@@ -12,6 +12,12 @@ export interface PositionAssetsProps {
     readonly to?: readonly TokenAmount[];
     /** Rendered in place of the rows when nothing survives the dust filter. */
     readonly empty?: React.ReactNode;
+    /**
+     * Prefixes the projected amount with {@link APPROXIMATE_SYMBOL} — the "after"
+     * of a pair, or the only column when the list itself is a projection. The
+     * struck "before" is never marked: it is what the account holds now.
+     */
+    readonly approximate?: boolean;
     readonly testId?: string;
 }
 /**
@@ -34,7 +40,7 @@ export interface PositionAssetsProps {
  * rounding, and listing them buries the holdings that matter. A token the
  * oracle cannot price is never dust — an unknown value is not a small one.
  */
-export declare function PositionAssets({ assets, to, empty, testId, }: PositionAssetsProps): React.ReactElement;
+export declare function PositionAssets({ assets, to, empty, approximate, testId, }: PositionAssetsProps): React.ReactElement;
 /** One token across both sides of a change. */
 export interface AssetRow {
     readonly token: TokenAmount["token"];

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

@@ -11,6 +11,13 @@ export interface TimeToLiquidationBlockProps {
     readonly data?: bigint | null;
     /** 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.
+     */
+    readonly approximate?: boolean;
     /** Pre-computed zone; if not set, derived from the value. */
     readonly zone?: TTLZones;
     readonly isLoading?: boolean;
@@ -24,4 +31,4 @@ export interface TimeToLiquidationBlockProps {
  * "Time to liquidation" row of a preview: label + help tip, the remaining
  * time as `Nmo` / `Nd` / `<1d` with a zone dot, optionally from → to.
  */
-export declare function TimeToLiquidationBlock({ data, dataTo, zone, isLoading, title, tip, testId, }: TimeToLiquidationBlockProps): React.ReactElement;
+export declare function TimeToLiquidationBlock({ data, dataTo, approximate, zone, isLoading, title, tip, testId, }: TimeToLiquidationBlockProps): React.ReactElement;

package/dist/types/components/base/values/constants.d.ts

@@ -9,6 +9,7 @@ export declare class ValueTest {
     static tokenBigint: string;
     static points: string;
     static placeholder: string;
+    static accruing: string;
 }
 export declare class PositionShortLabelTest {
     static root: string;

package/dist/types/components/base/values/index.d.ts

@@ -1,4 +1,5 @@
 export { ValueTest } from './constants';
+export { NoValue, type NoValueProps } from './no-value';
 export { PnlValue } from './pnl-value';
 export { PointsValue, type PointsValueProps } from './points-value';
 export { PositionShortLabel, PositionShortLabelTest, } from './position-short-label';

package/dist/types/components/base/values/no-value.d.ts

@@ -0,0 +1,25 @@
+import { default as React } from 'react';
+export interface NoValueProps {
+    /**
+     * Why the figure is absent, when the absence has an explanation worth
+     * giving. `"7d"` — the trailing seven-day average has not been computed yet
+     * — is the only one so far; anything else, including a spot figure that is
+     * simply not there, keeps the dash.
+     */
+    readonly reason?: "7d";
+}
+/**
+ * Whatever stands where a figure would be.
+ *
+ * One component rather than a dash per call site, so no two surfaces can
+ * quietly disagree about what an absent value looks like — and so an absence
+ * that has an explanation carries it everywhere at once rather than wherever
+ * someone remembered to add it.
+ *
+ * The explained form is deliberately not a skeleton: a skeleton promises the
+ * value in a moment, and this one waits on days of history.
+ *
+ * The visually-hidden copy is load-bearing — `HelpTipIcon` is `aria-hidden`,
+ * so without it the cell would reach a screen reader as nothing at all.
+ */
+export declare function NoValue({ reason }: NoValueProps): React.ReactElement;

package/dist/types/components/base/values/scalars.d.ts

@@ -10,7 +10,7 @@ import { default as React } from 'react';
  */
 export declare function bps(value: Bps): string;
 export interface ApyValueProps {
-    /** A breakdown (tooltip-able) or a bare rate; `undefined` renders a dash. */
+    /** A breakdown (tooltip-able) or a bare rate; `undefined` renders the empty state. */
     readonly data: ApyBreakdown | Bps | undefined;
     /**
      * Whether a breakdown carries its yield tooltip on hover. Off where the
@@ -22,7 +22,12 @@ export interface ApyValueProps {
      * @default true
      */
     readonly tooltip?: boolean;
-    /** When `"7d"`, the breakdown tooltip labels carry the averaging-window suffix. */
+    /**
+     * The averaging window this figure comes from. `"7d"` suffixes the breakdown
+     * tooltip labels — and, when the rate is missing, says the average is still
+     * accruing rather than printing a dash. A spot figure keeps the dash: history
+     * has nothing to do with why it is absent.
+     */
     readonly period?: "7d";
 }
 /**

package/dist/types/locale/en.json.d.ts

@@ -60,6 +60,7 @@ declare const _default: {
   "components.filterModal.reset": "Reset",
   "components.filterModal.apply": "Apply",
 
+  "components.value.accruing": "Averaged data is still being computed and will be available shortly.",
   "components.APY.tip": "These APYs are derived from the underlying protocols’ APIs and may differ in reality. Check respective protocols for their methodology.",
 
   "components.creditSessionDetailedLiquidation.graph.noData": "No data",

package/dist/types/utils/format.d.ts

@@ -1,3 +1,11 @@
+/**
+ * Marks a figure as an estimate rather than a promise: a routed amount that
+ * slippage can move, a projection quoted at prices that will have drifted by
+ * the time the transaction lands.
+ *
+ * Declared once so every screen that hedges a number hedges it the same way.
+ **/
+export declare const APPROXIMATE_SYMBOL = "\u2248";
 export declare function formatBytecodeSize(size: number): string;
 export declare function formatBytecodeVersion(version: number): string;
 export declare function formatTimestamp(timestamp: number): string;

package/package.json

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