@lifi/widget 2.9.4 → 3.0.0-alpha.1

package/types/events.d.ts

@@ -1,48 +0,0 @@
-import type { ChainId, Process, Route } from '@lifi/sdk';
-export declare enum WidgetEvent {
-    RouteExecutionStarted = "routeExecutionStarted",
-    RouteExecutionUpdated = "routeExecutionUpdated",
-    RouteExecutionCompleted = "routeExecutionCompleted",
-    RouteExecutionFailed = "routeExecutionFailed",
-    RouteHighValueLoss = "routeHighValueLoss",
-    RouteContactSupport = "routeContactSupport",
-    SourceChainTokenSelected = "sourceChainTokenSelected",
-    DestinationChainTokenSelected = "destinationChainTokenSelected",
-    SendToWalletToggled = "sendToWalletToggled",
-    ReviewTransactionPageEntered = "reviewTransactionPageEntered",
-    WalletConnected = "walletConnected"
-}
-export type WidgetEvents = {
-    routeExecutionStarted: Route;
-    routeExecutionUpdated: RouteExecutionUpdate;
-    routeExecutionCompleted: Route;
-    routeExecutionFailed: RouteExecutionUpdate;
-    routeHighValueLoss: RouteHighValueLossUpdate;
-    routeContactSupport: RouteContactSupport;
-    sourceChainTokenSelected: ChainTokenSelected;
-    destinationChainTokenSelected: ChainTokenSelected;
-    sendToWalletToggled: boolean;
-    reviewTransactionPageEntered?: Route;
-    walletConnected: WalletConnected;
-};
-export interface RouteContactSupport {
-    supportId?: string;
-}
-export interface RouteHighValueLossUpdate {
-    fromAmountUsd: string;
-    gasCostUSD?: string;
-    toAmountUSD: string;
-    valueLoss: string;
-}
-export interface RouteExecutionUpdate {
-    route: Route;
-    process: Process;
-}
-export interface ChainTokenSelected {
-    chainId: ChainId;
-    tokenAddress: string;
-}
-export interface WalletConnected {
-    chainId?: number;
-    address?: string;
-}

package/types/events.js

@@ -1,14 +0,0 @@
-export var WidgetEvent;
-(function (WidgetEvent) {
-    WidgetEvent["RouteExecutionStarted"] = "routeExecutionStarted";
-    WidgetEvent["RouteExecutionUpdated"] = "routeExecutionUpdated";
-    WidgetEvent["RouteExecutionCompleted"] = "routeExecutionCompleted";
-    WidgetEvent["RouteExecutionFailed"] = "routeExecutionFailed";
-    WidgetEvent["RouteHighValueLoss"] = "routeHighValueLoss";
-    WidgetEvent["RouteContactSupport"] = "routeContactSupport";
-    WidgetEvent["SourceChainTokenSelected"] = "sourceChainTokenSelected";
-    WidgetEvent["DestinationChainTokenSelected"] = "destinationChainTokenSelected";
-    WidgetEvent["SendToWalletToggled"] = "sendToWalletToggled";
-    WidgetEvent["ReviewTransactionPageEntered"] = "reviewTransactionPageEntered";
-    WidgetEvent["WalletConnected"] = "walletConnected";
-})(WidgetEvent || (WidgetEvent = {}));

package/types/index.js

@@ -1,3 +0,0 @@
-export * from './events';
-export * from './token';
-export * from './widget';

package/types/token.d.ts

@@ -1,4 +0,0 @@
-import type { TokenAmount as SDKTokenAmount } from '@lifi/sdk';
-export interface TokenAmount extends SDKTokenAmount {
-    featured?: boolean;
-}

package/types/token.js

@@ -1 +0,0 @@
-export {};

package/types/widget.d.ts

