@lifi/widget 2.9.4 → 3.0.0-alpha.1

package/cjs/types/widget.js

@@ -1,25 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RequiredUI = exports.HiddenUI = exports.DisabledUI = void 0;
-var DisabledUI;
-(function (DisabledUI) {
-    DisabledUI["FromAmount"] = "fromAmount";
-    DisabledUI["FromToken"] = "fromToken";
-    DisabledUI["ToAddress"] = "toAddress";
-    DisabledUI["ToToken"] = "toToken";
-})(DisabledUI || (exports.DisabledUI = DisabledUI = {}));
-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 || (exports.HiddenUI = HiddenUI = {}));
-var RequiredUI;
-(function (RequiredUI) {
-    RequiredUI["ToAddress"] = "toAddress";
-})(RequiredUI || (exports.RequiredUI = RequiredUI = {}));

package/cjs/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/cjs/utils/colors.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getContrastTextColor = exports.getContrastAlphaColor = void 0;
-const colors_1 = require("@mui/material/colors");
-const styles_1 = require("@mui/material/styles");
-const getContrastAlphaColor = (mode, alpha) => mode === 'light' ? `rgb(0 0 0 / ${alpha})` : `rgb(255 255 255 / ${alpha})`;
-exports.getContrastAlphaColor = getContrastAlphaColor;
-const getContrastTextColor = (theme, background) => (0, styles_1.getContrastRatio)(colors_1.common.white, background ?? theme.palette.primary.main) >= 3
-    ? colors_1.common.white
-    : colors_1.common.black;
-exports.getContrastTextColor = getContrastTextColor;

package/cjs/utils/deepMerge.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.deepMerge = void 0;
-const isObject = (obj) => obj && typeof obj === 'object';
-const deepMerge = (...objects) => {
-    return objects.reduce((prev, obj) => {
-        for (const key in obj) {
-            if (isObject(prev[key]) && isObject(obj[key])) {
-                prev[key] = (0, exports.deepMerge)(prev[key], obj[key]);
-            }
-            else {
-                prev[key] = obj[key];
-            }
-        }
-        return prev;
-    }, {});
-};
-exports.deepMerge = deepMerge;

package/cjs/utils/elements.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.createElementId = exports.ElementId = void 0;
-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 || (exports.ElementId = ElementId = {}));
-const createElementId = (ElementId, elementId) => elementId ? `${ElementId}-${elementId}` : ElementId;
-exports.createElementId = createElementId;

package/cjs/utils/enum.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.hasEnumFlag = void 0;
-const hasEnumFlag = (flags, flag) => (flags & flag) === flag;
-exports.hasEnumFlag = hasEnumFlag;

package/cjs/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/cjs/utils/format.js

@@ -1,89 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.formatTokenPrice = exports.formatInputAmount = exports.formatSlippage = exports.formatTokenAmount = void 0;
-const big_js_1 = require("big.js");
-// JavaScript numbers use exponential notation for positive exponents of 21 and above. We need more.
-big_js_1.default.PE = 42;
-// JavaScript numbers use exponential notation for negative exponents of -7 and below. We need more.
-big_js_1.default.NE = -42;
-/**
- * Format token amount to at least 4 decimals.
- * @param amount amount to format.
- * @returns formatted amount.
- */
-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);
-};
-exports.formatTokenAmount = formatTokenAmount;
-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();
-};
-exports.formatSlippage = formatSlippage;
-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}` : ''}`;
-};
-exports.formatInputAmount = formatInputAmount;
-const formatTokenPrice = (amount, price) => {
-    if (!amount || !price) {
-        return 0;
-    }
-    if (isNaN(Number(amount)) || isNaN(Number(price))) {
-        return 0;
-    }
-    return parseFloat(amount) * parseFloat(price);
-};
-exports.formatTokenPrice = formatTokenPrice;

package/cjs/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/cjs/utils/index.js

