@lifi/widget 2.6.0 → 2.6.2

package/cjs/components/BaseTransactionButton/BaseTransactionButton.d.ts

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

package/cjs/components/{DefaultTransactionButton/DefaultTransactionButton.js → BaseTransactionButton/BaseTransactionButton.js}

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DefaultTransactionButton = void 0;
+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 DefaultTransactionButton = ({ onClick, text, disabled, loading }) => {
+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)();
@@ -33,4 +33,4 @@ const DefaultTransactionButton = ({ onClick, text, disabled, loading }) => {
     };
     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.DefaultTransactionButton = DefaultTransactionButton;
+exports.BaseTransactionButton = BaseTransactionButton;

package/cjs/components/BaseTransactionButton/index.d.ts

@@ -0,0 +1,2 @@
+export { BaseTransactionButton } from './BaseTransactionButton';
+export * from './types';

package/cjs/components/{DefaultTransactionButton → BaseTransactionButton}/index.js

@@ -14,7 +14,7 @@ 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.DefaultTransactionButton = void 0;
-var DefaultTransactionButton_1 = require("./DefaultTransactionButton");
-Object.defineProperty(exports, "DefaultTransactionButton", { enumerable: true, get: function () { return DefaultTransactionButton_1.DefaultTransactionButton; } });
+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/{DefaultTransactionButton → BaseTransactionButton}/types.d.ts

