@dodoex/widgets 2.6.12-beta.9 → 2.6.13

package/dist/types/components/chart/depth-chart/helper.d.ts

@@ -0,0 +1,125 @@
+import BigNumber from 'bignumber.js';
+import Konva from 'konva';
+import { PMMModel } from '@dodoex/api';
+export declare function colorRgb(str: string): string;
+export type EvaluatedPoint = {
+    side: 'bid' | 'ask' | 'no-one';
+    vert: BigNumber;
+    base: BigNumber;
+    quote: BigNumber;
+};
+export type BaseMinAndZoomMultiples = {
+    baseMin: BigNumber;
+    zoomMultiples: number;
+    /** Price impact point active display hover */
+    targetMarginPriceX: number;
+};
+export declare function evalPoint({ val, model, }: {
+    val: BigNumber;
+    model: PMMModel;
+    midPrice: BigNumber;
+}): EvaluatedPoint;
+/**
+ * Returns two vertical coordinates, buyBaseVert on the left and sellBaseVert on the right.
+ * @param param0
+ */
+export declare function computeBaseVert({ midPrice, q, q0, pmmModel, }: {
+    midPrice: BigNumber;
+    q: number;
+    q0: number;
+    pmmModel: PMMModel;
+}): {
+    buyBaseVert: BigNumber;
+    sellBaseVert: BigNumber;
+};
+/**
+ * // 1000/800 The price represented by one pixel
+  // Maximum value on the right side of the middle price = middle price * 10 = middle price * 10^1
+  // Calculate the x-axis coordinate (price): middle price*10^(xPortion*x)+middle price; x is the number of equal parts that divide the right half into 50 parts
+ * @param chartWidth icon width
+ * @param zoomMultiples magnification factors
+ * @returns
+ */
+export declare function computeXPortion(chartWidth: number, zoomMultiples?: number): BigNumber;
+export declare function updateTooltip({ tooltip, x, chartWidth, chartHeight, buyBaseVert, sellBaseVert, pmmModel, midPrice, baseTokenSymbol, quoteTokenSymbol, t, baseMinAndZoomMultiples, isHover, color, leftColor, rightColor, }: {
+    x: number;
+    tooltip: Konva.Layer;
+    chartWidth: number;
+    chartHeight: number;
+    buyBaseVert: BigNumber;
+    sellBaseVert: BigNumber;
+    pmmModel: PMMModel;
+    midPrice: BigNumber;
+    baseTokenSymbol: string;
+    quoteTokenSymbol: string;
+    t: any;
+    baseMinAndZoomMultiples: BaseMinAndZoomMultiples;
+    isHover?: boolean;
+    color?: string;
+    leftColor?: string;
+    rightColor?: string;
+}): void;
+/**
+ * Calculate the minimum value on the left by pulling distance or button click
+ */
+export declare function computeBaseMinByDistance({ dragDistance, prevBaseMin, chartWidth, zoomMultiples, }: {
+    dragDistance: number;
+    prevBaseMin: BigNumber;
+    chartWidth: number;
+    zoomMultiples: number;
+}): BigNumber;
+export declare const baseZoomMultiples = 1;
+export declare function computeZoomMultiplesWhenZoom({ prevZoomMultiples, zoomIn, }: {
+    prevZoomMultiples: number;
+    zoomIn: boolean;
+}): number;
+/**
+ * Given a price target corresponding to the abscissa, calculate the abscissa of the point
+ * The buying impact point is at the left 1/4 position
+ * The selling impact point is 3/4 on the right
+ *
+ * Returns a coordinate point, baseMin and zoomMultiples
+ *
+ * Take the initial state as the starting point, that is, midPrice * 10 ^ -1 as the starting point of the horizontal axis, and it is a left-right symmetrical state, that is, the logarithm of the horizontal axis is from -1 -> 0 -> 1
+ *
+ * type === 'sell'
+ * targetPrice = midPrice * 10 ^ n
+ * n = Math.log10(targetPrice / midPrice)
+ * n = maxN * (3 / 4)
+ *
+ * If the new price is within the existing range, the zoom factor will not be adjusted (the price impact will not change the shape of the graph after graph scaling or translation)
+ * If it is not within the current interval, check whether it is midPrice * 10 ^-1 and midPrice * 10^1. If you still do not adjust the zoom factor, hit the specified point directly, otherwise you need to adjust the zoom factor (avoid inputting extremely small values) The value cannot be scaled to the specified range, resulting in stuck)
+ */
+export declare function computeTargetXByTargetPrice({ type, targetPrice, midPrice, width, }: {
+    type: 'buy' | 'sell';
+    targetPrice: BigNumber;
+    midPrice: BigNumber;
+    width: number;
+}): {
+    zoomMultiples: BigNumber;
+    targetX: number;
+};
+/**
+ * If the new price is within the existing range, the zoom factor will not be adjusted (the price impact will not change the shape of the graph after graph scaling or translation)
+ * If it is not within the current interval, check whether it is midPrice * 10 ^-1 and midPrice * 10^1. If it is within the range, adjust the zoom factor to 1, and then impact to the specified point, otherwise you need to adjust the zoom factor ( Avoid entering extremely small values ​​that may result in inability to scale to the specified range and cause stucks)
+ *
+ * Returns an abscissa and a flag indicating whether to skip
+ */
+export declare function beforePriceImpactEffect({ currentBaseMinAndZoomMultiples, targetPrice, midPrice, width, }: {
+    currentBaseMinAndZoomMultiples: BaseMinAndZoomMultiples;
+    targetPrice: BigNumber;
+    midPrice: BigNumber;
+    width: number;
+}): {
+    isSkip: boolean;
+    targetX: number;
+    baseMin: BigNumber;
+    zoomMultiples: number;
+};
+/**
+ * Recalculate baseMin after the zoom factor changes
+ */
+export declare function computeBaseAfterZoom({ midPrice, zoomMultiples, }: {
+    midPrice: BigNumber;
+    zoomMultiples: number;
+}): BigNumber;