@@ -1,132 +0,0 @@
-import type { Signer } from '@ethersproject/abstract-signer';
-import type { BaseToken, ChainKey, ConfigUpdate, Order, RouteOptions, StaticToken, Token } from '@lifi/sdk';
-import type { Components, PaletteMode, PaletteOptions, Shape, Theme } from '@mui/material';
-import type { TypographyOptions } from '@mui/material/styles/createTypography';
-import type { CSSProperties, ReactNode, RefObject } from 'react';
-import type { LanguageKey, LanguageResources } from '../providers';
-import type { SplitSubvariantOptions } from '../stores';
-export type WidgetVariant = 'default' | 'expandable' | 'drawer';
-export type WidgetSubvariant = 'default' | 'split' | 'nft' | 'refuel';
-export declare enum DisabledUI {
-    FromAmount = "fromAmount",
-    FromToken = "fromToken",
-    ToAddress = "toAddress",
-    ToToken = "toToken"
-}
-export type DisabledUIType = `${DisabledUI}`;
-export declare enum HiddenUI {
-    Appearance = "appearance",
-    DrawerButton = "drawerButton",
-    History = "history",
-    Language = "language",
-    PoweredBy = "poweredBy",
-    ToAddress = "toAddress",
-    ToToken = "toToken",
-    WalletMenu = "walletMenu"
-}
-export type HiddenUIType = `${HiddenUI}`;
-export declare enum RequiredUI {
-    ToAddress = "toAddress"
-}
-export type RequiredUIType = `${RequiredUI}`;
-export type Appearance = PaletteMode | 'auto';
-export type ThemeConfig = {
-    palette?: Pick<PaletteOptions, 'background' | 'grey' | 'primary' | 'secondary' | 'text'>;
-    shape?: Shape;
-    typography?: TypographyOptions;
-    components?: Pick<Components<Omit<Theme, 'components'>>, 'MuiAvatar'>;
-};
-export interface WidgetWalletManagement {
-    connect(): Promise<Signer>;
-    disconnect(): Promise<void>;
-    switchChain?(chainId: number): Promise<Signer>;
-    addToken?(token: StaticToken, chainId: number): Promise<void>;
-    addChain?(chainId: number): Promise<boolean>;
-    signer?: Signer;
-}
-export interface SDKConfig extends Omit<ConfigUpdate, 'defaultExecutionSettings' | 'defaultRouteOptions' | 'disableVersionCheck' | 'integrator'> {
-    defaultRouteOptions?: Omit<RouteOptions, 'bridges' | 'exchanges' | 'insurance'>;
-}
-export interface WidgetContractTool {
-    logoURI: string;
-    name: string;
-}
-export interface WidgetContract {
-    address?: string;
-    callData?: string;
-    gasLimit?: string;
-    approvalAddress?: string;
-    outputToken?: string;
-    fallbackAddress?: string;
-}
-export interface WidgetConfig {
-    fromChain?: `${ChainKey}` | number;
-    toChain?: `${ChainKey}` | number;
-    fromToken?: string;
-    toToken?: string;
-    toAddress?: string;
-    fromAmount?: number | string;
-    toAmount?: number | string;
-    contract?: WidgetContract;
-    contractComponent?: ReactNode;
-    contractSecondaryComponent?: ReactNode;
-    contractCompactComponent?: ReactNode;
-    contractTool?: WidgetContractTool;
-    integrator: string;
-    apiKey?: string;
-    fee?: number;
-    referrer?: string;
-    routePriority?: Order;
-    slippage?: number;
-    insurance?: boolean;
-    variant?: WidgetVariant;
-    subvariant?: WidgetSubvariant;
-    subvariantOptions?: SplitSubvariantOptions;
-    appearance?: Appearance;
-    theme?: ThemeConfig;
-    containerStyle?: CSSProperties;
-    disabledUI?: DisabledUIType[];
-    hiddenUI?: HiddenUIType[];
-    requiredUI?: RequiredUIType[];
-    useRecommendedRoute?: boolean;
-    walletManagement?: WidgetWalletManagement;
-    sdkConfig?: SDKConfig;
-    buildUrl?: boolean;
-    keyPrefix?: string;
-    bridges?: {
-        allow?: string[];
-        deny?: string[];
-    };
-    exchanges?: {
-        allow?: string[];
-        deny?: string[];
-    };
-    chains?: {
-        allow?: number[];
-        deny?: number[];
-    };
-    tokens?: {
-        featured?: StaticToken[];
-        include?: Token[];
-        allow?: BaseToken[];
-        deny?: BaseToken[];
-    };
-    languages?: {
-        default?: LanguageKey;
-        allow?: LanguageKey[];
-        deny?: LanguageKey[];
-    };
-    languageResources?: LanguageResources;
-    disableLanguageDetector?: boolean;
-}
-export type WidgetDrawerProps = {
-    elementRef?: RefObject<HTMLDivElement>;
-    open?: boolean;
-};
-export interface WidgetConfigProps {
-    config: WidgetConfig;
-}
-export interface WidgetConfigPartialProps {
-    config?: Partial<WidgetConfig>;
-}
-export type WidgetProps = WidgetDrawerProps & WidgetConfig & WidgetConfigPartialProps;

