@orderly.network/trading 2.0.0-alpha.2

package/dist/index.css

@@ -0,0 +1,2 @@
+:root{--orderly-color-primary: 71 116 246;--orderly-color-primary-light: 96 140 255;--orderly-color-primary-darken: 51 95 252;--orderly-color-primary-contrast: 255 255 255;--orderly-color-link: 96 140 255;--orderly-color-secondary: 51 57 72;--orderly-color-tertiary: 97 100 104;--orderly-color-quaternary: 218 218 218;--orderly-color-danger: 233 62 113;--orderly-color-danger-light: 255 68 124;--orderly-color-danger-darken: 172 45 88;--orderly-color-danger-contrast: 255 255 255;--orderly-color-success: 3 152 134;--orderly-color-success-light: 0 180 158;--orderly-color-success-darken: 0 119 105;--orderly-color-success-contrast: 255 255 255;--orderly-color-warning: 229 199 0;--orderly-color-warning-light: 229 199 0;--orderly-color-warning-darken: 90 72 12;--orderly-color-warning-contrast: 255 255 255;--orderly-color-fill: 40 46 58;--orderly-color-fill-active: 40 46 58;--orderly-color-base-100: 83 94 123;--orderly-color-base-200: 74 83 105;--orderly-color-base-300: 57 65 85;--orderly-color-base-400: 51 57 72;--orderly-color-base-500: 40 46 58;--orderly-color-base-600: 32 37 47;--orderly-color-base-700: 27 32 40;--orderly-color-base-800: 24 28 35;--orderly-color-base-900: 19 21 25;--orderly-color-base-foreground: 255 255 255;--orderly-color-trading-loss: 255 68 124;--orderly-color-trading-loss-contrast: 255 68 124;--orderly-color-trading-profit: 0 180 158;--orderly-color-trading-profit-contrast: 0 180 158;--orderly-rounded: 6px;--orderly-rounded-sm: 4px;--orderly-rounded-lg: 8px;--orderly-rounded-xl: 16px;--orderly-rounded-full: 9999px;--orderly-button-shadow: 0 1px 0 0 rgba(255, 255, 255, .1) inset, 0 -4px 0 0 rgba(0, 0, 0, .15) inset;--orderly-font-size-4xs: 11px;--orderly-font-size-3xs: 12px;--orderly-font-size-2xs: 13px;--orderly-font-size-xs: 14px;--orderly-font-size-sm: 15px;--orderly-font-size-base: 16px;--orderly-font-size-lg: 18px;--orderly-font-size-xl: 20px;--orderly-font-size-2xl: 24px;--orderly-font-size-3xl: 30px;--orderly-font-size-4xl: 36px;--orderly-color-divider: 42 46 52;--orderly-font-family: "DIN2014-Demi", "PingFangSC-Medium", "Noto Sans", sans-serif;--orderly-referral-bg-gradient-from: 39 43 147;--orderly-referral-bg-gradient-to: 41 137 226;--orderly-referral-text-gradient-from: 38 254 254;--orderly-referral-text-gradient-to: 89 176 254}
+/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/style/style.css"],"sourcesContent":[":root {\n  /** Primary */\n  --orderly-color-primary: 71 116 246;\n  --orderly-color-primary-light: 96 140 255;\n  --orderly-color-primary-darken: 51 95 252;\n  --orderly-color-primary-contrast: 255 255 255;\n\n  --orderly-color-link: 96 140 255;\n\n  --orderly-color-secondary: 51 57 72;\n  --orderly-color-tertiary: 97 100 104;\n  --orderly-color-quaternary: 218 218 218;\n\n  /** Danger / Sell / Short */\n  --orderly-color-danger: 233 62 113;\n  --orderly-color-danger-light: 255 68 124;\n  --orderly-color-danger-darken: 172 45 88;\n  --orderly-color-danger-contrast: 255 255 255;\n\n  /** Success / Buy / Long */\n  --orderly-color-success: 3 152 134;\n  --orderly-color-success-light: 0 180 158;\n  --orderly-color-success-darken: 0 119 105;\n  --orderly-color-success-contrast: 255 255 255;\n\n  /** Warning */\n  --orderly-color-warning: 229 199 0;\n  --orderly-color-warning-light: 229 199 0;\n  --orderly-color-warning-darken: 90 72 12;\n  --orderly-color-warning-contrast: 255 255 255;\n\n  --orderly-color-fill: 40 46 58;\n  --orderly-color-fill-active: 40 46 58;\n\n  /** Background */\n  --orderly-color-base-100: 83 94 123;\n  --orderly-color-base-200: 74 83 105;\n  --orderly-color-base-300: 57 65 85;\n  --orderly-color-base-400: 51 57 72;\n  --orderly-color-base-500: 40 46 58;\n  --orderly-color-base-600: 32 37 47;\n  --orderly-color-base-700: 27 32 40;\n  --orderly-color-base-800: 24 28 35;\n  --orderly-color-base-900: 19 21 25;\n\n  --orderly-color-base-foreground: 255 255 255;\n\n  --orderly-color-trading-loss: 255 68 124;\n  --orderly-color-trading-loss-contrast: 255 68 124;\n  --orderly-color-trading-profit: 0 180 158;\n  --orderly-color-trading-profit-contrast: 0 180 158;\n\n  /* rounded */\n  --orderly-rounded: 6px;\n  --orderly-rounded-sm: 4px;\n  --orderly-rounded-lg: 8px;\n  --orderly-rounded-xl: 16px;\n  --orderly-rounded-full: 9999px;\n\n  --orderly-button-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1) inset,\n    0 -4px 0 0 rgba(0, 0, 0, 0.15) inset;\n\n  --orderly-font-size-4xs: 11px;\n  --orderly-font-size-3xs: 12px;\n  --orderly-font-size-2xs: 13px;\n  --orderly-font-size-xs: 14px;\n  --orderly-font-size-sm: 15px;\n  --orderly-font-size-base: 16px;\n  --orderly-font-size-lg: 18px;\n  --orderly-font-size-xl: 20px;\n  --orderly-font-size-2xl: 24px;\n  --orderly-font-size-3xl: 30px;\n  --orderly-font-size-4xl: 36px;\n\n  --orderly-color-divider: 42 46 52;\n\n  --orderly-font-family: \"DIN2014-Demi\", \"PingFangSC-Medium\", \"Noto Sans\",\n    sans-serif;\n\n  --orderly-referral-bg-gradient-from: 39 43 147;\n  --orderly-referral-bg-gradient-to: 41 137 226;\n  --orderly-referral-text-gradient-from: 38 254 254;\n  --orderly-referral-text-gradient-to: 89 176 254;\n}\n"],"mappings":"AAAA,MAEE,yBAAyB,GAAG,IAAI,IAChC,+BAA+B,GAAG,IAAI,IACtC,gCAAgC,GAAG,GAAG,IACtC,kCAAkC,IAAI,IAAI,IAE1C,sBAAsB,GAAG,IAAI,IAE7B,2BAA2B,GAAG,GAAG,GACjC,0BAA0B,GAAG,IAAI,IACjC,4BAA4B,IAAI,IAAI,IAGpC,wBAAwB,IAAI,GAAG,IAC/B,8BAA8B,IAAI,GAAG,IACrC,+BAA+B,IAAI,GAAG,GACtC,iCAAiC,IAAI,IAAI,IAGzC,yBAAyB,EAAE,IAAI,IAC/B,+BAA+B,EAAE,IAAI,IACrC,gCAAgC,EAAE,IAAI,IACtC,kCAAkC,IAAI,IAAI,IAG1C,yBAAyB,IAAI,IAAI,EACjC,+BAA+B,IAAI,IAAI,EACvC,gCAAgC,GAAG,GAAG,GACtC,kCAAkC,IAAI,IAAI,IAE1C,sBAAsB,GAAG,GAAG,GAC5B,6BAA6B,GAAG,GAAG,GAGnC,0BAA0B,GAAG,GAAG,IAChC,0BAA0B,GAAG,GAAG,IAChC,0BAA0B,GAAG,GAAG,GAChC,0BAA0B,GAAG,GAAG,GAChC,0BAA0B,GAAG,GAAG,GAChC,0BAA0B,GAAG,GAAG,GAChC,0BAA0B,GAAG,GAAG,GAChC,0BAA0B,GAAG,GAAG,GAChC,0BAA0B,GAAG,GAAG,GAEhC,iCAAiC,IAAI,IAAI,IAEzC,8BAA8B,IAAI,GAAG,IACrC,uCAAuC,IAAI,GAAG,IAC9C,gCAAgC,EAAE,IAAI,IACtC,yCAAyC,EAAE,IAAI,IAG/C,mBAAmB,IACnB,sBAAsB,IACtB,sBAAsB,IACtB,sBAAsB,KACtB,wBAAwB,OAExB,yBAAyB,EAAE,IAAI,EAAE,EAAE,KAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAK,KAAK,EAC/D,EAAE,KAAK,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAM,MAEjC,yBAAyB,KACzB,yBAAyB,KACzB,yBAAyB,KACzB,wBAAwB,KACxB,wBAAwB,KACxB,0BAA0B,KAC1B,wBAAwB,KACxB,wBAAwB,KACxB,yBAAyB,KACzB,yBAAyB,KACzB,yBAAyB,KAEzB,yBAAyB,GAAG,GAAG,GAE/B,uBAAuB,cAAc,EAAE,mBAAmB,EAAE,WAAW,EACrE,WAEF,qCAAqC,GAAG,GAAG,IAC3C,mCAAmC,GAAG,IAAI,IAC1C,uCAAuC,GAAG,IAAI,IAC9C,qCAAqC,GAAG,IAAI,GAC9C","names":[]}