package/dist/types/components/chart/depth-chart/index.d.ts

@@ -0,0 +1,17 @@
+import BigNumber from 'bignumber.js';
+import { ColorMap } from './DepthChartKonva';
+import { PMMModel, PmmModelParams } from '@dodoex/api';
+type Props = {
+    chartId: string;
+    width?: number;
+    baseTokenSymbol: string;
+    quoteTokenSymbol: string;
+    pmmModel?: PMMModel;
+    pmmParams?: PmmModelParams;
+    midPrice?: BigNumber;
+    height?: number;
+    notShowAmountInput?: boolean;
+    colorMap?: ColorMap;
+};
+declare const DepthChart: React.FC<Props>;
+export default DepthChart;

package/dist/types/components/chart/depth-chart/index.styled.d.ts

@@ -0,0 +1,28 @@
+export declare const Container: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AmountInputContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const InputSectionWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    borderColor?: string;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const PriceImpactWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const OptButtonGroup: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const OptButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;

package/dist/types/components/chart/depth-chart-v2/index.d.ts

@@ -0,0 +1,9 @@
+declare function DepthChartV2({ title, titleColor, description, descriptionColor, buttonColor, placeholder, }: {
+    title: string;
+    titleColor: string;
+    description: string;
+    descriptionColor: string;
+    buttonColor: string;
+    placeholder: React.ReactElement;
+}): JSX.Element;
+export default DepthChartV2;

package/dist/types/components/chart/depth-chart-v2/index.styled.d.ts

@@ -0,0 +1,14 @@
+export declare const Title: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Description: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const OptButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;

package/dist/types/components/chart/hooks/usePreventWheel.d.ts

@@ -0,0 +1,9 @@
+type Props = {
+    id: string;
+};
+/**
+ * 防止鼠标在图上滚动滚轮时页面上下滑动
+ * @param param0
+ */
+export declare const usePreventWheel: ({ id }: Props) => void;
+export {};

package/dist/types/components/chart/liquidity-chart/LiquidityChartKonva.d.ts

@@ -0,0 +1,27 @@
+import { PMMModel, PmmModelParams } from '@dodoex/api';
+import BigNumber from 'bignumber.js';
+export declare const bgColor = "rgba(38, 39, 41, 0.3)";
+export interface ColorMap {
+    grid?: string;
+    midPriceLine?: string;
+    leftBg?: (string | number)[];
+    leftLine?: string;
+    leftColor?: string;
+    rightBg?: (string | number)[];
+    rightLine?: string;
+    rightColor?: string;
+    tooltipBg?: string;
+    tooltipColor?: string;
+    textColor?: string;
+}
+export type Props = {
+    width: number;
+    height: number;
+    params: PmmModelParams;
+    midPrice: BigNumber;
+    pmmModel: PMMModel;
+    baseTokenSymbol: string;
+    quoteTokenSymbol: string;
+    colorMap?: ColorMap;
+};
+export declare function LiquidityChartKonva({ width, height, params, baseTokenSymbol, quoteTokenSymbol, colorMap, }: Props): JSX.Element;