package/types/widget.js

@@ -1,22 +0,0 @@
-export var DisabledUI;
-(function (DisabledUI) {
-    DisabledUI["FromAmount"] = "fromAmount";
-    DisabledUI["FromToken"] = "fromToken";
-    DisabledUI["ToAddress"] = "toAddress";
-    DisabledUI["ToToken"] = "toToken";
-})(DisabledUI || (DisabledUI = {}));
-export var HiddenUI;
-(function (HiddenUI) {
-    HiddenUI["Appearance"] = "appearance";
-    HiddenUI["DrawerButton"] = "drawerButton";
-    HiddenUI["History"] = "history";
-    HiddenUI["Language"] = "language";
-    HiddenUI["PoweredBy"] = "poweredBy";
-    HiddenUI["ToAddress"] = "toAddress";
-    HiddenUI["ToToken"] = "toToken";
-    HiddenUI["WalletMenu"] = "walletMenu";
-})(HiddenUI || (HiddenUI = {}));
-export var RequiredUI;
-(function (RequiredUI) {
-    RequiredUI["ToAddress"] = "toAddress";
-})(RequiredUI || (RequiredUI = {}));

package/utils/colors.d.ts

@@ -1,3 +0,0 @@
-import type { PaletteMode, Theme } from '@mui/material';
-export declare const getContrastAlphaColor: (mode: PaletteMode, alpha: string | number) => string;
-export declare const getContrastTextColor: (theme: Theme, background?: string) => "#fff" | "#000";

package/utils/colors.js

@@ -1,6 +0,0 @@
-import { common } from '@mui/material/colors';
-import { getContrastRatio } from '@mui/material/styles';
-export const getContrastAlphaColor = (mode, alpha) => mode === 'light' ? `rgb(0 0 0 / ${alpha})` : `rgb(255 255 255 / ${alpha})`;
-export const getContrastTextColor = (theme, background) => getContrastRatio(common.white, background ?? theme.palette.primary.main) >= 3
-    ? common.white
-    : common.black;

package/utils/deepMerge.d.ts

@@ -1 +0,0 @@
-export declare const deepMerge: (...objects: any[]) => any;

package/utils/deepMerge.js

@@ -1,14 +0,0 @@
-const isObject = (obj) => obj && typeof obj === 'object';
-export const deepMerge = (...objects) => {
-    return objects.reduce((prev, obj) => {
-        for (const key in obj) {
-            if (isObject(prev[key]) && isObject(obj[key])) {
-                prev[key] = deepMerge(prev[key], obj[key]);
-            }
-            else {
-                prev[key] = obj[key];
-            }
-        }
-        return prev;
-    }, {});
-};

package/utils/elements.d.ts

@@ -1,7 +0,0 @@
-export declare enum ElementId {
-    AppExpandedContainer = "widget-app-expanded-container",
-    Header = "widget-header",
-    RelativeContainer = "widget-relative-container",
-    ScrollableContainer = "widget-scrollable-container"
-}
-export declare const createElementId: (ElementId: ElementId, elementId: string) => string;

package/utils/elements.js

@@ -1,8 +0,0 @@
-export var ElementId;
-(function (ElementId) {
-    ElementId["AppExpandedContainer"] = "widget-app-expanded-container";
-    ElementId["Header"] = "widget-header";
-    ElementId["RelativeContainer"] = "widget-relative-container";
-    ElementId["ScrollableContainer"] = "widget-scrollable-container";
-})(ElementId || (ElementId = {}));
-export const createElementId = (ElementId, elementId) => elementId ? `${ElementId}-${elementId}` : ElementId;

package/utils/enum.d.ts

@@ -1 +0,0 @@
-export declare const hasEnumFlag: <T extends number | bigint>(flags: T, flag: T) => boolean;

package/utils/enum.js