package/dist/index.d.mts

@@ -0,0 +1,303 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _orderly_network_types from '@orderly.network/types';
+import { API, NetworkId, AccountStatusEnum } from '@orderly.network/types';
+import { PositionsProps } from '@orderly.network/ui-positions';
+import * as react from 'react';
+import { ReactNode, FC, PropsWithChildren } from 'react';
+import * as _orderly_network_hooks from '@orderly.network/hooks';
+
+declare enum DataListTabType {
+    positions = "Positions",
+    pending = "Pending",
+    tp_sl = "TP/SL",
+    filled = "Filled",
+    orderHistory = "Order history"
+}
+declare const useDataListScript: (props: {
+    current?: DataListTabType;
+    config: PositionsProps & {
+        symbol?: string;
+    };
+}) => {
+    current: DataListTabType | undefined;
+    config: PositionsProps & {
+        symbol?: string | undefined;
+    };
+    unPnlPriceBasis: any;
+    setUnPnlPriceBasic: (value: string) => void;
+    pnlNotionalDecimalPrecision: any;
+    setPnlNotionalDecimalPrecision: (value: number) => void;
+    showAllSymbol: any;
+    setShowAllSymbol: (value: boolean) => void;
+};
+type DataListState = ReturnType<typeof useDataListScript>;
+
+type layoutInfo = {
+    width?: number;
+    height?: number;
+    fontSize?: number;
+    color?: string;
+    textAlign?: CanvasTextAlign;
+    textBaseline?: CanvasTextBaseline;
+    position: Partial<{
+        left: number;
+        right: number;
+        top: number;
+        bottom: number;
+    }>;
+};
+type PosterLayoutConfig = {
+    message?: layoutInfo;
+    domain?: layoutInfo;
+    position?: layoutInfo;
+    unrealizedPnl?: layoutInfo & {
+        secondaryColor: string;
+        secondaryFontSize: number;
+    };
+    informations?: layoutInfo & {
+        labelColor?: string;
+    };
+    updateTime?: layoutInfo;
+};
+type ShareOptions = {
+    pnl: {
+        /**
+         * defualt is Manrope
+         */
+        fontFamily?: string;
+        /**
+         * can not empty
+         */
+        backgroundImages: string[];
+        /**
+         * posterLayoutConfig
+         */
+        layout?: PosterLayoutConfig;
+        /**
+         * norma text color, default is  "rgba(255, 255, 255, 0.98)"
+         */
+        color?: string;
+        /**
+         * profit text color, default is "rgb(0,181,159)"
+         */
+        profitColor?: string;
+        /**
+         * loss text color, default is  "rgb(255,103,194)"
+         */
+        lossColor?: string;
+        /**
+         * brand color, default is "rgb(0,181,159)"
+         */
+        brandColor?: string;
+    };
+};
+declare enum TradingFeatures {
+    Sider = "sider",
+    TopNavBar = "topNavBar",
+    Footer = "footer",
+    Header = "header",
+    Kline = "kline",
+    OrderBook = "orderBook",
+    TradeHistory = "tradeHistory",
+    Positions = "positions",
+    Orders = "orders",
+    AssetAndMarginInfo = "asset_margin_info"
+}
+type BasicSymbolInfo = {
+    base_dp: number;
+    quote_dp: number;
+    base_tick: number;
+    base: string;
+    quote: string;
+};
+interface TradingPageState extends TradingPageV2Props {
+    symbolInfo: {
+        base_dp: number;
+        quote_dp: number;
+        base_tick: number;
+        base: string;
+        quote: string;
+        symbol: string;
+    };
+}
+interface TradingViewConfigInterface {
+    scriptSRC?: string;
+    library_path: string;
+    overrides?: Record<string, string>;
+    studiesOverrides?: Record<string, string>;
+    customCssUrl?: string;
+    colorConfig?: ColorConfigInterface;
+}
+interface ColorConfigInterface {
+    chartBG?: string;
+    upColor?: string;
+    downColor?: string;
+    pnlUpColor?: string;
+    pnlDownColor?: string;
+    pnlZoreColor?: string;
+    textColor?: string;
+    qtyTextColor?: string;
+    font?: string;
+    closeIcon?: string;
+}
+type ReferralProps = {
+    saveRefCode?: boolean;
+    onClickReferral?: () => void;
+    onBoundRefCode?: (success: boolean, error: any) => void;
+    refLink?: string;
+    slogan?: string;
+};
+type TradingRewardProps = {
+    onClickTradingReward?: () => void;
+};
+type BaseTradingPageProps = {
+    symbol: string;
+    tradingViewConfig: TradingViewConfigInterface;
+    onSymbolChange?: (symbol: API.Symbol) => void;
+    disableFeatures?: TradingFeatures[];
+    overrideFeatures?: Record<TradingFeatures, ReactNode>;
+};
+type TradingPageProps = BaseTradingPageProps & {
+    shareOptions: ShareOptions;
+    referral: ReferralProps;
+    tradingReward: TradingRewardProps;
+};
+type TradingPageV2Props = BaseTradingPageProps & {
+    dataList: {
+        current?: DataListTabType;
+        config: Partial<Omit<PositionsProps, "pnlNotionalDecimalPrecision">>;
+    };
+};
+
+declare const TradingPage: (props: TradingPageProps) => react_jsx_runtime.JSX.Element;
+
+declare const DataList: FC<DataListState>;
+
+declare const DataListWidget: (props: {
+    current?: DataListTabType;
+    config: Partial<Omit<PositionsProps, "pnlNotionalDecimalPrecision">>;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useLastTradesScript: (symbol: string) => {
+    base: any;
+    quote: any;
+    data: _orderly_network_types.API.Trade[];
+    isLoading: boolean;
+    baseDp: any;
+    quoteDp: any;
+};
+type LastTradesState = ReturnType<typeof useLastTradesScript>;
+
+declare const LastTrades: FC<LastTradesState & {
+    className?: string;
+    style?: React.CSSProperties;
+}>;
+
+declare const LastTradesWidget: (props: {
+    symbol: string;
+    className?: string;
+    style?: React.CSSProperties;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useAssetViewScript: () => {
+    onDeposit: () => Promise<unknown>;
+    onWithdraw: () => Promise<unknown>;
+    onSettle: () => Promise<any>;
+    visible: any;
+    toggleVisible: () => void;
+    networkId: NetworkId;
+    isFirstTimeDeposit: boolean;
+    totalValue: number;
+    status: AccountStatusEnum;
+    freeCollateral: number;
+    marginRatioVal: number;
+    renderMMR: string;
+    isConnected: boolean;
+};
+type AssetViewState = ReturnType<typeof useAssetViewScript>;
+
+declare const AssetView: FC<AssetViewState>;
+
+declare const AssetViewWidget: () => react_jsx_runtime.JSX.Element;
+
+declare const useOrderBookScript: (props: {
+    symbol: string;
+    height?: number;
+}) => {
+    level: number;
+    asks: _orderly_network_hooks.OrderBookItem[] | undefined;
+    bids: _orderly_network_hooks.OrderBookItem[] | undefined;
+    markPrice: number | undefined;
+    lastPrice: number[] | undefined;
+    depths: string[];
+    selDepth: string | undefined;
+    base: string;
+    quote: string;
+    isLoading: boolean | undefined;
+    onItemClick: ((item: _orderly_network_hooks.OrderBookItem) => void) | undefined;
+    cellHeight: number;
+    onDepthChange: ((depth: number) => void) | undefined;
+    pendingOrders: number[];
+    symbolInfo: BasicSymbolInfo;
+    isMWeb: boolean;
+};
+type OrderBookState = ReturnType<typeof useOrderBookScript>;
+
+declare const OrderBook: FC<OrderBookState & {
+    className?: string;
+}>;
+
+declare const OrderBookWidget: (props: {
+    className?: string;
+    symbol: string;
+    height?: number;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useRiskRateScript: () => {
+    riskRate: string;
+    riskRateColor: {
+        isHigh: boolean;
+        isMedium: boolean;
+        isLow: boolean;
+        isDefault: boolean;
+    };
+    isConnected: boolean;
+    currentLeverage: number;
+    maxLeverage: any;
+};
+type RiskRateState = ReturnType<typeof useRiskRateScript>;
+
+declare const RiskRate: FC<RiskRateState>;
+
+declare const RiskRateWidget: () => react_jsx_runtime.JSX.Element;
+
+declare const useOrderBookAndTradesScript: (symbol: string) => {
+    symbol: string;
+    containerSize: {
+        width: number;
+        height: number;
+    } | undefined;
+    containerRef: any;
+    tab: "orderBook" | "lastTrades";
+    setTab: react.Dispatch<react.SetStateAction<"orderBook" | "lastTrades">>;
+};
+type OrderBookAndTradesState = ReturnType<typeof useOrderBookAndTradesScript>;
+
+declare const OrderBookAndTrades: FC<OrderBookAndTradesState>;
+
+declare const OrderBookAndTradesWidget: (props: {
+    symbol: string;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useTradingV2Script: () => TradingPageState;
+type TradingV2State = ReturnType<typeof useTradingV2Script>;
+
+declare const TradingV2: FC<TradingV2State>;
+
+declare const TradingV2Widget: () => react_jsx_runtime.JSX.Element;
+
+declare const TradingPageV2: (props: TradingPageV2Props) => react_jsx_runtime.JSX.Element;
+
+declare const TradingPageProvider: (props: PropsWithChildren<TradingPageV2Props>) => react_jsx_runtime.JSX.Element;
+
+export { AssetView, AssetViewWidget, DataList, DataListWidget, LastTrades, LastTradesWidget, OrderBook, OrderBookAndTrades, OrderBookAndTradesWidget, OrderBookWidget, RiskRate, RiskRateWidget, type ShareOptions, TradingPage, TradingPageProvider, TradingPageV2, TradingV2, TradingV2Widget, useOrderBookAndTradesScript, useOrderBookScript };

package/dist/index.d.ts

@@ -0,0 +1,303 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _orderly_network_types from '@orderly.network/types';
+import { API, NetworkId, AccountStatusEnum } from '@orderly.network/types';
+import { PositionsProps } from '@orderly.network/ui-positions';
+import * as react from 'react';
+import { ReactNode, FC, PropsWithChildren } from 'react';
+import * as _orderly_network_hooks from '@orderly.network/hooks';
+
+declare enum DataListTabType {
+    positions = "Positions",
+    pending = "Pending",
+    tp_sl = "TP/SL",
+    filled = "Filled",
+    orderHistory = "Order history"
+}
+declare const useDataListScript: (props: {
+    current?: DataListTabType;
+    config: PositionsProps & {
+        symbol?: string;
+    };
+}) => {
+    current: DataListTabType | undefined;
+    config: PositionsProps & {
+        symbol?: string | undefined;
+    };
+    unPnlPriceBasis: any;
+    setUnPnlPriceBasic: (value: string) => void;
+    pnlNotionalDecimalPrecision: any;
+    setPnlNotionalDecimalPrecision: (value: number) => void;
+    showAllSymbol: any;
+    setShowAllSymbol: (value: boolean) => void;
+};
+type DataListState = ReturnType<typeof useDataListScript>;
+
+type layoutInfo = {
+    width?: number;
+    height?: number;
+    fontSize?: number;
+    color?: string;
+    textAlign?: CanvasTextAlign;
+    textBaseline?: CanvasTextBaseline;
+    position: Partial<{
+        left: number;
+        right: number;
+        top: number;
+        bottom: number;
+    }>;
+};
+type PosterLayoutConfig = {
+    message?: layoutInfo;
+    domain?: layoutInfo;
+    position?: layoutInfo;
+    unrealizedPnl?: layoutInfo & {
+        secondaryColor: string;
+        secondaryFontSize: number;
+    };
+    informations?: layoutInfo & {
+        labelColor?: string;
+    };
+    updateTime?: layoutInfo;
+};
+type ShareOptions = {
+    pnl: {
+        /**
+         * defualt is Manrope
+         */
+        fontFamily?: string;
+        /**
+         * can not empty
+         */
+        backgroundImages: string[];
+        /**
+         * posterLayoutConfig
+         */
+        layout?: PosterLayoutConfig;
+        /**
+         * norma text color, default is  "rgba(255, 255, 255, 0.98)"
+         */
+        color?: string;
+        /**
+         * profit text color, default is "rgb(0,181,159)"
+         */
+        profitColor?: string;
+        /**
+         * loss text color, default is  "rgb(255,103,194)"
+         */
+        lossColor?: string;
+        /**
+         * brand color, default is "rgb(0,181,159)"
+         */
+        brandColor?: string;
+    };
+};
+declare enum TradingFeatures {
+    Sider = "sider",
+    TopNavBar = "topNavBar",
+    Footer = "footer",
+    Header = "header",
+    Kline = "kline",
+    OrderBook = "orderBook",
+    TradeHistory = "tradeHistory",
+    Positions = "positions",
+    Orders = "orders",
+    AssetAndMarginInfo = "asset_margin_info"
+}
+type BasicSymbolInfo = {
+    base_dp: number;
+    quote_dp: number;
+    base_tick: number;
+    base: string;
+    quote: string;
+};
+interface TradingPageState extends TradingPageV2Props {
+    symbolInfo: {
+        base_dp: number;
+        quote_dp: number;
+        base_tick: number;
+        base: string;
+        quote: string;
+        symbol: string;
+    };
+}
+interface TradingViewConfigInterface {
+    scriptSRC?: string;
+    library_path: string;
+    overrides?: Record<string, string>;
+    studiesOverrides?: Record<string, string>;
+    customCssUrl?: string;
+    colorConfig?: ColorConfigInterface;
+}
+interface ColorConfigInterface {
+    chartBG?: string;
+    upColor?: string;
+    downColor?: string;
+    pnlUpColor?: string;
+    pnlDownColor?: string;
+    pnlZoreColor?: string;
+    textColor?: string;
+    qtyTextColor?: string;
+    font?: string;
+    closeIcon?: string;
+}
+type ReferralProps = {
+    saveRefCode?: boolean;
+    onClickReferral?: () => void;
+    onBoundRefCode?: (success: boolean, error: any) => void;
+    refLink?: string;
+    slogan?: string;
+};
+type TradingRewardProps = {
+    onClickTradingReward?: () => void;
+};
+type BaseTradingPageProps = {
+    symbol: string;
+    tradingViewConfig: TradingViewConfigInterface;
+    onSymbolChange?: (symbol: API.Symbol) => void;
+    disableFeatures?: TradingFeatures[];
+    overrideFeatures?: Record<TradingFeatures, ReactNode>;
+};
+type TradingPageProps = BaseTradingPageProps & {
+    shareOptions: ShareOptions;
+    referral: ReferralProps;
+    tradingReward: TradingRewardProps;
+};
+type TradingPageV2Props = BaseTradingPageProps & {
+    dataList: {
+        current?: DataListTabType;
+        config: Partial<Omit<PositionsProps, "pnlNotionalDecimalPrecision">>;
+    };
+};
+
+declare const TradingPage: (props: TradingPageProps) => react_jsx_runtime.JSX.Element;
+
+declare const DataList: FC<DataListState>;
+
+declare const DataListWidget: (props: {
+    current?: DataListTabType;
+    config: Partial<Omit<PositionsProps, "pnlNotionalDecimalPrecision">>;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useLastTradesScript: (symbol: string) => {
+    base: any;
+    quote: any;
+    data: _orderly_network_types.API.Trade[];
+    isLoading: boolean;
+    baseDp: any;
+    quoteDp: any;
+};
+type LastTradesState = ReturnType<typeof useLastTradesScript>;
+
+declare const LastTrades: FC<LastTradesState & {
+    className?: string;
+    style?: React.CSSProperties;
+}>;
+
+declare const LastTradesWidget: (props: {
+    symbol: string;
+    className?: string;
+    style?: React.CSSProperties;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useAssetViewScript: () => {
+    onDeposit: () => Promise<unknown>;
+    onWithdraw: () => Promise<unknown>;
+    onSettle: () => Promise<any>;
+    visible: any;
+    toggleVisible: () => void;
+    networkId: NetworkId;
+    isFirstTimeDeposit: boolean;
+    totalValue: number;
+    status: AccountStatusEnum;
+    freeCollateral: number;
+    marginRatioVal: number;
+    renderMMR: string;
+    isConnected: boolean;
+};
+type AssetViewState = ReturnType<typeof useAssetViewScript>;
+
+declare const AssetView: FC<AssetViewState>;
+
+declare const AssetViewWidget: () => react_jsx_runtime.JSX.Element;
+
+declare const useOrderBookScript: (props: {
+    symbol: string;
+    height?: number;
+}) => {
+    level: number;
+    asks: _orderly_network_hooks.OrderBookItem[] | undefined;
+    bids: _orderly_network_hooks.OrderBookItem[] | undefined;
+    markPrice: number | undefined;
+    lastPrice: number[] | undefined;
+    depths: string[];
+    selDepth: string | undefined;
+    base: string;
+    quote: string;
+    isLoading: boolean | undefined;
+    onItemClick: ((item: _orderly_network_hooks.OrderBookItem) => void) | undefined;
+    cellHeight: number;
+    onDepthChange: ((depth: number) => void) | undefined;
+    pendingOrders: number[];
+    symbolInfo: BasicSymbolInfo;
+    isMWeb: boolean;
+};
+type OrderBookState = ReturnType<typeof useOrderBookScript>;
+
+declare const OrderBook: FC<OrderBookState & {
+    className?: string;
+}>;
+
+declare const OrderBookWidget: (props: {
+    className?: string;
+    symbol: string;
+    height?: number;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useRiskRateScript: () => {
+    riskRate: string;
+    riskRateColor: {
+        isHigh: boolean;
+        isMedium: boolean;
+        isLow: boolean;
+        isDefault: boolean;
+    };
+    isConnected: boolean;
+    currentLeverage: number;
+    maxLeverage: any;
+};
+type RiskRateState = ReturnType<typeof useRiskRateScript>;
+
+declare const RiskRate: FC<RiskRateState>;
+
+declare const RiskRateWidget: () => react_jsx_runtime.JSX.Element;
+
+declare const useOrderBookAndTradesScript: (symbol: string) => {
+    symbol: string;
+    containerSize: {
+        width: number;
+        height: number;
+    } | undefined;
+    containerRef: any;
+    tab: "orderBook" | "lastTrades";
+    setTab: react.Dispatch<react.SetStateAction<"orderBook" | "lastTrades">>;
+};
+type OrderBookAndTradesState = ReturnType<typeof useOrderBookAndTradesScript>;
+
+declare const OrderBookAndTrades: FC<OrderBookAndTradesState>;
+
+declare const OrderBookAndTradesWidget: (props: {
+    symbol: string;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useTradingV2Script: () => TradingPageState;
+type TradingV2State = ReturnType<typeof useTradingV2Script>;
+
+declare const TradingV2: FC<TradingV2State>;
+
+declare const TradingV2Widget: () => react_jsx_runtime.JSX.Element;
+
+declare const TradingPageV2: (props: TradingPageV2Props) => react_jsx_runtime.JSX.Element;
+
+declare const TradingPageProvider: (props: PropsWithChildren<TradingPageV2Props>) => react_jsx_runtime.JSX.Element;
+
+export { AssetView, AssetViewWidget, DataList, DataListWidget, LastTrades, LastTradesWidget, OrderBook, OrderBookAndTrades, OrderBookAndTradesWidget, OrderBookWidget, RiskRate, RiskRateWidget, type ShareOptions, TradingPage, TradingPageProvider, TradingPageV2, TradingV2, TradingV2Widget, useOrderBookAndTradesScript, useOrderBookScript };