package/dist/types/components/chart/liquidity-chart/index.d.ts

@@ -0,0 +1,16 @@
+import { PMMModel, PmmModelParams } from '@dodoex/api';
+import BigNumber from 'bignumber.js';
+import { ColorMap } from './LiquidityChartKonva';
+type Props = {
+    width?: number;
+    height?: number;
+    baseTokenSymbol: string;
+    quoteTokenSymbol: string;
+    pmmModel?: PMMModel;
+    pmmParams?: PmmModelParams;
+    midPrice?: BigNumber;
+    notShowTipText?: boolean;
+    colorMap?: ColorMap;
+};
+declare const LiquidityChart: React.FC<Props>;
+export default LiquidityChart;

package/dist/types/components/chart/liquidity-chart/index.styled.d.ts

@@ -0,0 +1,8 @@
+export declare const Container: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TipWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types/components/chart/liquidity-chart/useGridLine.d.ts

@@ -0,0 +1,7 @@
+export declare function useGridLine({ gridAreaHeight, gridAreaWidth, horizontalLineCount, verticalLineCount, color, }: {
+    gridAreaHeight: number;
+    gridAreaWidth: number;
+    horizontalLineCount: number;
+    verticalLineCount: number;
+    color?: string;
+}): JSX.Element;

package/dist/types/components/chart/liquidity-chart/useHorizontalLabel.d.ts

@@ -0,0 +1,9 @@
+import BigNumber from 'bignumber.js';
+export declare function useHorizontalLabel({ minXLN10, maxXLN10, labelCount, gridAreaHeight, gridAreaWidth, color, }: {
+    minXLN10: BigNumber;
+    maxXLN10: BigNumber;
+    labelCount: number;
+    gridAreaHeight: number;
+    gridAreaWidth: number;
+    color?: string;
+}): JSX.Element;

package/dist/types/components/chart/liquidity-chart/useLiquidityLine.d.ts

@@ -0,0 +1,17 @@
+import BigNumber from 'bignumber.js';
+import { ColorMap } from './LiquidityChartKonva';
+import { StatAreaPoint } from './usePoints';
+export declare function useLiquidityLine({ leftStatAreaPoints, rightStatAreaPoints, minXLN10, maxXLN10, maxLeftHeight, maxRightHeight, gridAreaWidth, gridAreaHeight, colorMap, }: {
+    leftStatAreaPoints: Array<StatAreaPoint>;
+    rightStatAreaPoints: Array<StatAreaPoint>;
+    minXLN10: BigNumber;
+    maxXLN10: BigNumber;
+    maxLeftHeight: BigNumber;
+    maxRightHeight: BigNumber;
+    gridAreaWidth: number;
+    gridAreaHeight: number;
+    colorMap: ColorMap;
+}): {
+    leftLine: JSX.Element;
+    rightLine: JSX.Element;
+};

package/dist/types/components/chart/liquidity-chart/useMiddleLine.d.ts

@@ -0,0 +1,5 @@
+export declare function useMiddleLine({ gridAreaHeight, gridAreaWidth, color, }: {
+    gridAreaHeight: number;
+    gridAreaWidth: number;
+    color?: string;
+}): JSX.Element;

package/dist/types/components/chart/liquidity-chart/usePoints.d.ts

@@ -0,0 +1,39 @@
+import { PmmModelParams } from '@dodoex/api';
+import BigNumber from 'bignumber.js';
+/**
+ * data point
+ */
+export type StatPoint = {
+    giveAmount: BigNumber;
+    getAmount: BigNumber;
+    price: BigNumber;
+};
+/**
+ * Drawing method:
+  Substitute the minimum value to get the height of the center point, which is the bottom edge of the area chart. Substitute the maximum value to get the vertex of the area chart. The length of the bottom edge from the vertex is the price range.
+
+  Divide the total area into one hundred equal parts. Calculate each part on the basis of the previous part. Substitute the new area into the formula to get a new price. The difference from the previous price is the width of the rectangle. The area is divided by The width is the height of the rectangle, which is the ordinate.
+
+  First, calculate a series of points as a point set based on the rectangular accumulation method.
+
+  When the mouse hovers, the abscissa is the price. Find the closest price in the point set. Use this price as the end point and the center line as the starting point to get a subset of the point set. You can draw a line by combining the center line and the abscissa. The area of ​​the trapezoid can be drawn.
+
+  Update: Taking Δl as the ordinate, Δl = (the difference between the quantity passed in from the previous point and the next point) * (the difference between the quantity obtained from the previous point and the next point)
+ */
+export type StatAreaPoint = {
+    area: BigNumber;
+    price: BigNumber;
+    middlePrice: BigNumber;
+    rectangleHeight: BigNumber;
+};
+export declare function usePoints({ params }: {
+    params: PmmModelParams;
+}): {
+    leftStatAreaPoints: StatAreaPoint[];
+    rightStatAreaPoints: StatAreaPoint[];
+    maxLeftHeight: BigNumber;
+    maxRightHeight: BigNumber;
+    minXLN10: BigNumber;
+    maxXLN10: BigNumber;
+    middlePriceLN10: BigNumber;
+};

