@gearbox-protocol/ui-kit 4.0.0-next.27 → 4.0.0-next.29
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/apy-breakdown-body/apy-breakdown-body.cjs +1 -0
- package/dist/cjs/components/base/apy-breakdown-body/index.cjs +1 -0
- package/dist/cjs/components/base/info-list/info-list.cjs +1 -1
- package/dist/cjs/components/base/pool-apy-breakdown-card/constants.cjs +1 -1
- package/dist/cjs/components/base/pool-apy-breakdown-card/pool-apy-breakdown-card.cjs +1 -1
- package/dist/cjs/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.cjs +1 -1
- package/dist/cjs/components/index.cjs +1 -1
- package/dist/cjs/components/tooltip/simple-tooltip.cjs +1 -1
- package/dist/cjs/components/yield-breakdown-tooltip/index.cjs +1 -1
- package/dist/cjs/components/yield-breakdown-tooltip/yield-breakdown-tooltip.cjs +1 -1
- package/dist/cjs/index.cjs +1 -1
- package/dist/esm/components/base/apy-breakdown-body/apy-breakdown-body.js +106 -0
- package/dist/esm/components/base/apy-breakdown-body/index.js +10 -0
- package/dist/esm/components/base/info-list/info-list.js +1 -1
- package/dist/esm/components/base/pool-apy-breakdown-card/constants.js +5 -2
- package/dist/esm/components/base/pool-apy-breakdown-card/pool-apy-breakdown-card.js +111 -57
- package/dist/esm/components/base/strategy-apy-breakdown-card/strategy-apy-breakdown-card.js +138 -209
- package/dist/esm/components/index.js +45 -44
- package/dist/esm/components/tooltip/simple-tooltip.js +56 -54
- package/dist/esm/components/yield-breakdown-tooltip/index.js +2 -1
- package/dist/esm/components/yield-breakdown-tooltip/yield-breakdown-tooltip.js +136 -156
- package/dist/esm/index.js +191 -190
- package/dist/globals.css +1 -1
- package/dist/types/components/base/apy-breakdown-body/apy-breakdown-body.d.ts +42 -0
- package/dist/types/components/base/apy-breakdown-body/index.d.ts +2 -0
- package/dist/types/components/base/pool-apy-breakdown-card/constants.d.ts +3 -0
- package/dist/types/components/base/pool-apy-breakdown-card/pool-apy-breakdown-card.d.ts +9 -7
- package/dist/types/components/yield-breakdown-tooltip/yield-breakdown-tooltip.d.ts +23 -3
- package/package.json +1 -1
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { Bps } from '@gearbox-protocol/sdk/model';
|
|
2
|
+
import { default as React } from 'react';
|
|
3
|
+
import { LocaleKeys } from '../../../locale';
|
|
4
|
+
export declare const BREAKDOWN_DASH = "\u2014";
|
|
5
|
+
/** Width of an APY breakdown in a tooltip — the one place it is named. */
|
|
6
|
+
export declare const APY_BREAKDOWN_TOOLTIP_WIDTH = "400px";
|
|
7
|
+
export declare function periodMessageId(period: "7d" | undefined, base: LocaleKeys, with7d: LocaleKeys): LocaleKeys;
|
|
8
|
+
/**
|
|
9
|
+
* A rate as the rows write it: two decimals, and a real minus sign.
|
|
10
|
+
*
|
|
11
|
+
* Two decimals at every scale, unlike the compact form the rest of the kit
|
|
12
|
+
* uses above 1000%. A breakdown is read by adding it up, and `1.2K%` carries
|
|
13
|
+
* three significant figures — enough to make a correct column look wrong.
|
|
14
|
+
*/
|
|
15
|
+
export declare function formatBreakdownRate(value: Bps): string;
|
|
16
|
+
export interface ApyBreakdownBodyProps {
|
|
17
|
+
/** Heading to the left of the chip — "Net APY (7d)" and the like. */
|
|
18
|
+
readonly title: React.ReactNode;
|
|
19
|
+
/** The figure the chip prints. */
|
|
20
|
+
readonly chip: string;
|
|
21
|
+
/** Green chip when the net is positive; muted otherwise. */
|
|
22
|
+
readonly chipPositive?: boolean;
|
|
23
|
+
readonly chipTestId?: string;
|
|
24
|
+
readonly children: React.ReactNode;
|
|
25
|
+
readonly testId?: string;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* Shared chrome of an APY breakdown: header with a net chip, then rows.
|
|
29
|
+
* Used by the pool and strategy cards and by the yield tooltip.
|
|
30
|
+
*/
|
|
31
|
+
export declare function ApyBreakdownBody({ title, chip, chipPositive, chipTestId, children, testId, }: ApyBreakdownBodyProps): React.ReactElement;
|
|
32
|
+
export interface ApyBreakdownRowProps {
|
|
33
|
+
readonly label: React.ReactNode;
|
|
34
|
+
readonly value: string;
|
|
35
|
+
readonly subtext?: React.ReactNode;
|
|
36
|
+
readonly muted?: boolean;
|
|
37
|
+
readonly testId?: string;
|
|
38
|
+
readonly valueTestId?: string;
|
|
39
|
+
readonly captionTestId?: string;
|
|
40
|
+
}
|
|
41
|
+
export declare function ApyBreakdownRow({ label, value, subtext, muted, testId, valueTestId, captionTestId, }: ApyBreakdownRowProps): React.ReactElement;
|
|
42
|
+
export declare function ApyBreakdownDivider(): React.ReactElement;
|
|
@@ -1,15 +1,17 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ApyBreakdown } from '@gearbox-protocol/sdk/model';
|
|
2
2
|
import { default as React } from 'react';
|
|
3
3
|
import { PoolApyBreakdownCardTest } from './constants';
|
|
4
4
|
export { PoolApyBreakdownCardTest };
|
|
5
5
|
export interface PoolApyBreakdownCardProps {
|
|
6
|
-
/**
|
|
7
|
-
readonly data?:
|
|
8
|
-
readonly organicApy?: Bps;
|
|
9
|
-
readonly incentiveApy?: Bps;
|
|
10
|
-
};
|
|
6
|
+
/** SDK supply APY; missing data renders dashes, a present one with no incentives renders Incentive APY as 0%. */
|
|
7
|
+
readonly data?: ApyBreakdown;
|
|
11
8
|
/** When `"7d"`, labels carry the averaging-window suffix. */
|
|
12
9
|
readonly period?: "7d";
|
|
13
10
|
}
|
|
14
|
-
/**
|
|
11
|
+
/**
|
|
12
|
+
* How a pool's net APY is arrived at: base yield plus incentives.
|
|
13
|
+
*
|
|
14
|
+
* Base and Incentive add up to the chip. Token rewards and points programs
|
|
15
|
+
* sit under a divider as a breakdown of the incentive, not as extra addends.
|
|
16
|
+
*/
|
|
15
17
|
export declare function PoolApyBreakdownCard({ data, period, }: PoolApyBreakdownCardProps): React.ReactElement;
|
|
@@ -1,5 +1,23 @@
|
|
|
1
1
|
import { ApyBreakdown, Bps, Leverage } from '@gearbox-protocol/sdk/model';
|
|
2
|
+
import { SimpleTooltipPlacement } from '../tooltip';
|
|
2
3
|
import type * as React from "react";
|
|
4
|
+
export interface ApyBreakdownTooltipProps {
|
|
5
|
+
/** Trigger — what the user hovers. */
|
|
6
|
+
readonly title: React.ReactNode;
|
|
7
|
+
/** Breakdown card (or any rich body) shown in the panel. */
|
|
8
|
+
readonly children: React.ReactNode;
|
|
9
|
+
/** Placement relative to the trigger. @default "left" */
|
|
10
|
+
readonly placement?: SimpleTooltipPlacement;
|
|
11
|
+
/** Controlled open state. Specs pass it because jsdom has no hover. */
|
|
12
|
+
readonly open?: boolean;
|
|
13
|
+
readonly className?: string;
|
|
14
|
+
readonly triggerClassName?: string;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* Chrome around an APY breakdown in a tooltip: 400px, no arrow, modal
|
|
18
|
+
* surface. Callers pass only the trigger and the card — width lives here.
|
|
19
|
+
*/
|
|
20
|
+
export declare function ApyBreakdownTooltip({ title, children, placement, open, className, triggerClassName, }: ApyBreakdownTooltipProps): React.ReactElement;
|
|
3
21
|
export interface YieldBreakdownTooltipProps {
|
|
4
22
|
/**
|
|
5
23
|
* Net yield (`ApyBreakdown`). For a strategy this is the net at
|
|
@@ -24,9 +42,11 @@ export interface YieldBreakdownTooltipProps {
|
|
|
24
42
|
period?: "7d";
|
|
25
43
|
children?: React.ReactNode;
|
|
26
44
|
className?: string;
|
|
45
|
+
/** Controlled open state. Specs pass it because jsdom has no hover. */
|
|
46
|
+
open?: boolean;
|
|
27
47
|
}
|
|
28
48
|
/**
|
|
29
|
-
* Earn APY tooltip —
|
|
30
|
-
* (
|
|
49
|
+
* Earn APY tooltip — a pool hands {@link PoolApyBreakdownCard}; a strategy
|
|
50
|
+
* (positions list) still itemises unlevered collateral, borrow and rewards.
|
|
31
51
|
*/
|
|
32
|
-
export declare function YieldBreakdownTooltip({ supplyApy, maxLeverage, collateralApy, borrowApy, quotaRate, period, children, className, }: YieldBreakdownTooltipProps): React.JSX.Element;
|
|
52
|
+
export declare function YieldBreakdownTooltip({ supplyApy, maxLeverage, collateralApy, borrowApy, quotaRate, period, children, className, open, }: YieldBreakdownTooltipProps): React.JSX.Element;
|