@@ -1 +0,0 @@
-export const hasEnumFlag = (flags, flag) => (flags & flag) === flag;

package/utils/format.d.ts

@@ -1,9 +0,0 @@
-/**
- * Format token amount to at least 4 decimals.
- * @param amount amount to format.
- * @returns formatted amount.
- */
-export declare const formatTokenAmount: (amount?: string, decimals?: number, decimalPlaces?: number) => string;
-export declare const formatSlippage: (slippage?: string, defaultValue?: string, returnInitial?: boolean) => string;
-export declare const formatInputAmount: (amount: string, decimals?: number | null, returnInitial?: boolean) => string;
-export declare const formatTokenPrice: (amount?: string, price?: string) => number;

package/utils/format.js

@@ -1,82 +0,0 @@
-import Big from 'big.js';
-// JavaScript numbers use exponential notation for positive exponents of 21 and above. We need more.
-Big.PE = 42;
-// JavaScript numbers use exponential notation for negative exponents of -7 and below. We need more.
-Big.NE = -42;
-/**
- * Format token amount to at least 4 decimals.
- * @param amount amount to format.
- * @returns formatted amount.
- */
-export const formatTokenAmount = (amount = '0', decimals = 0, decimalPlaces = 3) => {
-    let shiftedAmount = amount;
-    if (decimals) {
-        shiftedAmount = (Number(amount) / 10 ** decimals).toString();
-    }
-    const parsedAmount = parseFloat(shiftedAmount);
-    if (parsedAmount === 0 || isNaN(Number(shiftedAmount))) {
-        return '0';
-    }
-    const absAmount = Math.abs(parsedAmount);
-    while (absAmount < 1 / 10 ** decimalPlaces) {
-        decimalPlaces++;
-    }
-    return parsedAmount.toFixed(decimalPlaces + 1);
-};
-export const formatSlippage = (slippage = '', defaultValue = '', returnInitial = false) => {
-    if (!slippage) {
-        return slippage;
-    }
-    const parsedSlippage = parseFloat(slippage);
-    if (isNaN(Number(slippage)) && !isNaN(parsedSlippage)) {
-        return parsedSlippage.toString();
-    }
-    if (isNaN(parsedSlippage)) {
-        return defaultValue;
-    }
-    if (parsedSlippage > 100) {
-        return '100';
-    }
-    if (parsedSlippage < 0) {
-        return Math.abs(parsedSlippage).toString();
-    }
-    if (returnInitial) {
-        return slippage;
-    }
-    return parsedSlippage.toString();
-};
-export const formatInputAmount = (amount, decimals = null, returnInitial = false) => {
-    if (!amount) {
-        return amount;
-    }
-    let formattedAmount = amount.replaceAll(',', '.');
-    if (formattedAmount.startsWith('.')) {
-        formattedAmount = '0' + formattedAmount;
-    }
-    const parsedAmount = parseFloat(formattedAmount);
-    if (isNaN(Number(formattedAmount)) && !isNaN(parsedAmount)) {
-        return parsedAmount.toString();
-    }
-    if (isNaN(Math.abs(Number(formattedAmount)))) {
-        return '';
-    }
-    if (returnInitial) {
-        return formattedAmount;
-    }
-    let [integer, fraction = ''] = formattedAmount.split('.');
-    if (decimals !== null && fraction.length > decimals) {
-        fraction = fraction.slice(0, decimals);
-    }
-    integer = integer.replace(/^0+|-/, '');
-    fraction = fraction.replace(/(0+)$/, '');
-    return `${integer || (fraction ? '0' : '')}${fraction ? `.${fraction}` : ''}`;
-};
-export const formatTokenPrice = (amount, price) => {
-    if (!amount || !price) {
-        return 0;
-    }
-    if (isNaN(Number(amount)) || isNaN(Number(price))) {
-        return 0;
-    }
-    return parseFloat(amount) * parseFloat(price);
-};

package/utils/index.d.ts

@@ -1,8 +0,0 @@
-export * from './colors';
-export * from './deepMerge';
-export * from './elements';
-export * from './enum';
-export * from './format';
-export * from './input';
-export * from './navigationRoutes';
-export * from './wallet';

package/utils/index.js