package/dist/types/constants/api.d.ts

@@ -0,0 +1,19 @@
+import { ContractRequests, TokenApi, ChainId } from '@dodoex/api';
+export declare enum APIServiceKey {
+    routePrice = "routePrice",
+    fiatPrice = "fiatPrice",
+    bridgeRoutePrice = "bridgeRoutePrice",
+    bridgeEncode = "bridgeEncode",
+    bridgeCreateRoute = "bridgeCreateRoute"
+}
+export type APIServices = {
+    [key in APIServiceKey]: string;
+};
+export declare const AppUrl = "https://app.dodoex.io";
+export declare const getCGTokenListAPI: (chainId: ChainId) => any;
+export declare const RoutePriceAPI = "https://api.dodoex.io/route-service/v2/widget/getdodoroute";
+export declare const FiatPriceAPI = "https://api.dodoex.io/frontend-price-api/current/batch";
+export declare function getAPIService(key: APIServiceKey, serviceProps?: Partial<APIServices>): string;
+export declare const contractRequests: ContractRequests;
+export declare const tokenContractRequests: ContractRequests;
+export declare const tokenApi: TokenApi;

package/dist/types/constants/chains.d.ts

@@ -0,0 +1,20 @@
+import { ChainId } from '@dodoex/api';
+export { etherTokenAddress, basicTokenMap } from '@dodoex/api';
+export declare const rpcServerMap: {
+    [key in ChainId]: Array<string>;
+};
+export declare const getRpcSingleUrlMap: (newRpcServerMap?: {
+    [chainId: number]: string[];
+}) => { [key in ChainId]: string; };
+export declare const scanUrlDomainMap: {
+    [key in ChainId]: string;
+};
+export declare const ThegraphKeyMap: {
+    [key in ChainId]: string;
+};
+export declare const blockTimeMap: {
+    [key in ChainId]: number;
+};
+export declare const dexKeysMap: {
+    [key in ChainId]: string[];
+};

package/dist/types/constants/locales.d.ts

@@ -0,0 +1,3 @@
+export declare const supportedLang: string[];
+export type SupportedLang = typeof supportedLang[number];
+export declare const defaultLang: SupportedLang;

package/dist/types/constants/wallet.d.ts

@@ -0,0 +1,22 @@
+export declare enum WalletType {
+    INTEGRATOR = "integrator",
+    METAMASK = "metamask",
+    WALLET_CONNECT = "walletConnect"
+}
+export declare const WalletMap: {
+    metamask: {
+        name: string;
+        type: WalletType;
+        icon: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+            title?: string;
+        }>;
+        link: string;
+    };
+    walletConnect: {
+        name: string;
+        type: WalletType;
+        icon: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+            title?: string;
+        }>;
+    };
+};

package/dist/types/hooks/Bridge/useSendRoute.d.ts

@@ -0,0 +1,15 @@
+import BigNumber from 'bignumber.js';
+import { BridgeRouteI } from './useFetchRoutePriceBridge';
+import { BridgeTXRequest } from '../../components/Bridge/BridgeSummaryDialog';
+export declare function useSendRoute(): {
+    apikey: string | undefined;
+    sendRouteLoading: boolean;
+    sendRouteError: string;
+    setSendRouteError: import("react").Dispatch<import("react").SetStateAction<string>>;
+    bridgeOrderTxRequest: BridgeTXRequest | undefined;
+    handleClickSend: ({ selectedRoute, fromEtherTokenBalance, goNext, }: {
+        selectedRoute?: BridgeRouteI;
+        fromEtherTokenBalance: BigNumber | null;
+        goNext: () => void;
+    }) => Promise<void>;
+};