@@ -1,24 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./colors"), exports);
-__exportStar(require("./deepMerge"), exports);
-__exportStar(require("./elements"), exports);
-__exportStar(require("./enum"), exports);
-__exportStar(require("./format"), exports);
-__exportStar(require("./input"), exports);
-__exportStar(require("./navigationRoutes"), exports);
-__exportStar(require("./wallet"), exports);

package/cjs/utils/input.js

@@ -1,30 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.fitInputText = void 0;
-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;
-};
-exports.fitInputText = fitInputText;

package/cjs/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/cjs/utils/navigationRoutes.js

@@ -1,52 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.backButtonRoutes = exports.stickyHeaderRoutes = exports.navigationRoutesValues = exports.navigationRoutes = void 0;
-exports.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',
-};
-exports.navigationRoutesValues = Object.values(exports.navigationRoutes);
-exports.stickyHeaderRoutes = [
-    exports.navigationRoutes.activeTransactions,
-    exports.navigationRoutes.bridges,
-    exports.navigationRoutes.exchanges,
-    exports.navigationRoutes.fromChain,
-    exports.navigationRoutes.home,
-    exports.navigationRoutes.routes,
-    exports.navigationRoutes.selectWallet,
-    exports.navigationRoutes.settings,
-    exports.navigationRoutes.toChain,
-    exports.navigationRoutes.toTokenNative,
-    exports.navigationRoutes.transactionDetails,
-    exports.navigationRoutes.transactionExecution,
-    exports.navigationRoutes.transactionHistory,
-];
-exports.backButtonRoutes = [
-    exports.navigationRoutes.activeTransactions,
-    exports.navigationRoutes.bridges,
-    exports.navigationRoutes.exchanges,
-    exports.navigationRoutes.fromChain,
-    exports.navigationRoutes.fromToken,
-    exports.navigationRoutes.routes,
-    exports.navigationRoutes.selectWallet,
-    exports.navigationRoutes.settings,
-    exports.navigationRoutes.toChain,
-    exports.navigationRoutes.toToken,
-    exports.navigationRoutes.toTokenNative,
-    exports.navigationRoutes.transactionDetails,
-    exports.navigationRoutes.transactionExecution,
-    exports.navigationRoutes.transactionHistory,
-];

package/cjs/utils/wallet.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.shortenAddress = void 0;
-const shortenAddress = (address) => address
-    ? `${address.substring(0, 5)}...${address.substring(address.length - 4)}`
-    : null;
-exports.shortenAddress = shortenAddress;

package/components/ActiveTransactions/ActiveTransactionItem.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export declare const ActiveTransactionItem: React.FC<{
-    routeId: string;
-    dense?: boolean;
-}>;

package/components/ActiveTransactions/ActiveTransactionItem.js