@@ -1,8 +0,0 @@
-export * from './colors';
-export * from './deepMerge';
-export * from './elements';
-export * from './enum';
-export * from './format';
-export * from './input';
-export * from './navigationRoutes';
-export * from './wallet';

package/utils/input.d.ts

@@ -1 +0,0 @@
-export declare const fitInputText: (maxFontSize: number, minFontSize: number, element: HTMLElement) => void;

package/utils/input.js

@@ -1,26 +0,0 @@
-export const fitInputText = (maxFontSize, minFontSize, element) => {
-    if (!element) {
-        return;
-    }
-    let high = maxFontSize;
-    let low = minFontSize;
-    let size = minFontSize;
-    let mid = 0;
-    // Binary search for highest font size best fit
-    while (low <= high) {
-        mid = (high + low) >> 1;
-        const fontSize = `${mid + 1}px`;
-        element.style.fontSize = fontSize;
-        // scrollWidth has different rounding than clientWidth, remove 1px for consistency
-        const scrollWidth = element.scrollWidth - 1;
-        if (scrollWidth <= element.clientWidth) {
-            size = mid;
-            low = mid + 1;
-        }
-        else {
-            high = mid - 1;
-        }
-    }
-    const fontSize = `${size}px`;
-    element.style.fontSize = fontSize;
-};

package/utils/navigationRoutes.d.ts

@@ -1,21 +0,0 @@
-export declare const navigationRoutes: {
-    home: string;
-    activeTransactions: string;
-    bridges: string;
-    exchanges: string;
-    fromChain: string;
-    fromToken: string;
-    routes: string;
-    selectWallet: string;
-    settings: string;
-    toChain: string;
-    toToken: string;
-    toTokenNative: string;
-    transactionDetails: string;
-    transactionExecution: string;
-    transactionHistory: string;
-};
-export declare const navigationRoutesValues: string[];
-export declare const stickyHeaderRoutes: string[];
-export declare const backButtonRoutes: string[];
-export type NavigationRouteType = keyof typeof navigationRoutes;

package/utils/navigationRoutes.js

@@ -1,49 +0,0 @@
-export const navigationRoutes = {
-    home: '/',
-    activeTransactions: 'active-transactions',
-    bridges: 'bridges',
-    exchanges: 'exchanges',
-    fromChain: 'from-chain',
-    fromToken: 'from-token',
-    routes: 'routes',
-    selectWallet: 'wallet',
-    settings: 'settings',
-    toChain: 'to-chain',
-    toToken: 'to-token',
-    toTokenNative: 'to-token-native',
-    transactionDetails: 'transaction-details',
-    transactionExecution: 'transaction-execution',
-    transactionHistory: 'transaction-history',
-};
-export const navigationRoutesValues = Object.values(navigationRoutes);
-export const stickyHeaderRoutes = [
-    navigationRoutes.activeTransactions,
-    navigationRoutes.bridges,
-    navigationRoutes.exchanges,
-    navigationRoutes.fromChain,
-    navigationRoutes.home,
-    navigationRoutes.routes,
-    navigationRoutes.selectWallet,
-    navigationRoutes.settings,
-    navigationRoutes.toChain,
-    navigationRoutes.toTokenNative,
-    navigationRoutes.transactionDetails,
-    navigationRoutes.transactionExecution,
-    navigationRoutes.transactionHistory,
-];
-export const backButtonRoutes = [
-    navigationRoutes.activeTransactions,
-    navigationRoutes.bridges,
-    navigationRoutes.exchanges,
-    navigationRoutes.fromChain,
-    navigationRoutes.fromToken,
-    navigationRoutes.routes,
-    navigationRoutes.selectWallet,
-    navigationRoutes.settings,
-    navigationRoutes.toChain,
-    navigationRoutes.toToken,
-    navigationRoutes.toTokenNative,
-    navigationRoutes.transactionDetails,
-    navigationRoutes.transactionExecution,
-    navigationRoutes.transactionHistory,
-];

package/utils/wallet.d.ts

@@ -1 +0,0 @@
-export declare const shortenAddress: (address?: string) => string | null;

package/utils/wallet.js

@@ -1,3 +0,0 @@
-export const shortenAddress = (address) => address
-    ? `${address.substring(0, 5)}...${address.substring(address.length - 4)}`
-    : null;