@@ -1,4 +1,4 @@
-export interface DefaultTransactionButtonProps {
+export interface BaseTransactionButtonProps {
     onClick?(): void;
     text?: string;
     disabled?: boolean;

package/cjs/components/GasMessage/GasMessage.js

@@ -4,15 +4,12 @@ exports.GasMessage = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
 const FundsSufficiencyMessage_1 = require("./FundsSufficiencyMessage");
 const GasSufficiencyMessage_1 = require("./GasSufficiencyMessage");
 const GasMessage = ({ route, ...props }) => {
     const { insufficientGas } = (0, hooks_1.useGasSufficiency)(route);
     const { insufficientFromToken } = (0, hooks_1.useFromTokenSufficiency)(route);
-    const { sdkConfig } = (0, providers_1.useWidgetConfig)();
-    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
-    const validInsufficientGas = insufficientGas?.length && !isMultisigSigner;
+    const validInsufficientGas = insufficientGas?.length;
     return ((0, jsx_runtime_1.jsx)(material_1.Collapse, { timeout: 225, in: Boolean(insufficientFromToken || validInsufficientGas), unmountOnExit: true, mountOnEnter: true, children: (0, jsx_runtime_1.jsx)(material_1.Box, { ...props, children: insufficientFromToken ? ((0, jsx_runtime_1.jsx)(FundsSufficiencyMessage_1.FundsSufficiencyMessage, {})) : validInsufficientGas ? ((0, jsx_runtime_1.jsx)(GasSufficiencyMessage_1.GasSufficiencyMessage, { insufficientGas: insufficientGas })) : null }) }));
 };
 exports.GasMessage = GasMessage;

package/cjs/components/Step/CircularProgress.style.js

@@ -4,20 +4,6 @@ exports.CircularProgressPending = exports.CircularIcon = void 0;
 const material_1 = require("@mui/material");
 const CircularProgress_1 = require("@mui/material/CircularProgress");
 const styles_1 = require("@mui/material/styles");
-const circleAnimation = (0, styles_1.keyframes)({
-    '0%': {
-        strokeDashoffset: 129,
-        transform: 'rotate(0)',
-    },
-    '50%': {
-        strokeDashoffset: 56,
-        transform: 'rotate(45deg)',
-    },
-    '100%': {
-        strokeDashoffset: 129,
-        transform: 'rotate(360deg)',
-    },
-});
 const getStatusColor = (theme, status, substatus) => {
     switch (status) {
         case 'ACTION_REQUIRED':
@@ -51,20 +37,36 @@ exports.CircularIcon = (0, styles_1.styled)(material_1.Box, {
     height: 32,
     borderRadius: '50%',
 }));
-exports.CircularProgressPending = (0, styles_1.styled)(material_1.CircularProgress)(({ theme }) => ({
-    color: theme.palette.mode === 'light'
-        ? theme.palette.primary.main
-        : theme.palette.primary.light,
-    animationDuration: '3s',
-    position: 'absolute',
-    left: '-2px',
-    [`.${CircularProgress_1.circularProgressClasses.circle}`]: {
-        animationDuration: '2s',
-        animationTimingFunction: 'linear',
-        animationName: circleAnimation,
-        strokeDasharray: 129,
-        strokeDashoffset: 129,
-        strokeLinecap: 'round',
-        transformOrigin: '100% 100%',
-    },
-}));
+const circleAnimation = (0, styles_1.keyframes) `
+  0% {
+    stroke-dashoffset: 129;
+    transform: rotate(0);
+  }
+  50% {
+    stroke-dashoffset: 56;
+    transform: rotate(45deg);
+  };
+  100% {
+    stroke-dashoffset: 129;
+    transform: rotate(360deg);
+  }
+`;
+// This `styled()` function invokes keyframes. `styled-components` only supports keyframes
+// in string templates. Do not convert these styles in JS object as it will break.
+exports.CircularProgressPending = (0, styles_1.styled)(material_1.CircularProgress) `
+  color: ${({ theme }) => theme.palette.mode === 'light'
+    ? theme.palette.primary.main
+    : theme.palette.primary.light};
+  animation-duration: '3s';
+  position: 'absolute';
+  left: '-2px';
+  .${CircularProgress_1.circularProgressClasses.circle} {
+    animation-duration: '2s';
+    animation-timing-function: 'linear';
+    animation-name: ${circleAnimation};
+    stroke-dasharray: 129;
+    stroke-dashoffset: 129;
+    stroke-linecap: 'round';
+    transform-origin: '100% 100%';
+  }
+`;

package/cjs/config/theme.js

@@ -45,16 +45,16 @@ const shape = {
     borderRadius: 12,
     borderRadiusSecondary: 8,
 };
-const enterKeyframe = (0, styles_1.keyframes)({
-    '0%': {
-        transform: 'scale(0)',
-        opacity: 0.05,
-    },
-    '100%': {
-        transform: 'scale(1)',
-        opacity: 0.1,
-    },
-});
+const enterKeyframe = (0, styles_1.keyframes) `
+  0% {
+    transform: scale(0);
+    opacity: 0.05;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 0.1;
+  }
+`;
 const createTheme = (mode, theme = {}) => {
     const primaryMainColor = theme.palette?.primary?.main ??
         palette.primary.main;
@@ -120,15 +120,15 @@ const createTheme = (mode, theme = {}) => {
             },
             MuiButtonBase: {
                 styleOverrides: {
-                    root: {
-                        [`& .${ButtonBase_1.touchRippleClasses.ripple}.${ButtonBase_1.touchRippleClasses.rippleVisible}`]: {
-                            animationName: enterKeyframe,
-                        },
-                        [`& .${ButtonBase_1.touchRippleClasses.ripple}.${ButtonBase_1.touchRippleClasses.rippleVisible}`]: {
-                            opacity: 0.1,
-                            animationName: enterKeyframe,
-                        },
-                    },
+                    // This `css()` function invokes keyframes. `styled-components` only supports keyframes
+                    // in string templates. Do not convert these styles in JS object as it will break.
+                    root: (0, styles_1.css) `
+            &
+              .${ButtonBase_1.touchRippleClasses.ripple}.${ButtonBase_1.touchRippleClasses.rippleVisible} {
+              opacity: 0.1;
+              animation-name: ${enterKeyframe};
+            }
+          `,
                 },
             },
             MuiButton: {

package/cjs/config/version.d.ts

@@ -1,2 +1,2 @@
 export declare const name = "@lifi/widget";
-export declare const version = "2.6.0";
+export declare const version = "2.6.2";

package/cjs/config/version.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.version = exports.name = void 0;
 exports.name = '@lifi/widget';
-exports.version = '2.6.0';
+exports.version = '2.6.2';

package/cjs/hooks/useGasSufficiency.js

@@ -11,6 +11,8 @@ const useGasSufficiency = (route) => {
     const { account } = (0, providers_1.useWallet)();
     const { getChainById } = (0, _1.useChains)();
     const getTokenBalancesWithRetry = (0, _1.useGetTokenBalancesWithRetry)(account.signer?.provider);
+    const { sdkConfig } = (0, providers_1.useWidgetConfig)();
+    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
     const { enabledAutoRefuel } = (0, stores_1.useSettings)(['enabledAutoRefuel']);
     const { enabled, isLoading: isRefuelLoading } = (0, _1.useGasRefuel)();
     const enabledRefuel = enabled && enabledAutoRefuel;
@@ -25,7 +27,7 @@ const useGasSufficiency = (route) => {
         const gasCosts = route.steps
             .filter((step) => !step.execution || step.execution.status !== 'DONE')
             .reduce((groupedGasCosts, step) => {
-            if (step.estimate.gasCosts) {
+            if (step.estimate.gasCosts && !isMultisigSigner) {
                 const { token } = step.estimate.gasCosts[0];
                 const gasCostAmount = step.estimate.gasCosts
                     .reduce((amount, gasCost) => amount.plus((0, big_js_1.default)(gasCost.amount || 0)), (0, big_js_1.default)(0))

package/cjs/pages/MainPage/ReviewButton.js

@@ -5,7 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_hook_form_1 = require("react-hook-form");
 const react_i18next_1 = require("react-i18next");
 const react_router_dom_1 = require("react-router-dom");
-const DefaultTransactionButton_1 = require("../../components/DefaultTransactionButton");
+const BaseTransactionButton_1 = require("../../components/BaseTransactionButton");
 const hooks_1 = require("../../hooks");
 const providers_1 = require("../../providers");
 const stores_1 = require("../../stores");
@@ -57,6 +57,6 @@ const ReviewButton = () => {
             }
         }
     };
-    return ((0, jsx_runtime_1.jsx)(DefaultTransactionButton_1.DefaultTransactionButton, { text: getButtonText(), onClick: handleClick, disabled: currentRoute && (isValidating || !isValid) }));
+    return ((0, jsx_runtime_1.jsx)(BaseTransactionButton_1.BaseTransactionButton, { text: getButtonText(), onClick: handleClick, disabled: currentRoute && (isValidating || !isValid) }));
 };
 exports.ReviewButton = ReviewButton;

package/cjs/pages/TransactionPage/StartTransactionButton.js

@@ -2,17 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StartInsurableTransactionButton = exports.StartTransactionButton = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const DefaultTransactionButton_1 = require("../../components/DefaultTransactionButton");
+const BaseTransactionButton_1 = require("../../components/BaseTransactionButton");
 const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
 const stores_1 = require("../../stores");
 const StartTransactionButton = ({ onClick, route, text, loading, }) => {
-    const { sdkConfig } = (0, providers_1.useWidgetConfig)();
-    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
     const { insufficientGas, isInitialLoading: isGasSufficiencyLoading } = (0, hooks_1.useGasSufficiency)(route);
     const { insufficientFromToken, isInitialLoading: isFromTokenSufficiencyLoading, } = (0, hooks_1.useFromTokenSufficiency)(route);
-    const shouldDisableButton = !isMultisigSigner && (insufficientFromToken || !!insufficientGas?.length);
-    return ((0, jsx_runtime_1.jsx)(DefaultTransactionButton_1.DefaultTransactionButton, { onClick: onClick, text: text, disabled: shouldDisableButton, loading: isFromTokenSufficiencyLoading || isGasSufficiencyLoading || loading }));
+    const shouldDisableButton = insufficientFromToken || !!insufficientGas?.length;
+    return ((0, jsx_runtime_1.jsx)(BaseTransactionButton_1.BaseTransactionButton, { onClick: onClick, text: text, disabled: shouldDisableButton, loading: isFromTokenSufficiencyLoading || isGasSufficiencyLoading || loading }));
 };
 exports.StartTransactionButton = StartTransactionButton;
 const StartInsurableTransactionButton = ({ onClick, text, route, loading, disabled, insurableRouteId }) => {

package/cjs/pages/TransactionPage/types.d.ts

@@ -1,6 +1,6 @@
 import type { Route } from '@lifi/sdk';
-import type { DefaultTransactionButtonProps } from '../../components/DefaultTransactionButton';
-export interface StartTransactionButtonProps extends DefaultTransactionButtonProps {
+import type { BaseTransactionButtonProps } from '../../components/BaseTransactionButton';
+export interface StartTransactionButtonProps extends BaseTransactionButtonProps {
     route?: Route;
     insurableRouteId: string;
 }

package/components/BaseTransactionButton/BaseTransactionButton.d.ts

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

package/components/{DefaultTransactionButton/DefaultTransactionButton.js → BaseTransactionButton/BaseTransactionButton.js}

@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
 import { useWallet, useWidgetConfig } from '../../providers';
 import { navigationRoutes } from '../../utils';
-export const DefaultTransactionButton = ({ onClick, text, disabled, loading }) => {
+export const BaseTransactionButton = ({ onClick, text, disabled, loading, }) => {
     const { t } = useTranslation();
     const navigate = useNavigate();
     const { walletManagement } = useWidgetConfig();

package/components/BaseTransactionButton/index.d.ts

@@ -0,0 +1,2 @@
+export { BaseTransactionButton } from './BaseTransactionButton';
+export * from './types';

package/components/BaseTransactionButton/index.js

@@ -0,0 +1,2 @@
+export { BaseTransactionButton } from './BaseTransactionButton';
+export * from './types';

package/components/{DefaultTransactionButton → BaseTransactionButton}/types.d.ts

@@ -1,4 +1,4 @@
-export interface DefaultTransactionButtonProps {
+export interface BaseTransactionButtonProps {
     onClick?(): void;
     text?: string;
     disabled?: boolean;

package/components/GasMessage/GasMessage.js

@@ -1,14 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Box, Collapse } from '@mui/material';
 import { useFromTokenSufficiency, useGasSufficiency } from '../../hooks';
-import { useWidgetConfig } from '../../providers';
 import { FundsSufficiencyMessage } from './FundsSufficiencyMessage';
 import { GasSufficiencyMessage } from './GasSufficiencyMessage';
 export const GasMessage = ({ route, ...props }) => {
     const { insufficientGas } = useGasSufficiency(route);
     const { insufficientFromToken } = useFromTokenSufficiency(route);
-    const { sdkConfig } = useWidgetConfig();
-    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
-    const validInsufficientGas = insufficientGas?.length && !isMultisigSigner;
+    const validInsufficientGas = insufficientGas?.length;
     return (_jsx(Collapse, { timeout: 225, in: Boolean(insufficientFromToken || validInsufficientGas), unmountOnExit: true, mountOnEnter: true, children: _jsx(Box, { ...props, children: insufficientFromToken ? (_jsx(FundsSufficiencyMessage, {})) : validInsufficientGas ? (_jsx(GasSufficiencyMessage, { insufficientGas: insufficientGas })) : null }) }));
 };

package/components/Step/CircularProgress.style.js

@@ -1,20 +1,6 @@
 import { Box, CircularProgress as MuiCircularProgress } from '@mui/material';
 import { circularProgressClasses } from '@mui/material/CircularProgress';
 import { alpha, keyframes, styled } from '@mui/material/styles';
-const circleAnimation = keyframes({
-    '0%': {
-        strokeDashoffset: 129,
-        transform: 'rotate(0)',
-    },
-    '50%': {
-        strokeDashoffset: 56,
-        transform: 'rotate(45deg)',
-    },
-    '100%': {
-        strokeDashoffset: 129,
-        transform: 'rotate(360deg)',
-    },
-});
 const getStatusColor = (theme, status, substatus) => {
     switch (status) {
         case 'ACTION_REQUIRED':
@@ -48,20 +34,36 @@ export const CircularIcon = styled(Box, {
     height: 32,
     borderRadius: '50%',
 }));
-export const CircularProgressPending = styled(MuiCircularProgress)(({ theme }) => ({
-    color: theme.palette.mode === 'light'
-        ? theme.palette.primary.main
-        : theme.palette.primary.light,
-    animationDuration: '3s',
-    position: 'absolute',
-    left: '-2px',
-    [`.${circularProgressClasses.circle}`]: {
-        animationDuration: '2s',
-        animationTimingFunction: 'linear',
-        animationName: circleAnimation,
-        strokeDasharray: 129,
-        strokeDashoffset: 129,
-        strokeLinecap: 'round',
-        transformOrigin: '100% 100%',
-    },
-}));
+const circleAnimation = keyframes `
+  0% {
+    stroke-dashoffset: 129;
+    transform: rotate(0);
+  }
+  50% {
+    stroke-dashoffset: 56;
+    transform: rotate(45deg);
+  };
+  100% {
+    stroke-dashoffset: 129;
+    transform: rotate(360deg);
+  }
+`;
+// This `styled()` function invokes keyframes. `styled-components` only supports keyframes
+// in string templates. Do not convert these styles in JS object as it will break.
+export const CircularProgressPending = styled(MuiCircularProgress) `
+  color: ${({ theme }) => theme.palette.mode === 'light'
+    ? theme.palette.primary.main
+    : theme.palette.primary.light};
+  animation-duration: '3s';
+  position: 'absolute';
+  left: '-2px';
+  .${circularProgressClasses.circle} {
+    animation-duration: '2s';
+    animation-timing-function: 'linear';
+    animation-name: ${circleAnimation};
+    stroke-dasharray: 129;
+    stroke-dashoffset: 129;
+    stroke-linecap: 'round';
+    transform-origin: '100% 100%';
+  }
+`;

package/config/theme.js

@@ -2,7 +2,7 @@ import { loadingButtonClasses } from '@mui/lab/LoadingButton';
 import { touchRippleClasses } from '@mui/material/ButtonBase';
 import { dialogActionsClasses } from '@mui/material/DialogActions';
 import { common } from '@mui/material/colors';
-import { alpha, createTheme as createMuiTheme, darken, getContrastRatio, keyframes, lighten, } from '@mui/material/styles';
+import { alpha, createTheme as createMuiTheme, css, darken, getContrastRatio, keyframes, lighten, } from '@mui/material/styles';
 const palette = {
     primary: {
         main: '#3F49E1',
@@ -42,16 +42,16 @@ const shape = {
     borderRadius: 12,
     borderRadiusSecondary: 8,
 };
-const enterKeyframe = keyframes({
-    '0%': {
-        transform: 'scale(0)',
-        opacity: 0.05,
-    },
-    '100%': {
-        transform: 'scale(1)',
-        opacity: 0.1,
-    },
-});
+const enterKeyframe = keyframes `
+  0% {
+    transform: scale(0);
+    opacity: 0.05;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 0.1;
+  }
+`;
 export const createTheme = (mode, theme = {}) => {
     const primaryMainColor = theme.palette?.primary?.main ??
         palette.primary.main;
@@ -117,15 +117,15 @@ export const createTheme = (mode, theme = {}) => {
             },
             MuiButtonBase: {
                 styleOverrides: {
-                    root: {
-                        [`& .${touchRippleClasses.ripple}.${touchRippleClasses.rippleVisible}`]: {
-                            animationName: enterKeyframe,
-                        },
-                        [`& .${touchRippleClasses.ripple}.${touchRippleClasses.rippleVisible}`]: {
-                            opacity: 0.1,
-                            animationName: enterKeyframe,
-                        },
-                    },
+                    // This `css()` function invokes keyframes. `styled-components` only supports keyframes
+                    // in string templates. Do not convert these styles in JS object as it will break.
+                    root: css `
+            &
+              .${touchRippleClasses.ripple}.${touchRippleClasses.rippleVisible} {
+              opacity: 0.1;
+              animation-name: ${enterKeyframe};
+            }
+          `,
                 },
             },
             MuiButton: {

package/config/version.d.ts

@@ -1,2 +1,2 @@
 export declare const name = "@lifi/widget";
-export declare const version = "2.6.0";
+export declare const version = "2.6.2";

package/config/version.js

@@ -1,2 +1,2 @@
 export const name = '@lifi/widget';
-export const version = '2.6.0';
+export const version = '2.6.2';

package/hooks/useGasSufficiency.js

@@ -1,13 +1,15 @@
 import { useQuery } from '@tanstack/react-query';
 import Big from 'big.js';
 import { useChains, useGasRefuel, useGetTokenBalancesWithRetry } from '.';
-import { useWallet } from '../providers';
+import { useWallet, useWidgetConfig } from '../providers';
 import { useSettings } from '../stores';
 const refetchInterval = 30000;
 export const useGasSufficiency = (route) => {
     const { account } = useWallet();
     const { getChainById } = useChains();
     const getTokenBalancesWithRetry = useGetTokenBalancesWithRetry(account.signer?.provider);
+    const { sdkConfig } = useWidgetConfig();
+    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
     const { enabledAutoRefuel } = useSettings(['enabledAutoRefuel']);
     const { enabled, isLoading: isRefuelLoading } = useGasRefuel();
     const enabledRefuel = enabled && enabledAutoRefuel;
@@ -22,7 +24,7 @@ export const useGasSufficiency = (route) => {
         const gasCosts = route.steps
             .filter((step) => !step.execution || step.execution.status !== 'DONE')
             .reduce((groupedGasCosts, step) => {
-            if (step.estimate.gasCosts) {
+            if (step.estimate.gasCosts && !isMultisigSigner) {
                 const { token } = step.estimate.gasCosts[0];
                 const gasCostAmount = step.estimate.gasCosts
                     .reduce((amount, gasCost) => amount.plus(Big(gasCost.amount || 0)), Big(0))

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget",
-  "version": "2.6.0",
+  "version": "2.6.2",
   "description": "LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.",
   "main": "./cjs/index.js",
   "module": "./index.js",

package/pages/MainPage/ReviewButton.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useFormState } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
-import { DefaultTransactionButton } from '../../components/DefaultTransactionButton';
+import { BaseTransactionButton } from '../../components/BaseTransactionButton';
 import { useRoutes } from '../../hooks';
 import { useWidgetConfig } from '../../providers';
 import { useSetExecutableRoute, useSplitSubvariantStore } from '../../stores';
@@ -54,5 +54,5 @@ export const ReviewButton = () => {
             }
         }
     };
-    return (_jsx(DefaultTransactionButton, { text: getButtonText(), onClick: handleClick, disabled: currentRoute && (isValidating || !isValid) }));
+    return (_jsx(BaseTransactionButton, { text: getButtonText(), onClick: handleClick, disabled: currentRoute && (isValidating || !isValid) }));
 };

package/pages/TransactionPage/StartTransactionButton.js

@@ -1,15 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { DefaultTransactionButton } from '../../components/DefaultTransactionButton';
+import { BaseTransactionButton } from '../../components/BaseTransactionButton';
 import { useFromTokenSufficiency, useGasSufficiency, useRoutes, } from '../../hooks';
-import { useWidgetConfig } from '../../providers';
 import { useRouteExecutionStore } from '../../stores';
 export const StartTransactionButton = ({ onClick, route, text, loading, }) => {
-    const { sdkConfig } = useWidgetConfig();
-    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
     const { insufficientGas, isInitialLoading: isGasSufficiencyLoading } = useGasSufficiency(route);
     const { insufficientFromToken, isInitialLoading: isFromTokenSufficiencyLoading, } = useFromTokenSufficiency(route);
-    const shouldDisableButton = !isMultisigSigner && (insufficientFromToken || !!insufficientGas?.length);
-    return (_jsx(DefaultTransactionButton, { onClick: onClick, text: text, disabled: shouldDisableButton, loading: isFromTokenSufficiencyLoading || isGasSufficiencyLoading || loading }));
+    const shouldDisableButton = insufficientFromToken || !!insufficientGas?.length;
+    return (_jsx(BaseTransactionButton, { onClick: onClick, text: text, disabled: shouldDisableButton, loading: isFromTokenSufficiencyLoading || isGasSufficiencyLoading || loading }));
 };
 export const StartInsurableTransactionButton = ({ onClick, text, route, loading, disabled, insurableRouteId }) => {
     const routeExecution = useRouteExecutionStore((state) => state.routes[insurableRouteId]);

package/pages/TransactionPage/types.d.ts

@@ -1,6 +1,6 @@
 import type { Route } from '@lifi/sdk';
-import type { DefaultTransactionButtonProps } from '../../components/DefaultTransactionButton';
-export interface StartTransactionButtonProps extends DefaultTransactionButtonProps {
+import type { BaseTransactionButtonProps } from '../../components/BaseTransactionButton';
+export interface StartTransactionButtonProps extends BaseTransactionButtonProps {
     route?: Route;
     insurableRouteId: string;
 }