package/dist/types/hooks/ConnectWallet/useCurrentChainId.d.ts

@@ -0,0 +1 @@
+export declare function useCurrentChainId(): import("@dodoex/api").ChainId;

package/dist/types/hooks/ConnectWallet/useWalletInfo.d.ts

@@ -0,0 +1,8 @@
+import { ChainId } from '@dodoex/api';
+export declare function useWalletInfo(): {
+    account: string | undefined;
+    chainId: ChainId;
+    connectedChainId: number | undefined;
+    defaultChainId: ChainId | undefined;
+    onlyChainId: ChainId | undefined;
+};

package/dist/types/hooks/ConnectWallet/web3.d.ts

@@ -0,0 +1,10 @@
+import { Web3ReactHooks } from '@web3-react/core';
+import { Connector, Provider as Eip1193Provider } from '@web3-react/types';
+import { JsonRpcProvider } from '@ethersproject/providers';
+import { ChainId } from '@dodoex/api';
+export type Web3Connection = [Connector, Web3ReactHooks];
+export declare function getConnectionFromProvider(onError: (error: Error) => void, provider?: JsonRpcProvider | Eip1193Provider): Web3Connection | undefined;
+export declare function getConnectionFromWalletConnect(useDefault: boolean, jsonRpcUrlMap: {
+    [chainId: number]: string[];
+}, defaultChainId: ChainId | undefined, onError: (error: Error) => void): Web3Connection;
+export declare function getConnectionFromMetaMask(onError: (error: Error) => void): Web3Connection;

package/dist/types/hooks/Submission/index.d.ts

@@ -0,0 +1,9 @@
+import { ExecutionCtx } from './types';
+export { default as useExecution } from './useExecution';
+export type { ExecutionProps } from './useExecution';
+export { default as useInflights } from './useInflights';
+export declare const ExecutionContext: import("react").Context<ExecutionCtx>;
+/**
+ * Get the submission context
+ */
+export declare function useSubmission(): ExecutionCtx;

package/dist/types/hooks/Submission/spec.d.ts

@@ -0,0 +1,56 @@
+/**
+ * Let's pretend that typescript has ADT
+ */
+import { BigNumber } from 'bignumber.js';
+import { BigNumber as EthersBigNumber } from '@ethersproject/bignumber';
+/**
+ * All supported opcodes, as tagged union discriminants
+ */
+export declare enum OpCode {
+    Approval = "APPROVAL",
+    TX = "TX",
+    TypedSign = "TypedSign"
+}
+export declare enum SwapType {
+    Normal = "Normal",
+    Privacy = "Privacy",
+    LimitOrder = "LimitOrder",
+    RFQ = "RFQ"
+}
+export type TokenData = {
+    address: string;
+};
+export type ApprovalStep = {
+    opcode: OpCode.Approval;
+    /**
+     * The address of the token
+     */
+    token: TokenData;
+    /**
+     * The approved contract address
+     */
+    contract: string;
+    /**
+     * The amount to set the allowance to, in Wei, in base-10. If omitted, a (very) big constants is used
+     * TODO(meow): bigint shows a 87% support rate. Can we use it here?
+     */
+    amt?: BigNumber;
+};
+export type TXStep = {
+    opcode: OpCode.TX;
+    value: number | string;
+    to: string;
+    data: string;
+    swapType?: SwapType;
+    gasLimit?: EthersBigNumber;
+    gasPrice?: number;
+    ddlSecRel?: number;
+};
+export type TypedSignStep = {
+    opcode: OpCode.TypedSign;
+    swapType?: SwapType;
+    signer?: string;
+    typedData: Record<string, unknown>;
+};
+export type Step = ApprovalStep | TXStep | TypedSignStep;
+export type Steps = Step[];

package/dist/types/hooks/Submission/types.d.ts

