import { EnrichedOrder, SupportedChainId } from '@cowprotocol/cow-sdk'; import { CowWidgetEventListeners, CowWidgetEventPayloadMap, CowWidgetEvents, OnTradeParamsPayload } from '@cowprotocol/events'; export type { SupportedChainId } from '@cowprotocol/cow-sdk'; export type { OnTradeParamsPayload } from '@cowprotocol/events'; export type PerTradeTypeConfig = Partial>; export type PerNetworkConfig = Partial>; export type FlexibleConfig = T | PerNetworkConfig | PerTradeTypeConfig | PerTradeTypeConfig> | PerNetworkConfig>; export declare enum WidgetMethodsEmit { ACTIVATE = "ACTIVATE", READY = "READY", UPDATE_HEIGHT = "UPDATE_HEIGHT", SET_FULL_HEIGHT = "SET_FULL_HEIGHT", EMIT_COW_EVENT = "EMIT_COW_EVENT", PROVIDER_RPC_REQUEST = "PROVIDER_RPC_REQUEST", INTERCEPT_WINDOW_OPEN = "INTERCEPT_WINDOW_OPEN", PROCESS_HOOK = "PROCESS_HOOK" } export declare enum WidgetMethodsListen { UPDATE_PARAMS = "UPDATE_PARAMS", UPDATE_APP_DATA = "UPDATE_APP_DATA", PROVIDER_RPC_RESPONSE = "PROVIDER_RPC_RESPONSE", PROVIDER_ON_EVENT = "PROVIDER_ON_EVENT", HOOK_RESULT = "HOOK_RESULT" } export declare enum WidgetHookEvents { ON_BEFORE_APPROVAL = "ON_BEFORE_APPROVAL", ON_BEFORE_TRADE = "ON_BEFORE_TRADE", ON_BEFORE_WRAP_UNWRAP = "ON_BEFORE_WRAP_UNWRAP", ON_BEFORE_ORDER_CANCEL = "ON_BEFORE_ORDER_CANCEL", ON_BEFORE_ORDERS_CANCEL = "ON_BEFORE_ORDERS_CANCEL" } export type WidgetHookResult = Promise | boolean; export interface OnApprovalPayload { chainId: SupportedChainId; sellToken: TokenInfo; sellAmount: string; walletAddress: string; spenderAddress: string; } export interface CowSwapWidgetProps { params: CowSwapWidgetParams; provider?: EthereumProvider; listeners?: CowWidgetEventListeners; onReady?(): void; } export interface JsonRpcRequest { id: number; method: string; params: unknown[]; } export interface EthereumProvider { /** * Subscribes to Ethereum-related events. * @param event - The event to subscribe to. * @param args - Arguments for the event. */ on(event: string, args: unknown): void; /** * Sends a JSON-RPC request to the Ethereum provider and returns the response. * @param params - JSON-RPC request parameters. * @returns A promise that resolves with the response. */ request(params: JsonRpcRequest): Promise; } export type CowSwapTheme = 'dark' | 'light'; /** *Trade asset parameters, for example: * { asset: 'WBTC', amount: 12 } * or * { asset: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48' } // USDC */ interface TradeAsset { /** The asset symbol or identifier. */ asset: string; /** * The amount of the asset (optional). * If specified, represents the quantity or value of the asset. */ amount?: string; } export type ForcedOrderDeadline = FlexibleConfig; export declare enum TradeType { SWAP = "swap", LIMIT = "limit", /** * Currently it means only TWAP orders. * But in the future it can be extended to support other order types. */ ADVANCED = "advanced", YIELD = "yield" } /** * The partner fee */ export interface PartnerFee { /** * The fee in basis points (BPS). One basis point is equivalent to 0.01% (1/100th of a percent) */ bps: FlexibleConfig; /** * The Ethereum address of the partner to receive the fee. */ recipient: FlexibleConfig; } /** * ERC-20 token information */ export type TokenInfo = { chainId: number; address: string; name: string; decimals: number; symbol: string; logoURI?: string; }; export declare const WIDGET_PALETTE_COLORS: readonly ["primary", "background", "paper", "text", "danger", "warning", "alert", "info", "success"]; export type CowSwapWidgetPaletteColors = (typeof WIDGET_PALETTE_COLORS)[number]; export type CowSwapWidgetPaletteParams = { [K in CowSwapWidgetPaletteColors]: string; }; export type CowSwapWidgetPalette = { baseTheme: CowSwapTheme; /** * Overrides the main widget card shadow. * Accepts any valid CSS box-shadow value, for example `none` or `0 12px 24px rgba(0, 0, 0, 0.12)`. */ boxShadow?: string; } & CowSwapWidgetPaletteParams; export interface CowSwapWidgetSounds { /** * The sound to play when the order is executed. Defaults to world wide famous CoW Swap moooooooooo! * Alternatively, you can use a URL to a custom sound file, or set to null to disable the sound. */ postOrder?: string | null; /** * The sound to play when the order is executed. Defaults to world wide famous CoW Swap happy moooooooooo! * Alternatively, you can use a URL to a custom sound file, or set to null to disable the sound. */ orderExecuted?: string | null; /** * The sound to play when the order is executed. Defaults to world wide famous CoW Swap unhappy moooooooooo! * Alternatively, you can use a URL to a custom sound file, or set to null to disable the sound. */ orderError?: string | null; } export interface CowSwapWidgetImages { /** * The image to display when the orders table is empty (no orders yet). It defaults to "Yoga CoW" image. * Alternatively, you can use a URL to a custom image file, or set to null to disable the image. */ emptyOrders?: string | null; } export interface CowSwapWidgetContent { feeLabel?: string; feeTooltipMarkdown?: string; } export interface SlippageConfig { /** Minimum slippage in basis points (e.g., 10 = 0.1%) */ min?: number; /** Maximum slippage in basis points (e.g., 5000 = 50%) - 5000 is max value for dApp */ max?: number; /** Default slippage value in basis points (e.g., 50 = 0.5%) - min <= defaultValue <= max */ defaultValue?: number; } export type FlexibleSlippageConfig = FlexibleConfig; export interface CowSwapWidgetParams { /** * The unique identifier of the widget consumer. * Please fill the for to let us know a little about you: https://cowprotocol.typeform.com/to/rONXaxHV */ appCode: string; /** * The width of the widget in pixels. Default: 400px */ width?: string; /** * The height of the widget in pixels. Default: 600px */ height?: string; /** * The maximum height of the widget in pixels. Default: body.offsetHeight */ maxHeight?: number; /** * Network ID. */ chainId?: SupportedChainId; /** * An id of a network to bridge the output token. */ targetChainId?: number; /** * The token lists (as urls) enabled for the widget. * These lists are available to both sell and buy selectors. */ tokenLists?: string[]; /** * The token lists (as urls) to use in the sell selector. * Note: these lists also contribute to the widget's globally enabled list set. * If omitted, the sell selector falls back to the globally enabled lists. */ sellTokenLists?: string[]; /** * The token lists (as urls) to use in the buy selector. * Note: these lists also contribute to the widget's globally enabled list set. * If omitted, the buy selector falls back to the globally enabled lists. */ buyTokenLists?: string[]; /** * Forces the widget locale. * Serialized as the `lng` query param used by the frontend locale resolver. * Accepts supported locales like `en-US` and fuzzy values like `en`. */ locale?: string; /** * Control the "Recent tokens" section displaying in the token selector */ hideRecentTokens?: boolean; /** * Control the "Favorite tokens" section displaying in the token selector */ hideFavoriteTokens?: boolean; /** * Swap, Limit or Advanced (Twap). */ tradeType?: TradeType; /** * The base url of the widget implementation * The parameter can have the URL directly, or an object with the environment property, * The base URL will default to the production environment if not specified, so it will use https://swap.cow.fi by default. * * For security, values are validated before loading the iframe: only `https` origins are accepted, * except `http` on local dev hosts (localhost, 127.0.0.1, ::1, *.localhost). Invalid URLs * (unparsable, credentials, or disallowed scheme/host) either throw or log and fall back to the * production host, depending on `SHOULD_THROW_IF_INVALID_URL` exported from `@cowprotocol/widget-lib`. */ baseUrl?: string; /** * Overrides the origin trusted for postMessage communication with the widget iframe. * Defaults to the origin derived from `baseUrl` / iframe src. */ trustedOrigin?: string; /** * Sell token, and optionally the amount. */ sell?: TradeAsset; /** * Buy token, and optionally the amount. */ buy?: TradeAsset; /** * Forced order deadline in minutes. When set, user's won't be able to edit the deadline. * * Either a single value applied to each individual order type accordingly or an optional individual value per order type. * * The app will use the appropriated min/max value per order type. */ forcedOrderDeadline?: ForcedOrderDeadline; /** * Enables the ability to switch between trade types in the widget. */ enabledTradeTypes?: TradeType[]; /** * The partner fee * * Please contact https://cowprotocol.typeform.com/to/rONXaxHV */ partnerFee?: PartnerFee; /** * Disables cross-chain swaps (bridging) * Defaults to false. */ disableCrossChainSwap?: boolean; /** * Disables adding custom tokens and custom token lists. * Defaults to false. */ disableTokenImport?: boolean; /** * Disables showing the confirmation modal you get after posting an order. * Defaults to false. */ disablePostedOrderConfirmationModal?: boolean; /** * Disables showing the progress bar after a SWAP order is placed. * The SWAP progress bar offers a transparent view into CoW Protocol's unique solution finding mechanism. * If you wish to not show it, set `disableProgressBar` to `true`. * * Defaults to false. */ disableProgressBar?: boolean; /** * Disables CoW Swap educational tips shown after a trade completes when no surplus message is available. * Defaults to false. */ disablePostTradeTips?: boolean; /** * Disables showing the toast messages. * Some UI might want to disable it and subscribe to WidgetMethodsEmit.ON_TOAST_MESSAGE event to handle the toast messages itself. * Defaults to false. */ disableToastMessages?: boolean; /** * When `true`, the host page will not use `window.open` to open links requested by the widget. * Defaults to `false`. */ disableWindowOpen?: boolean; /** * Option to hide the logo in the widget. */ hideLogo?: boolean; /** * Option to hide the network selector in the widget. */ hideNetworkSelector?: boolean; /** * Option to hide bridge info */ hideBridgeInfo?: boolean; /** * Option to hide orders table on LIMIT and TWAP forms. * * Warning! When `true`, users won't be able to see their LIMIT/TWAP order status or history, neither they'll be able to cancel active orders. */ hideOrdersTable?: boolean; /** * Defines the widget mode. * - `true` (standalone mode): The widget is standalone, so it will use its own Ethereum provider. The user can connect from within the widget. * - `false` (dapp mode): The widget is embedded in a dapp which is responsible for providing the Ethereum provider. Therefore, there won't be a connect button in the widget as this should happen in the host app. * * Defaults to standalone. */ standaloneMode?: boolean; /** * The theme of the widget UI. */ theme?: CowSwapTheme | CowSwapWidgetPalette; /** * Customizable images for the widget. */ images?: CowSwapWidgetImages; /** * Sounds configuration for the app. */ sounds?: CowSwapWidgetSounds; /** * In case when widget does not support some tokens, you can provide a list of tokens to be used in the widget */ customTokens?: TokenInfo[]; /** * Customizable labels and content for the widget. */ content?: CowSwapWidgetContent; /** * Customizable slippage settings for the widget. */ slippage?: FlexibleSlippageConfig; /** * Conditions to control the ability to trade */ disableTrade?: { whenPriceImpactIsUnknown?: boolean; whenPriceImpactIsHigherThan?: number; }; hooks?: Partial<{ onBeforeApproval(payload: OnApprovalPayload): WidgetHookResult; onBeforeWrapOrUnwrap(payload: OnTradeParamsPayload): WidgetHookResult; onBeforeTrade(payload: OnTradeParamsPayload): WidgetHookResult; onBeforeOrderCancel(payload: EnrichedOrder): WidgetHookResult; onBeforeOrdersCancel(payload: EnrichedOrder[]): WidgetHookResult; }>; } export interface WidgetMethodsEmitPayloadMap { [WidgetMethodsEmit.ACTIVATE]: void; [WidgetMethodsEmit.READY]: void; [WidgetMethodsEmit.EMIT_COW_EVENT]: EmitCowEventPayload; [WidgetMethodsEmit.UPDATE_HEIGHT]: UpdateWidgetHeightPayload; [WidgetMethodsEmit.SET_FULL_HEIGHT]: SetWidgetFullHeightPayload; [WidgetMethodsEmit.PROVIDER_RPC_REQUEST]: ProviderRpcRequestPayload; [WidgetMethodsEmit.INTERCEPT_WINDOW_OPEN]: WindowOpenPayload; [WidgetMethodsEmit.PROCESS_HOOK]: WidgetHookPayload; } export interface WidgetMethodsListenPayloadMap { [WidgetMethodsListen.UPDATE_APP_DATA]: UpdateAppDataPayload; [WidgetMethodsListen.UPDATE_PARAMS]: UpdateParamsPayload; [WidgetMethodsListen.PROVIDER_RPC_RESPONSE]: ProviderRpcResponsePayload; [WidgetMethodsListen.PROVIDER_ON_EVENT]: ProviderOnEventPayload; [WidgetMethodsListen.HOOK_RESULT]: WidgetHookResultPayload; } export type WidgetEventsPayloadMap = WidgetMethodsEmitPayloadMap & WidgetMethodsListenPayloadMap; export type WidgetMethodsEmitPayloads = WidgetMethodsEmitPayloadMap[WidgetMethodsEmit]; export type WidgetMethodsListenPayloads = WidgetMethodsListenPayloadMap[WidgetMethodsListen]; export type CowSwapWidgetAppParams = Omit; export interface UpdateParamsPayload { urlParams: { pathname: string; search: string; }; appParams: CowSwapWidgetAppParams; hasProvider: boolean; } export interface UpdateAppDataPayload { metaData?: { appCode: string; }; } export interface UpdateWidgetHeightPayload { height?: number; } export interface SetWidgetFullHeightPayload { isUpToSmall?: boolean; } export type WidgetHookId = string; export interface WidgetHookPayload { id: WidgetHookId; event: T; payload: WidgetHookPayloadMap[T]; } export interface WidgetHookResultPayload { id: WidgetHookId; result: boolean; } export interface WidgetHookPayloadMap { [WidgetHookEvents.ON_BEFORE_APPROVAL]: OnApprovalPayload; [WidgetHookEvents.ON_BEFORE_TRADE]: OnTradeParamsPayload; [WidgetHookEvents.ON_BEFORE_WRAP_UNWRAP]: OnTradeParamsPayload; [WidgetHookEvents.ON_BEFORE_ORDER_CANCEL]: EnrichedOrder; [WidgetHookEvents.ON_BEFORE_ORDERS_CANCEL]: EnrichedOrder[]; } export interface EmitCowEventPayload { event: T; payload: CowWidgetEventPayloadMap[T]; } export type WidgetMethodsEmitListener = T extends WidgetMethodsEmit ? { event: T; handler: WidgetMethodHandler; } : never; export type WidgetMethodHandler = (payload: WidgetMethodsEmitPayloadMap[T]) => void; export interface ProviderRpcRequestPayload { rpcRequest: JsonRpcRequestMessage; } export interface WindowOpenPayload { href: string | URL; target: string; rel: string; } export interface JsonRpcRequestMessage { jsonrpc: '2.0'; id?: number; method: string; params: unknown[]; } export interface BaseJsonRpcResponseMessage { id: number; jsonrpc: '2.0'; } export interface JsonRpcSucessfulResponseMessage extends BaseJsonRpcResponseMessage { result: TResult; } export interface JsonRpcError { code: number; message: string; data?: TData; } export interface JsonRpcErrorResponseMessage extends BaseJsonRpcResponseMessage { error: JsonRpcError; } export type ProviderRpcResponsePayload = { rpcResponse: JsonRpcResponse; }; export type JsonRpcResponse = JsonRpcRequestMessage | JsonRpcErrorResponseMessage | JsonRpcSucessfulResponseMessage; export interface ProviderOnEventPayload { event: string; params: unknown; } export type WindowListener = (event: MessageEvent) => void;