@@ -1,49 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
-import ErrorRoundedIcon from '@mui/icons-material/ErrorRounded';
-import InfoRoundedIcon from '@mui/icons-material/InfoRounded';
-import { ListItemAvatar, ListItemText, Typography } from '@mui/material';
-import { useNavigate } from 'react-router-dom';
-import { useProcessMessage, useRouteExecution } from '../../hooks';
-import { RouteExecutionStatus } from '../../stores';
-import { navigationRoutes } from '../../utils';
-import { StepTimer } from '../Step/StepTimer';
-import { TokenAvatar, TokenAvatarGroup } from '../TokenAvatar';
-import { ListItem, ListItemButton } from './ActiveTransactions.style';
-export const ActiveTransactionItem = ({ routeId, dense }) => {
-    const navigate = useNavigate();
-    const { route, status } = useRouteExecution({
-        routeId,
-        executeInBackground: true,
-    });
-    // TODO: replace with ES2023 findLast
-    const lastActiveStep = route?.steps
-        .slice()
-        .reverse()
-        .find((step) => step.execution);
-    const lastActiveProcess = lastActiveStep?.execution?.process.at(-1);
-    const { title } = useProcessMessage(lastActiveStep, lastActiveProcess);
-    if (!route || !lastActiveStep) {
-        return null;
-    }
-    const handleClick = () => {
-        navigate(navigationRoutes.transactionExecution, { state: { routeId } });
-    };
-    const getStatusComponent = () => {
-        switch (lastActiveProcess?.status) {
-            case 'ACTION_REQUIRED':
-                return _jsx(InfoRoundedIcon, { color: "info", fontSize: "small" });
-            case 'FAILED':
-                return _jsx(ErrorRoundedIcon, { color: "error", fontSize: "small" });
-            default:
-                return (_jsx(Typography, { fontSize: 14, fontWeight: 500, children: _jsx(StepTimer, { step: lastActiveStep, hideInProgress: true }) }));
-        }
-    };
-    const ListItemComponent = dense ? ListItem : ListItemButton;
-    return (_jsxs(ListItemComponent, { onClick: handleClick, dense: true, disableRipple: dense, children: [_jsx(ListItemAvatar, { children: _jsxs(TokenAvatarGroup, { total: 2, children: [_jsx(TokenAvatar, { token: route.fromToken }), _jsx(TokenAvatar, { token: route.toToken })] }) }), _jsx(ListItemText, { sx: { margin: 0 }, disableTypography: true, primary: _jsxs(Typography, { fontWeight: 500, lineHeight: 1, sx: {
-                        display: 'flex',
-                        alignItems: 'center',
-                        marginLeft: 2,
-                        height: 16,
-                    }, children: [route.fromToken.symbol, _jsx(ArrowForwardIcon, { sx: { paddingX: 0.5 } }), route.toToken.symbol] }), secondary: status !== RouteExecutionStatus.Done ? (_jsx(Typography, { fontWeight: 400, fontSize: 12, color: "text.secondary", lineHeight: 1, mt: 0.75, ml: 2, children: title })) : null }), getStatusComponent()] }));
-};

package/components/ActiveTransactions/ActiveTransactions.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import type { BoxProps } from '@mui/material';
-export declare const ActiveTransactions: React.FC<BoxProps>;

package/components/ActiveTransactions/ActiveTransactions.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Stack } from '@mui/material';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import { useWallet } from '../../providers';
-import { useExecutingRoutesIds } from '../../stores';
-import { navigationRoutes } from '../../utils';
-import { Card, CardTitle } from '../Card';
-import { ActiveTransactionItem } from './ActiveTransactionItem';
-import { ShowAllButton } from './ActiveTransactions.style';
-export const ActiveTransactions = (props) => {
-    const { t } = useTranslation();
-    const navigate = useNavigate();
-    const { account } = useWallet();
-    const executingRoutes = useExecutingRoutesIds(account.address);
-    if (!executingRoutes?.length) {
-        return null;
-    }
-    const handleShowAll = () => {
-        navigate(navigationRoutes.activeTransactions);
-    };
-    const hasShowAll = executingRoutes?.length > 2;
-    return (_jsxs(Card, { variant: "selected", selectionColor: "secondary", ...props, children: [_jsx(CardTitle, { children: t('header.activeTransactions') }), _jsx(Stack, { spacing: 1.5, pt: 1.5, pb: hasShowAll ? 0 : 2, children: executingRoutes.slice(0, 2).map((routeId) => (_jsx(ActiveTransactionItem, { routeId: routeId, dense: true }, routeId))) }), hasShowAll ? (_jsx(ShowAllButton, { disableRipple: true, fullWidth: true, onClick: handleShowAll, children: t('button.showAll') })) : null] }));
-};

package/components/ActiveTransactions/ActiveTransactions.style.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-export declare const ListItemButton: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "autoFocus" | "alignItems" | "divider" | "dense" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const ListItem: import("@emotion/styled").StyledComponent<{
-    button?: false | undefined;
-} & import("@mui/material").ListItemOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
-    ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
-}, "button" | "className" | "style" | "classes" | "children" | "disabled" | "sx" | "autoFocus" | "alignItems" | "divider" | "components" | "dense" | "componentsProps" | "slots" | "slotProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const ShowAllButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "href" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/components/ActiveTransactions/ActiveTransactions.style.js