@@ -0,0 +1,85 @@
+import { Step as StepSpec } from './spec';
+import { ExecutionProps } from './useExecution';
+export declare enum State {
+    Running = 0,
+    Success = 1,
+    Failed = 2,
+    Warning = 3
+}
+export declare enum MetadataFlag {
+    swap = "swap",
+    crossChain = "crossChain",
+    addLiquidity = "addLiquidity",
+    removeLiquidity = "removeLiquidity",
+    createDPPPool = "createDPPPool",
+    createDSPPool = "createDSPPool",
+    createGSPPool = "createGSPPool",
+    createDVMPool = "createDVMPool",
+    stakeMining = "stakeMining",
+    unstakeMining = "unstakeMining",
+    claimMining = "claimMining",
+    submissionCreateMetaKey = "submissionCreateMetaKey",
+    approve = "approve",
+    reset = "reset"
+}
+export type Metadata = Record<string, any>;
+export type Request = {
+    brief: string;
+    spec: StepSpec;
+    subtitle?: string | React.ReactNode | null;
+    metadata?: Metadata;
+    tx: string;
+    nonce?: number;
+    doneTime?: number;
+};
+export type TextUpdater = (request: Request) => null | {
+    brief: string;
+    subtitle?: string;
+    metadata?: Metadata;
+};
+export type Requests = Map<string, [Request, State]>;
+export declare enum ExecutionResult {
+    Canceled = "canceled",
+    Failed = "failed",
+    Success = "success",
+    Submitted = "submitted"
+}
+export interface Showing {
+    brief: string;
+    subtitle?: string | React.ReactNode;
+    spec: StepSpec;
+}
+export type ExecutionCtx = {
+    /**
+     * Execute an on-chain operation
+     * @param breif: TX title. e.g.: "Swap"
+     * @param spec: TX specification.
+     * @param subtitle: Additional hint text. e.g.: "10 USDT to 10 USDC"
+     * @param early: When given, the returned promise resolves when user confirmed in their wallet.
+     * @param mixpanelProps: mixpanel properties
+     * @param submittedConfirmBack: submittedConfirmBack
+     * @param successBack: successBack
+     * @param metadata: metadata
+     */
+    execute: (brief: string, spec: StepSpec, params?: {
+        subtitle?: string | React.ReactNode | null;
+        early?: boolean;
+        submittedBack?: () => void;
+        mixpanelProps?: Record<string, any>;
+        submittedConfirmBack?: () => void;
+        successBack?: (tx: string, callback?: ExecutionProps['onTxSuccess']) => void;
+        metadata?: Metadata;
+    }) => Promise<ExecutionResult>;
+    /**
+     * order
+     */
+    requests?: Requests;
+    updateText: (upd: TextUpdater) => void;
+    setShowing?: React.Dispatch<React.SetStateAction<Showing | null>>;
+    waitingSubmit: boolean;
+    errorMessage: string | null;
+};
+export declare enum WatchResult {
+    Failed = 0,
+    Success = 1
+}

package/dist/types/hooks/Submission/useBalanceUpdateLoading.d.ts

@@ -0,0 +1,16 @@
+import BigNumber from 'bignumber.js';
+export type BalanceData = {
+    [address: string]: string;
+};
+/**
+ * Record the loading status of the balance waiting to be updated after the chain is successfully uploaded
+ * Insert token data into logBalance in metadata when uploading, within 5 minutes after successful uploading. If the newly passed in balance is consistent with the previously recorded balance, loading will be returned
+ * After the balance is updated, or after 5 minutes, loading will return false. And delete the recorded metadata information to avoid calculating this data next time
+ * The 5-minute time limit is to avoid operations on other terminals or other tabs, which will cause the balance comparison to be invalid and keep loading.
+ */
+export declare const useBalanceUpdateLoading: () => {
+    balanceData: BalanceData;
+    balanceDataDone: BalanceData;
+    isTokenLoading: (address: string, balance: BigNumber | number | string) => boolean;
+    isTokenLoadingDone: (address: string, balance: BigNumber | number | string) => boolean;
+};

package/dist/types/hooks/Submission/useExecution.d.ts

@@ -0,0 +1,25 @@
+import { State, Request, Showing, ExecutionCtx } from './types';
+export interface ExecutionProps {
+    onTxFail?: (error: Error, data: any) => void;
+    onTxSubmit?: (tx: string, data: any) => void;
+    onTxSuccess?: (tx: string, data: any) => void;
+    onTxReverted?: (tx: string, data: any) => void;
+    executionStatus?: {
+        showing?: Showing | null;
+        showingDone?: boolean;
+        transactionTx?: string;
+        errorMessage?: string;
+        setErrorMessage?: (msg?: string | null) => void;
+        closeShowing?: () => void;
+    };
+}
+export default function useExecution({ onTxFail, onTxSubmit, onTxSuccess, onTxReverted, }?: ExecutionProps): {
+    showing: Showing | null;
+    showingDone: boolean;
+    transactionTx: string;
+    errorMessage: string | null;
+    setErrorMessage: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+    closeShowing: () => void;
+    ctxVal: ExecutionCtx;
+    requests: Map<string, [Request, State]>;
+};