@lifi/widget 2.9.4 → 3.0.0-alpha.1

package/cjs/components/ActiveTransactions/index.js

@@ -1,18 +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("./ActiveTransactionItem"), exports);
-__exportStar(require("./ActiveTransactions"), exports);

package/cjs/components/AmountInput/AmountInput.js

@@ -1,57 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AmountInputBase = exports.AmountInput = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const react_hook_form_1 = require("react-hook-form");
-const react_i18next_1 = require("react-i18next");
-const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
-const types_1 = require("../../types");
-const utils_1 = require("../../utils");
-const Card_1 = require("../Card");
-const AmountInput_style_1 = require("./AmountInput.style");
-const AmountInputEndAdornment_1 = require("./AmountInputEndAdornment");
-const AmountInputStartAdornment_1 = require("./AmountInputStartAdornment");
-const FormPriceHelperText_1 = require("./FormPriceHelperText");
-const AmountInput = ({ formType, ...props }) => {
-    const { disabledUI } = (0, providers_1.useWidgetConfig)();
-    const [chainId, tokenAddress] = (0, react_hook_form_1.useWatch)({
-        name: [
-            providers_1.FormKeyHelper.getChainKey(formType),
-            providers_1.FormKeyHelper.getTokenKey(formType),
-        ],
-    });
-    const { token } = (0, hooks_1.useToken)(chainId, tokenAddress);
-    const disabled = disabledUI?.includes(types_1.DisabledUI.FromAmount);
-    return ((0, jsx_runtime_1.jsx)(exports.AmountInputBase, { formType: formType, token: token, startAdornment: (0, jsx_runtime_1.jsx)(AmountInputStartAdornment_1.AmountInputStartAdornment, { formType: formType }), endAdornment: !disabled ? (0, jsx_runtime_1.jsx)(AmountInputEndAdornment_1.AmountInputEndAdornment, { formType: formType }) : undefined, bottomAdornment: (0, jsx_runtime_1.jsx)(FormPriceHelperText_1.FormPriceHelperText, { formType: formType }), disabled: disabled, ...props }));
-};
-exports.AmountInput = AmountInput;
-const AmountInputBase = ({ formType, token, startAdornment, endAdornment, bottomAdornment, disabled, ...props }) => {
-    const { t } = (0, react_i18next_1.useTranslation)();
-    const amountKey = providers_1.FormKeyHelper.getAmountKey(formType);
-    const { field: { onChange, onBlur, value }, } = (0, react_hook_form_1.useController)({
-        name: amountKey,
-    });
-    const ref = (0, react_1.useRef)(null);
-    const handleChange = (event) => {
-        const { value } = event.target;
-        const formattedAmount = (0, utils_1.formatInputAmount)(value, token?.decimals, true);
-        onChange(formattedAmount);
-    };
-    const handleBlur = (event) => {
-        const { value } = event.target;
-        const formattedAmount = (0, utils_1.formatInputAmount)(value, token?.decimals);
-        onChange(formattedAmount);
-        onBlur();
-    };
-    (0, react_1.useLayoutEffect)(() => {
-        if (ref.current) {
-            (0, utils_1.fitInputText)(AmountInput_style_1.maxInputFontSize, AmountInput_style_1.minInputFontSize, ref.current);
-        }
-    }, [value, ref]);
-    return ((0, jsx_runtime_1.jsxs)(Card_1.Card, { ...props, children: [(0, jsx_runtime_1.jsx)(Card_1.CardTitle, { children: t('main.fromAmount') }), (0, jsx_runtime_1.jsxs)(AmountInput_style_1.FormControl, { fullWidth: true, children: [(0, jsx_runtime_1.jsx)(AmountInput_style_1.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] })] }));
-};
-exports.AmountInputBase = AmountInputBase;

package/cjs/components/AmountInput/AmountInput.style.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Input = exports.FormControl = exports.minInputFontSize = exports.maxInputFontSize = void 0;
-const material_1 = require("@mui/material");
-const InputBase_1 = require("@mui/material/InputBase");
-const styles_1 = require("@mui/material/styles");
-exports.maxInputFontSize = 24;
-exports.minInputFontSize = 14;
-exports.FormControl = (0, styles_1.styled)(material_1.FormControl)(({ theme }) => ({
-    padding: theme.spacing(1.5, 2, 1.5, 0),
-}));
-exports.Input = (0, styles_1.styled)(material_1.InputBase)(({ theme }) => ({
-    fontSize: 24,
-    fontWeight: 700,
-    boxShadow: 'none',
-    // padding: theme.spacing(2, 2, 2, 0),
-    [`.${InputBase_1.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',
-    },
-    [`&.${InputBase_1.inputBaseClasses.disabled}`]: {
-        color: 'inherit',
-    },
-    [`.${InputBase_1.inputBaseClasses.input}.${InputBase_1.inputBaseClasses.disabled}`]: {
-        WebkitTextFillColor: 'unset',
-    },
-}));

package/cjs/components/AmountInput/AmountInputAdornment.style.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-const material_1 = require("@mui/material");
-const styles_1 = require("@mui/material/styles");
-exports.Button = (0, styles_1.styled)(material_1.Button)(({ theme }) => ({
-    padding: theme.spacing(0.5, 1, 0.625, 1),
-    lineHeight: 1.0715,
-    fontSize: '0.875rem',
-    minWidth: 'unset',
-}));

package/cjs/components/AmountInput/AmountInputEndAdornment.js

@@ -1,45 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AmountInputEndAdornment = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const material_1 = require("@mui/material");
-const big_js_1 = require("big.js");
-const react_hook_form_1 = require("react-hook-form");
-const react_i18next_1 = require("react-i18next");
-const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
-const utils_1 = require("../../utils");
-const AmountInputAdornment_style_1 = require("./AmountInputAdornment.style");
-const AmountInputEndAdornment = ({ formType }) => {
-    const { t } = (0, react_i18next_1.useTranslation)();
-    const { setValue } = (0, react_hook_form_1.useFormContext)();
-    const { getChainById } = (0, hooks_1.useChains)();
-    const [chainId, tokenAddress] = (0, react_hook_form_1.useWatch)({
-        name: [
-            providers_1.FormKeyHelper.getChainKey(formType),
-            providers_1.FormKeyHelper.getTokenKey(formType),
-        ],
-    });
-    const { data } = (0, hooks_1.useGasRecommendation)(chainId);
-    const { token, isLoading } = (0, hooks_1.useTokenAddressBalance)(chainId, tokenAddress);
-    const handleMax = () => {
-        const chain = getChainById(chainId);
-        let maxAmount = token?.amount;
-        if (chain?.nativeToken.address === tokenAddress &&
-            data?.available &&
-            data?.recommended) {
-            const tokenAmount = (0, big_js_1.default)(token?.amount ?? 0);
-            const recommendedAmount = (0, big_js_1.default)(data.recommended.amount)
-                .div(10 ** data.recommended.token.decimals)
-                .div(2);
-            if (tokenAmount.gt(recommendedAmount)) {
-                maxAmount = (0, utils_1.formatTokenAmount)(tokenAmount.minus(recommendedAmount).toString());
-            }
-        }
-        setValue(providers_1.FormKeyHelper.getAmountKey(formType), maxAmount || '', {
-            shouldTouch: true,
-        });
-    };
-    return ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", children: isLoading && tokenAddress ? ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: 46, height: 24, sx: { borderRadius: 0.5 } })) : formType === 'from' && token?.amount ? ((0, jsx_runtime_1.jsx)(AmountInputAdornment_style_1.Button, { onClick: handleMax, children: t('button.max') })) : null }));
-};
-exports.AmountInputEndAdornment = AmountInputEndAdornment;

package/cjs/components/AmountInput/AmountInputStartAdornment.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AmountInputStartAdornment = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_hook_form_1 = require("react-hook-form");
-const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
-const TokenAvatar_1 = require("../TokenAvatar");
-const AmountInputStartAdornment = ({ formType, }) => {
-    const [chainId, tokenAddress] = (0, react_hook_form_1.useWatch)({
-        name: [
-            providers_1.FormKeyHelper.getChainKey(formType),
-            providers_1.FormKeyHelper.getTokenKey(formType),
-        ],
-    });
-    const { chain } = (0, hooks_1.useChain)(chainId);
-    const { token } = (0, hooks_1.useToken)(chainId, tokenAddress);
-    const isSelected = !!(chain && token);
-    return isSelected ? ((0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatar, { token: token, chain: chain, sx: { marginLeft: 2 } })) : ((0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatarDefault, { sx: { marginLeft: 2 } }));
-};
-exports.AmountInputStartAdornment = AmountInputStartAdornment;

package/cjs/components/AmountInput/FormPriceHelperText.js

@@ -1,37 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FormPriceHelperTextBase = exports.FormPriceHelperText = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const material_1 = require("@mui/material");
-const react_hook_form_1 = require("react-hook-form");
-const react_i18next_1 = require("react-i18next");
-const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
-const utils_1 = require("../../utils");
-const FormPriceHelperText = ({ formType }) => {
-    const [chainId, tokenAddress] = (0, react_hook_form_1.useWatch)({
-        name: [
-            providers_1.FormKeyHelper.getChainKey(formType),
-            providers_1.FormKeyHelper.getTokenKey(formType),
-        ],
-    });
-    const { token, isLoading } = (0, hooks_1.useTokenAddressBalance)(chainId, tokenAddress);
-    return ((0, jsx_runtime_1.jsx)(exports.FormPriceHelperTextBase, { formType: formType, isLoading: isLoading, tokenAddress: tokenAddress, token: token }));
-};
-exports.FormPriceHelperText = FormPriceHelperText;
-const FormPriceHelperTextBase = ({ formType, isLoading, tokenAddress, token }) => {
-    const { t } = (0, react_i18next_1.useTranslation)();
-    const amount = (0, react_hook_form_1.useWatch)({
-        name: providers_1.FormKeyHelper.getAmountKey(formType),
-    });
-    const fromAmountTokenPrice = (0, utils_1.formatTokenPrice)(amount, token?.priceUSD);
-    return ((0, jsx_runtime_1.jsxs)(material_1.FormHelperText, { component: "div", sx: { display: 'flex', justifyContent: 'space-between', margin: 0 }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { color: fromAmountTokenPrice ? 'text.secondary' : 'grey.600', fontWeight: 400, fontSize: 12, marginLeft: 8, lineHeight: 1.3334, flex: 1, sx: {
-                    wordBreak: 'break-word',
-                    overflowWrap: 'break-word',
-                }, children: t(`format.currency`, {
-                    value: fromAmountTokenPrice,
-                }) }), isLoading && tokenAddress ? ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 48, height: 16, sx: { borderRadius: 0.25 } })) : token?.amount ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { fontWeight: 400, fontSize: 12, color: "text.secondary", lineHeight: 1.3334, pl: 0.25, children: `/ ${t(`format.number`, {
-                    value: (0, utils_1.formatTokenAmount)(token?.amount),
-                })}` })) : null] }));
-};
-exports.FormPriceHelperTextBase = FormPriceHelperTextBase;

package/cjs/components/AmountInput/index.js

@@ -1,17 +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("./AmountInput"), exports);

package/cjs/components/AppContainer.js

@@ -1,56 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AppContainer = exports.FlexContainer = exports.AppExpandedContainer = exports.maxHeight = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const material_1 = require("@mui/material");
-const styles_1 = require("@mui/material/styles");
-const providers_1 = require("../providers");
-const utils_1 = require("../utils");
-exports.maxHeight = 680;
-exports.AppExpandedContainer = (0, styles_1.styled)(material_1.Box, {
-    shouldForwardProp: (prop) => prop !== 'variant',
-})(({ variant }) => ({
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'start',
-    flex: 1,
-    height: variant === 'drawer' ? 'none' : exports.maxHeight,
-}));
-const RelativeContainer = (0, styles_1.styled)(material_1.Box, {
-    shouldForwardProp: (prop) => prop !== 'variant',
-})(({ theme, variant }) => ({
-    position: 'relative',
-    boxSizing: 'content-box',
-    width: '100%',
-    minWidth: 360,
-    maxWidth: 392,
-    maxHeight: variant === 'drawer' ? 'none' : exports.maxHeight,
-    background: theme.palette.background.default,
-    overflow: 'auto',
-    flex: 1,
-    zIndex: 0,
-}));
-const CssBaselineContainer = (0, styles_1.styled)(material_1.ScopedCssBaseline, {
-    shouldForwardProp: (prop) => prop !== 'variant',
-})(({ variant }) => ({
-    display: 'flex',
-    flex: 1,
-    flexDirection: 'column',
-    overflowX: 'clip',
-    margin: 0,
-    width: '100%',
-    maxHeight: variant === 'drawer' ? 'none' : exports.maxHeight,
-    overflowY: 'auto',
-    height: '100%',
-}));
-exports.FlexContainer = (0, styles_1.styled)(material_1.Container)({
-    display: 'flex',
-    flexDirection: 'column',
-    flex: 1,
-});
-const AppContainer = ({ children }) => {
-    // const ref = useRef<HTMLDivElement>(null);
-    const { containerStyle, variant, elementId } = (0, providers_1.useWidgetConfig)();
-    return ((0, jsx_runtime_1.jsx)(RelativeContainer, { sx: containerStyle, variant: variant, id: (0, utils_1.createElementId)(utils_1.ElementId.RelativeContainer, elementId), children: (0, jsx_runtime_1.jsx)(CssBaselineContainer, { id: (0, utils_1.createElementId)(utils_1.ElementId.ScrollableContainer, elementId), variant: variant, enableColorScheme: true, children: (0, jsx_runtime_1.jsx)(exports.FlexContainer, { disableGutters: true, children: children }) }) }));
-};
-exports.AppContainer = AppContainer;

package/cjs/components/BaseTransactionButton/BaseTransactionButton.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BaseTransactionButton = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const lab_1 = require("@mui/lab");
-const react_i18next_1 = require("react-i18next");
-const react_router_dom_1 = require("react-router-dom");
-const providers_1 = require("../../providers");
-const utils_1 = require("../../utils");
-const BaseTransactionButton = ({ onClick, text, disabled, loading, }) => {
-    const { t } = (0, react_i18next_1.useTranslation)();
-    const navigate = (0, react_router_dom_1.useNavigate)();
-    const { walletManagement } = (0, providers_1.useWidgetConfig)();
-    const { account, connect } = (0, providers_1.useWallet)();
-    const handleClick = async () => {
-        if (account.isActive) {
-            onClick?.();
-        }
-        else if (walletManagement) {
-            await connect();
-        }
-        else {
-            navigate(utils_1.navigationRoutes.selectWallet);
-        }
-    };
-    const getButtonText = () => {
-        if (account.isActive) {
-            if (text) {
-                return text;
-            }
-        }
-        return t(`button.connectWallet`);
-    };
-    return ((0, jsx_runtime_1.jsx)(lab_1.LoadingButton, { variant: "contained", color: "primary", onClick: handleClick, disabled: disabled, loading: loading, loadingPosition: "center", fullWidth: true, children: getButtonText() }));
-};
-exports.BaseTransactionButton = BaseTransactionButton;

package/cjs/components/BaseTransactionButton/index.js

@@ -1,20 +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 });
-exports.BaseTransactionButton = void 0;
-var BaseTransactionButton_1 = require("./BaseTransactionButton");
-Object.defineProperty(exports, "BaseTransactionButton", { enumerable: true, get: function () { return BaseTransactionButton_1.BaseTransactionButton; } });
-__exportStar(require("./types"), exports);

package/cjs/components/BaseTransactionButton/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/cjs/components/BottomSheet/BottomSheet.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BottomSheet = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const material_1 = require("@mui/material");
-const react_1 = require("react");
-const hooks_1 = require("../../hooks");
-const Dialog_1 = require("../Dialog");
-exports.BottomSheet = (0, react_1.forwardRef)(({ elementRef, children, open, onClose }, ref) => {
-    const getContainer = (0, hooks_1.useGetScrollableContainer)();
-    const openRef = (0, react_1.useRef)(open);
-    const [drawerOpen, setDrawerOpen] = (0, react_1.useState)(open);
-    const close = (0, react_1.useCallback)(() => {
-        setDrawerOpen(false);
-        openRef.current = false;
-        onClose?.();
-    }, [onClose]);
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        isOpen: () => openRef.current,
-        open: () => {
-            setDrawerOpen(true);
-            openRef.current = true;
-        },
-        close,
-    }), [close]);
-    return ((0, jsx_runtime_1.jsx)(material_1.Drawer, { container: getContainer, ref: elementRef, anchor: "bottom", open: drawerOpen, onClose: close, ModalProps: Dialog_1.modalProps, PaperProps: Dialog_1.paperProps, BackdropProps: Dialog_1.backdropProps, disableAutoFocus: true, children: children }));
-});

package/cjs/components/BottomSheet/index.js

@@ -1,18 +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("./BottomSheet"), exports);
-__exportStar(require("./types"), exports);

package/cjs/components/BottomSheet/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/cjs/components/Card/Card.js

@@ -1,53 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = void 0;
-const material_1 = require("@mui/material");
-const Badge_1 = require("@mui/material/Badge");
-const styles_1 = require("@mui/material/styles");
-const getBackgroundColor = (theme, variant, selectionColor) => variant === 'selected'
-    ? selectionColor === 'primary'
-        ? theme.palette.mode === 'light'
-            ? (0, styles_1.alpha)(theme.palette.primary.main, 0.04)
-            : (0, styles_1.alpha)(theme.palette.primary.main, 0.42)
-        : (0, styles_1.alpha)(theme.palette.secondary.main, theme.palette.mode === 'light' ? 0.08 : 0.12)
-    : theme.palette.background.paper;
-exports.Card = (0, styles_1.styled)(material_1.Box, {
-    shouldForwardProp: (prop) => !['variant', 'indented', 'selectionColor', 'pointerEvents'].includes(prop),
-})(({ theme, variant, selectionColor = 'primary', indented, pointerEvents, onClick, }) => {
-    const backgroundColor = getBackgroundColor(theme, variant, selectionColor);
-    const backgroundHoverColor = onClick
-        ? theme.palette.mode === 'light'
-            ? (0, styles_1.darken)(backgroundColor, 0.02)
-            : (0, styles_1.lighten)(backgroundColor, 0.02)
-        : backgroundColor;
-    return {
-        backgroundColor,
-        border: `1px solid`,
-        borderColor: variant === 'error'
-            ? theme.palette.error.main
-            : variant === 'selected'
-                ? selectionColor === 'primary'
-                    ? theme.palette.primary.main
-                    : (0, styles_1.alpha)(theme.palette.secondary.main, 0.48)
-                : theme.palette.mode === 'light'
-                    ? theme.palette.grey[300]
-                    : theme.palette.grey[800],
-        borderRadius: theme.shape.borderRadius,
-        overflow: 'hidden',
-        position: 'relative',
-        padding: indented ? theme.spacing(2) : 0,
-        boxSizing: 'border-box',
-        '&:hover': {
-            cursor: onClick ? 'pointer' : 'default',
-            backgroundColor: backgroundHoverColor,
-        },
-        [`&:hover .${Badge_1.badgeClasses.badge} > div`]: {
-            borderColor: backgroundHoverColor,
-        },
-        transition: theme.transitions.create(['background-color'], {
-            duration: theme.transitions.duration.enteringScreen,
-            easing: theme.transitions.easing.easeOut,
-        }),
-        pointerEvents,
-    };
-});

package/cjs/components/Card/CardHeader.js

@@ -1,23 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardHeader = void 0;
-const material_1 = require("@mui/material");
-const CardHeader_1 = require("@mui/material/CardHeader");
-const styles_1 = require("@mui/material/styles");
-exports.CardHeader = (0, styles_1.styled)(material_1.CardHeader)(({ theme }) => ({
-    [`.${CardHeader_1.cardHeaderClasses.action}`]: {
-        marginTop: -2,
-        alignSelf: 'center',
-    },
-    [`.${CardHeader_1.cardHeaderClasses.title}`]: {
-        fontWeight: '500',
-        fontSize: '1.125rem',
-        lineHeight: '1.2778',
-        color: theme.palette.text.primary,
-    },
-    [`.${CardHeader_1.cardHeaderClasses.subheader}`]: {
-        fontWeight: '400',
-        fontSize: '0.75rem',
-        color: theme.palette.text.secondary,
-    },
-}));

package/cjs/components/Card/CardIconButton.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardIconButton = void 0;
-const material_1 = require("@mui/material");
-const styles_1 = require("@mui/material/styles");
-exports.CardIconButton = (0, styles_1.styled)(material_1.IconButton)(({ theme }) => {
-    const backgroundColor = theme.palette.mode === 'light'
-        ? theme.palette.common.black
-        : theme.palette.common.white;
-    return {
-        padding: theme.spacing(0.5),
-        backgroundColor: (0, styles_1.alpha)(backgroundColor, 0.04),
-        '&:hover': {
-            backgroundColor: (0, styles_1.alpha)(backgroundColor, 0.08),
-        },
-    };
-});

package/cjs/components/Card/CardLabel.js

@@ -1,45 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardLabelTypography = exports.CardLabel = void 0;
-const material_1 = require("@mui/material");
-const styles_1 = require("@mui/material/styles");
-exports.CardLabel = (0, styles_1.styled)(material_1.Box, {
-    shouldForwardProp: (prop) => prop !== 'type',
-})(({ theme, type }) => ({
-    backgroundColor: type === 'active'
-        ? theme.palette.mode === 'light'
-            ? theme.palette.secondary.main
-            : (0, styles_1.alpha)(theme.palette.secondary.main, 0.32)
-        : type?.includes('insurance')
-            ? (0, styles_1.alpha)(theme.palette.success.main, theme.palette.mode === 'light' ? 0.12 : 0.24)
-            : theme.palette.mode === 'light'
-                ? (0, styles_1.alpha)(theme.palette.common.black, 0.12)
-                : (0, styles_1.alpha)(theme.palette.common.white, 0.16),
-    borderRadius: theme.shape.borderRadius,
-    color: type?.includes('insurance')
-        ? (0, styles_1.lighten)(theme.palette.success.main, theme.palette.mode === 'light' ? 0 : 0.24)
-        : theme.palette.text.primary,
-    padding: type === 'insurance' ? theme.spacing(0, 1.5) : 0,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    height: 24,
-    minWidth: 24,
-    userSelect: 'none',
-    fontSize: '1rem',
-    marginRight: theme.spacing(1),
-}));
-exports.CardLabelTypography = (0, styles_1.styled)(material_1.Typography, {
-    shouldForwardProp: (prop) => prop !== 'type',
-})(({ theme, type }) => ({
-    padding: type === 'icon'
-        ? theme.spacing(0.75, 0, 0.75, 0.75)
-        : theme.spacing(0.75, 1.5),
-    fontSize: 12,
-    lineHeight: 1,
-    fontWeight: '600',
-    textTransform: 'lowercase',
-    '&::first-letter': {
-        textTransform: 'uppercase',
-    },
-}));

package/cjs/components/Card/CardTitle.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardTitle = void 0;
-const material_1 = require("@mui/material");
-const styles_1 = require("@mui/material/styles");
-exports.CardTitle = (0, styles_1.styled)(material_1.Typography, {
-    shouldForwardProp: (prop) => !['required'].includes(prop),
-})(({ theme, required }) => ({
-    fontSize: '0.875rem',
-    lineHeight: '1.286',
-    letterSpacing: '0.01071em',
-    fontWeight: 700,
-    padding: theme.spacing(1.75, 2, 0, 2),
-    '&:after': {
-        content: required ? '" *"' : 'none',
-        color: theme.palette.error.main,
-    },
-}));

package/cjs/components/Card/index.js

@@ -1,21 +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("./Card"), exports);
-__exportStar(require("./CardHeader"), exports);
-__exportStar(require("./CardIconButton"), exports);
-__exportStar(require("./CardLabel"), exports);
-__exportStar(require("./CardTitle"), exports);

package/cjs/components/ChainSelect/ChainSelect.js

@@ -1,37 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChainSelect = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const material_1 = require("@mui/material");
-const react_hook_form_1 = require("react-hook-form");
-const react_router_dom_1 = require("react-router-dom");
-const providers_1 = require("../../providers");
-const stores_1 = require("../../stores");
-const utils_1 = require("../../utils");
-const ChainSelect_style_1 = require("./ChainSelect.style");
-const useChainSelect_1 = require("./useChainSelect");
-const ChainSelect = ({ formType }) => {
-    const navigate = (0, react_router_dom_1.useNavigate)();
-    const { chainOrder, chains, getChains, isLoading, setChainOrder, setCurrentChain, } = (0, useChainSelect_1.useChainSelect)(formType);
-    const [chainId] = (0, react_hook_form_1.useWatch)({
-        name: [providers_1.FormKeyHelper.getChainKey(formType)],
-    });
-    const hasChainInOrderedList = chainOrder.includes(chainId);
-    // If we don't have a chain in the ordered chain list we should add it.
-    if (!hasChainInOrderedList) {
-        setChainOrder(chainId);
-    }
-    const showAllChains = () => {
-        navigate(utils_1.navigationRoutes[`${formType}Chain`]);
-    };
-    const chainsToHide = (chains?.length ?? 0) - stores_1.maxChainToOrder;
-    return ((0, jsx_runtime_1.jsxs)(ChainSelect_style_1.ChainContainer, { children: [isLoading
-                ? Array.from({ length: stores_1.maxChainToOrder + 1 }).map((_, index) => ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: 56, height: 56, sx: { borderRadius: 1 } }, index)))
-                : getChains().map((chain) => ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: chain.name, placement: "top", enterDelay: 400, arrow: true, children: (0, jsx_runtime_1.jsx)(ChainSelect_style_1.ChainCard, { onClick: () => setCurrentChain(chain.id), variant: chainId === chain.id ? 'selected' : 'default', children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { src: chain.logoURI, alt: chain.key, sx: { width: 40, height: 40 }, children: chain.name[0] }) }) }, chain.id))), chainsToHide > 0 ? ((0, jsx_runtime_1.jsx)(ChainSelect_style_1.ChainCard, { onClick: showAllChains, children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
-                        width: 40,
-                        height: 40,
-                        display: 'grid',
-                        placeItems: 'center',
-                    }, children: (0, jsx_runtime_1.jsxs)(material_1.Typography, { fontWeight: 500, children: ["+", chainsToHide] }) }) })) : null] }));
-};
-exports.ChainSelect = ChainSelect;