@@ -1,32 +0,0 @@
-import { Button, ListItem as MuiListItem, ListItemButton as MuiListItemButton, } from '@mui/material';
-import { listItemSecondaryActionClasses } from '@mui/material/ListItemSecondaryAction';
-import { styled } from '@mui/material/styles';
-import { getContrastAlphaColor } from '../../utils';
-export const ListItemButton = styled(MuiListItemButton)(({ theme }) => ({
-    borderRadius: theme.shape.borderRadius,
-    paddingLeft: theme.spacing(1.5),
-    paddingRight: theme.spacing(1.5),
-    height: 64,
-    '&:hover': {
-        backgroundColor: getContrastAlphaColor(theme.palette.mode, '4%'),
-    },
-}));
-export const ListItem = styled(MuiListItem, {
-    shouldForwardProp: (prop) => prop !== 'disableRipple',
-})(({ theme }) => ({
-    padding: theme.spacing(0, 1.5),
-    [`.${listItemSecondaryActionClasses.root}`]: {
-        right: theme.spacing(3),
-    },
-    '&:hover': {
-        cursor: 'pointer',
-    },
-}));
-export const ShowAllButton = styled(Button)(({ theme }) => ({
-    background: 'none',
-    '&:hover': {
-        background: 'none',
-    },
-    padding: theme.spacing(0.75, 2),
-    fontSize: '0.875rem',
-}));

package/components/ActiveTransactions/index.js

@@ -1,2 +0,0 @@
-export * from './ActiveTransactionItem';
-export * from './ActiveTransactions';

package/components/AmountInput/AmountInput.d.ts

@@ -1,12 +0,0 @@
-import type { Token } from '@lifi/sdk';
-import type { BoxProps } from '@mui/material';
-import type { ReactNode } from 'react';
-import type { FormTypeProps } from '../../providers';
-export declare const AmountInput: React.FC<FormTypeProps & BoxProps>;
-export declare const AmountInputBase: React.FC<FormTypeProps & BoxProps & {
-    token?: Token;
-    startAdornment?: ReactNode;
-    endAdornment?: ReactNode;
-    bottomAdornment?: ReactNode;
-    disabled?: boolean;
-}>;

package/components/AmountInput/AmountInput.js

@@ -1,52 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useLayoutEffect, useRef } from 'react';
-import { useController, useWatch } from 'react-hook-form';
-import { useTranslation } from 'react-i18next';
-import { useToken } from '../../hooks';
-import { FormKeyHelper, useWidgetConfig } from '../../providers';
-import { DisabledUI } from '../../types';
-import { fitInputText, formatInputAmount } from '../../utils';
-import { Card, CardTitle } from '../Card';
-import { FormControl, Input, maxInputFontSize, minInputFontSize, } from './AmountInput.style';
-import { AmountInputEndAdornment } from './AmountInputEndAdornment';
-import { AmountInputStartAdornment } from './AmountInputStartAdornment';
-import { FormPriceHelperText } from './FormPriceHelperText';
-export const AmountInput = ({ formType, ...props }) => {
-    const { disabledUI } = useWidgetConfig();
-    const [chainId, tokenAddress] = useWatch({
-        name: [
-            FormKeyHelper.getChainKey(formType),
-            FormKeyHelper.getTokenKey(formType),
-        ],
-    });
-    const { token } = useToken(chainId, tokenAddress);
-    const disabled = disabledUI?.includes(DisabledUI.FromAmount);
-    return (_jsx(AmountInputBase, { formType: formType, token: token, startAdornment: _jsx(AmountInputStartAdornment, { formType: formType }), endAdornment: !disabled ? _jsx(AmountInputEndAdornment, { formType: formType }) : undefined, bottomAdornment: _jsx(FormPriceHelperText, { formType: formType }), disabled: disabled, ...props }));
-};
-export const AmountInputBase = ({ formType, token, startAdornment, endAdornment, bottomAdornment, disabled, ...props }) => {
-    const { t } = useTranslation();
-    const amountKey = FormKeyHelper.getAmountKey(formType);
-    const { field: { onChange, onBlur, value }, } = useController({
-        name: amountKey,
-    });
-    const ref = useRef(null);
-    const handleChange = (event) => {
-        const { value } = event.target;
-        const formattedAmount = formatInputAmount(value, token?.decimals, true);
-        onChange(formattedAmount);
-    };
-    const handleBlur = (event) => {
-        const { value } = event.target;
-        const formattedAmount = formatInputAmount(value, token?.decimals);
-        onChange(formattedAmount);
-        onBlur();
-    };
-    useLayoutEffect(() => {
-        if (ref.current) {
-            fitInputText(maxInputFontSize, minInputFontSize, ref.current);
-        }
-    }, [value, ref]);
-    return (_jsxs(Card, { ...props, children: [_jsx(CardTitle, { children: t('main.fromAmount') }), _jsxs(FormControl, { fullWidth: true, children: [_jsx(Input, { inputRef: ref, size: "small", autoComplete: "off", placeholder: "0", startAdornment: startAdornment, endAdornment: endAdornment, inputProps: {
-                            inputMode: 'decimal',
-                        }, onChange: handleChange, onBlur: handleBlur, value: value, name: amountKey, disabled: disabled, required: true }), bottomAdornment] })] }));
-};

package/components/AmountInput/AmountInput.style.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-export declare const maxInputFontSize = 24;
-export declare const minInputFontSize = 14;
-export declare const FormControl: import("@emotion/styled").StyledComponent<import("@mui/material").FormControlOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "className" | "style" | "classes" | "children" | "disabled" | "sx" | "color" | "margin" | "fullWidth" | "size" | "variant" | "error" | "required" | "focused" | "hiddenLabel"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const Input: import("@emotion/styled").StyledComponent<import("@mui/material").InputBaseProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/components/AmountInput/AmountInput.style.js

@@ -1,31 +0,0 @@
-import { FormControl as MuiFormControl, InputBase } from '@mui/material';
-import { inputBaseClasses } from '@mui/material/InputBase';
-import { styled } from '@mui/material/styles';
-export const maxInputFontSize = 24;
-export const minInputFontSize = 14;
-export const FormControl = styled(MuiFormControl)(({ theme }) => ({
-    padding: theme.spacing(1.5, 2, 1.5, 0),
-}));
-export const Input = styled(InputBase)(({ theme }) => ({
-    fontSize: 24,
-    fontWeight: 700,
-    boxShadow: 'none',
-    // padding: theme.spacing(2, 2, 2, 0),
-    [`.${inputBaseClasses.input}`]: {
-        height: 32,
-        padding: theme.spacing(0, 0, 0, 2),
-    },
-    '& input[type="number"]::-webkit-outer-spin-button, & input[type="number"]::-webkit-inner-spin-button': {
-        WebkitAppearance: 'none',
-        margin: 0,
-    },
-    '& input[type="number"]': {
-        MozAppearance: 'textfield',
-    },
-    [`&.${inputBaseClasses.disabled}`]: {
-        color: 'inherit',
-    },
-    [`.${inputBaseClasses.input}.${inputBaseClasses.disabled}`]: {
-        WebkitTextFillColor: 'unset',
-    },
-}));

package/components/AmountInput/AmountInputAdornment.style.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-export declare const Button: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "href" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/components/AmountInput/AmountInputAdornment.style.js

@@ -1,8 +0,0 @@
-import { Button as MuiButton } from '@mui/material';
-import { styled } from '@mui/material/styles';
-export const Button = styled(MuiButton)(({ theme }) => ({
-    padding: theme.spacing(0.5, 1, 0.625, 1),
-    lineHeight: 1.0715,
-    fontSize: '0.875rem',
-    minWidth: 'unset',
-}));

package/components/AmountInput/AmountInputEndAdornment.d.ts

@@ -1,2 +0,0 @@
-import type { FormTypeProps } from '../../providers';
-export declare const AmountInputEndAdornment: ({ formType }: FormTypeProps) => import("react/jsx-runtime").JSX.Element;