@lifi/widget 3.0.0-alpha.10 → 3.0.0-alpha.12

package/AppProvider.tsx

@@ -4,15 +4,13 @@ import { Fragment } from 'react';
 import { MemoryRouter, useInRouterContext } from 'react-router-dom';
 import { queryClient } from './config/queryClient';
 import {
-  FormProvider,
   I18nProvider,
   ThemeProvider,
-  URLSearchParamsBuilder,
   WalletProvider,
   WidgetProvider,
   useWidgetConfig,
 } from './providers';
-import { StoreProvider } from './stores';
+import { StoreProvider, URLSearchParamsBuilder } from './stores';
 import type { WidgetConfigProps } from './types';
 
 export const AppProvider: React.FC<PropsWithChildren<WidgetConfigProps>> = ({
@@ -25,11 +23,9 @@ export const AppProvider: React.FC<PropsWithChildren<WidgetConfigProps>> = ({
         <ThemeProvider>
           <I18nProvider>
             <WalletProvider>
-              <FormProvider>
-                <StoreProvider config={config}>
-                  <AppRouter>{children}</AppRouter>
-                </StoreProvider>
-              </FormProvider>
+              <StoreProvider config={config}>
+                <AppRouter>{children}</AppRouter>
+              </StoreProvider>
             </WalletProvider>
           </I18nProvider>
         </ThemeProvider>

package/_cjs/AppProvider.js

@@ -9,14 +9,14 @@ const queryClient_1 = require("./config/queryClient");
 const providers_1 = require("./providers");
 const stores_1 = require("./stores");
 const AppProvider = ({ children, config, }) => {
-    return ((0, jsx_runtime_1.jsx)(react_query_1.QueryClientProvider, { client: queryClient_1.queryClient, children: (0, jsx_runtime_1.jsx)(providers_1.WidgetProvider, { config: config, children: (0, jsx_runtime_1.jsx)(providers_1.ThemeProvider, { children: (0, jsx_runtime_1.jsx)(providers_1.I18nProvider, { children: (0, jsx_runtime_1.jsx)(providers_1.WalletProvider, { children: (0, jsx_runtime_1.jsx)(providers_1.FormProvider, { children: (0, jsx_runtime_1.jsx)(stores_1.StoreProvider, { config: config, children: (0, jsx_runtime_1.jsx)(exports.AppRouter, { children: children }) }) }) }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(react_query_1.QueryClientProvider, { client: queryClient_1.queryClient, children: (0, jsx_runtime_1.jsx)(providers_1.WidgetProvider, { config: config, children: (0, jsx_runtime_1.jsx)(providers_1.ThemeProvider, { children: (0, jsx_runtime_1.jsx)(providers_1.I18nProvider, { children: (0, jsx_runtime_1.jsx)(providers_1.WalletProvider, { children: (0, jsx_runtime_1.jsx)(stores_1.StoreProvider, { config: config, children: (0, jsx_runtime_1.jsx)(exports.AppRouter, { children: children }) }) }) }) }) }) }));
 };
 exports.AppProvider = AppProvider;
 const AppRouter = ({ children }) => {
     const { buildUrl } = (0, providers_1.useWidgetConfig)();
     const inRouterContext = (0, react_router_dom_1.useInRouterContext)();
     const Router = inRouterContext ? react_1.Fragment : react_router_dom_1.MemoryRouter;
-    return ((0, jsx_runtime_1.jsxs)(Router, { children: [children, buildUrl ? (0, jsx_runtime_1.jsx)(providers_1.URLSearchParamsBuilder, {}) : null] }));
+    return ((0, jsx_runtime_1.jsxs)(Router, { children: [children, buildUrl ? (0, jsx_runtime_1.jsx)(stores_1.URLSearchParamsBuilder, {}) : null] }));
 };
 exports.AppRouter = AppRouter;
 //# sourceMappingURL=AppProvider.js.map

package/_cjs/AppProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppProvider.js","sourceRoot":"","sources":["../AppProvider.tsx"],"names":[],"mappings":";;;;AAAA,uDAA4D;AAE5D,iCAAiC;AACjC,uDAAoE;AACpE,sDAAmD;AACnD,2CAQqB;AACrB,qCAAyC;AAGlC,MAAM,WAAW,GAAmD,CAAC,EAC1E,QAAQ,EACR,MAAM,GACP,EAAE,EAAE;IACH,OAAO,CACL,uBAAC,iCAAmB,IAAC,MAAM,EAAE,yBAAW,YACtC,uBAAC,0BAAc,IAAC,MAAM,EAAE,MAAM,YAC5B,uBAAC,yBAAa,cACZ,uBAAC,wBAAY,cACX,uBAAC,0BAAc,cACb,uBAAC,wBAAY,cACX,uBAAC,sBAAa,IAAC,MAAM,EAAE,MAAM,YAC3B,uBAAC,iBAAS,cAAE,QAAQ,GAAa,GACnB,GACH,GACA,GACJ,GACD,GACD,GACG,CACvB,CAAC;AACJ,CAAC,CAAC;AArBW,QAAA,WAAW,eAqBtB;AAEK,MAAM,SAAS,GAAoC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACzE,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,2BAAe,GAAE,CAAC;IACvC,MAAM,eAAe,GAAG,IAAA,qCAAkB,GAAE,CAAC;IAC7C,MAAM,MAAM,GAAG,eAAe,CAAC,CAAC,CAAC,gBAAQ,CAAC,CAAC,CAAC,+BAAY,CAAC;IACzD,OAAO,CACL,wBAAC,MAAM,eACJ,QAAQ,EACR,QAAQ,CAAC,CAAC,CAAC,uBAAC,kCAAsB,KAAG,CAAC,CAAC,CAAC,IAAI,IACtC,CACV,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,SAAS,aAUpB"}
+{"version":3,"file":"AppProvider.js","sourceRoot":"","sources":["../AppProvider.tsx"],"names":[],"mappings":";;;;AAAA,uDAA4D;AAE5D,iCAAiC;AACjC,uDAAoE;AACpE,sDAAmD;AACnD,2CAMqB;AACrB,qCAAiE;AAG1D,MAAM,WAAW,GAAmD,CAAC,EAC1E,QAAQ,EACR,MAAM,GACP,EAAE,EAAE;IACH,OAAO,CACL,uBAAC,iCAAmB,IAAC,MAAM,EAAE,yBAAW,YACtC,uBAAC,0BAAc,IAAC,MAAM,EAAE,MAAM,YAC5B,uBAAC,yBAAa,cACZ,uBAAC,wBAAY,cACX,uBAAC,0BAAc,cACb,uBAAC,sBAAa,IAAC,MAAM,EAAE,MAAM,YAC3B,uBAAC,iBAAS,cAAE,QAAQ,GAAa,GACnB,GACD,GACJ,GACD,GACD,GACG,CACvB,CAAC;AACJ,CAAC,CAAC;AAnBW,QAAA,WAAW,eAmBtB;AAEK,MAAM,SAAS,GAAoC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACzE,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,2BAAe,GAAE,CAAC;IACvC,MAAM,eAAe,GAAG,IAAA,qCAAkB,GAAE,CAAC;IAC7C,MAAM,MAAM,GAAG,eAAe,CAAC,CAAC,CAAC,gBAAQ,CAAC,CAAC,CAAC,+BAAY,CAAC;IACzD,OAAO,CACL,wBAAC,MAAM,eACJ,QAAQ,EACR,QAAQ,CAAC,CAAC,CAAC,uBAAC,+BAAsB,KAAG,CAAC,CAAC,CAAC,IAAI,IACtC,CACV,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,SAAS,aAUpB"}

package/_cjs/components/AmountInput/AmountInput.d.ts

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

package/_cjs/components/AmountInput/AmountInput.js

@@ -3,37 +3,30 @@ 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 stores_1 = require("../../stores");
 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 PriceFormHelperText_1 = require("./PriceFormHelperText");
 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 [chainId, tokenAddress] = (0, stores_1.useFieldValues)(stores_1.FormKeyHelper.getChainKey(formType), stores_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 }));
+    return ((0, jsx_runtime_1.jsx)(exports.AmountInputBase, { formType: formType, token: token, endAdornment: !disabled ? (0, jsx_runtime_1.jsx)(AmountInputEndAdornment_1.AmountInputEndAdornment, { formType: formType }) : undefined, bottomAdornment: (0, jsx_runtime_1.jsx)(PriceFormHelperText_1.PriceFormHelperText, { 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 amountKey = stores_1.FormKeyHelper.getAmountKey(formType);
+    const { onChange, onBlur, value } = (0, stores_1.useFieldController)({ name: amountKey });
     const handleChange = (event) => {
         const { value } = event.target;
         const formattedAmount = (0, utils_1.formatInputAmount)(value, token?.decimals, true);
@@ -50,9 +43,9 @@ const AmountInputBase = ({ formType, token, startAdornment, endAdornment, bottom
             (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] })] }));
+    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.FormContainer, { children: [(0, jsx_runtime_1.jsx)(AmountInputStartAdornment_1.AmountInputStartAdornment, { formType: formType }), (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;
 //# sourceMappingURL=AmountInput.js.map

package/_cjs/components/AmountInput/AmountInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"AmountInput.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInput.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"AmountInput.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInput.tsx"],"names":[],"mappings":"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"}

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

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

package/_cjs/components/AmountInput/AmountInput.style.js

@@ -1,21 +1,26 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Input = exports.FormControl = exports.minInputFontSize = exports.maxInputFontSize = void 0;
+exports.Input = exports.FormControl = exports.FormContainer = 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.FormContainer = (0, styles_1.styled)(material_1.Box)(({ theme }) => ({
+    display: 'flex',
+    alignItems: 'center',
+    padding: theme.spacing(2),
+}));
 exports.FormControl = (0, styles_1.styled)(material_1.FormControl)(({ theme }) => ({
-    padding: theme.spacing(1.5, 2, 1.5, 0),
+    height: 40,
 }));
 exports.Input = (0, styles_1.styled)(material_1.InputBase)(({ theme }) => ({
     fontSize: 24,
     fontWeight: 700,
     boxShadow: 'none',
-    // padding: theme.spacing(2, 2, 2, 0),
+    lineHeight: 1.5,
     [`.${InputBase_1.inputBaseClasses.input}`]: {
-        height: 32,
+        height: 24,
         padding: theme.spacing(0, 0, 0, 2),
     },
     '& input[type="number"]::-webkit-outer-spin-button, & input[type="number"]::-webkit-inner-spin-button': {

package/_cjs/components/AmountInput/AmountInput.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"AmountInput.style.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInput.style.tsx"],"names":[],"mappings":";;;AAAA,4CAAyE;AACzE,uDAA2D;AAC3D,iDAA8C;AAEjC,QAAA,gBAAgB,GAAG,EAAE,CAAC;AACtB,QAAA,gBAAgB,GAAG,EAAE,CAAC;AAEtB,QAAA,WAAW,GAAG,IAAA,eAAM,EAAC,sBAAc,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAChE,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;CACvC,CAAC,CAAC,CAAC;AAES,QAAA,KAAK,GAAG,IAAA,eAAM,EAAC,oBAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACrD,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,GAAG;IACf,SAAS,EAAE,MAAM;IACjB,sCAAsC;IACtC,CAAC,IAAI,4BAAgB,CAAC,KAAK,EAAE,CAAC,EAAE;QAC9B,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;KACnC;IACD,sGAAsG,EACpG;QACE,gBAAgB,EAAE,MAAM;QACxB,MAAM,EAAE,CAAC;KACV;IACH,wBAAwB,EAAE;QACxB,aAAa,EAAE,WAAW;KAC3B;IACD,CAAC,KAAK,4BAAgB,CAAC,QAAQ,EAAE,CAAC,EAAE;QAClC,KAAK,EAAE,SAAS;KACjB;IACD,CAAC,IAAI,4BAAgB,CAAC,KAAK,IAAI,4BAAgB,CAAC,QAAQ,EAAE,CAAC,EAAE;QAC3D,mBAAmB,EAAE,OAAO;KAC7B;CACF,CAAC,CAAC,CAAC"}
+{"version":3,"file":"AmountInput.style.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInput.style.tsx"],"names":[],"mappings":";;;AAAA,4CAA8E;AAC9E,uDAA2D;AAC3D,iDAA8C;AAEjC,QAAA,gBAAgB,GAAG,EAAE,CAAC;AACtB,QAAA,gBAAgB,GAAG,EAAE,CAAC;AAEtB,QAAA,aAAa,GAAG,IAAA,eAAM,EAAC,cAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACvD,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;CAC1B,CAAC,CAAC,CAAC;AAES,QAAA,WAAW,GAAG,IAAA,eAAM,EAAC,sBAAc,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAChE,MAAM,EAAE,EAAE;CACX,CAAC,CAAC,CAAC;AAES,QAAA,KAAK,GAAG,IAAA,eAAM,EAAC,oBAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACrD,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,GAAG;IACf,SAAS,EAAE,MAAM;IACjB,UAAU,EAAE,GAAG;IACf,CAAC,IAAI,4BAAgB,CAAC,KAAK,EAAE,CAAC,EAAE;QAC9B,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;KACnC;IACD,sGAAsG,EACpG;QACE,gBAAgB,EAAE,MAAM;QACxB,MAAM,EAAE,CAAC;KACV;IACH,wBAAwB,EAAE;QACxB,aAAa,EAAE,WAAW;KAC3B;IACD,CAAC,KAAK,4BAAgB,CAAC,QAAQ,EAAE,CAAC,EAAE;QAClC,KAAK,EAAE,SAAS;KACjB;IACD,CAAC,IAAI,4BAAgB,CAAC,KAAK,IAAI,4BAAgB,CAAC,QAAQ,EAAE,CAAC,EAAE;QAC3D,mBAAmB,EAAE,OAAO;KAC7B;CACF,CAAC,CAAC,CAAC"}

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

@@ -1,4 +1,7 @@
 /// <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"> & {
+export declare const MaxButton: 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;
 }, "color" | "children" | "sx" | "style" | "className" | "tabIndex" | "href" | "disabled" | "action" | "size" | "classes" | "variant" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const MaxButtonSkeleton: import("@emotion/styled").StyledComponent<import("@mui/material").SkeletonOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}, "width" | "height" | "animation" | "children" | "sx" | "style" | "className" | "classes" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

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

@@ -1,12 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
+exports.MaxButtonSkeleton = exports.MaxButton = 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 }) => ({
+exports.MaxButton = (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',
 }));
+exports.MaxButtonSkeleton = (0, styles_1.styled)(material_1.Skeleton)(({ theme }) => ({
+    width: 46,
+    height: 24,
+    borderRadius: theme.shape.borderRadiusSecondary,
+}));
 //# sourceMappingURL=AmountInputAdornment.style.js.map

package/_cjs/components/AmountInput/AmountInputAdornment.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"AmountInputAdornment.style.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInputAdornment.style.tsx"],"names":[],"mappings":";;;AAAA,4CAAoD;AACpD,iDAA8C;AAEjC,QAAA,MAAM,GAAG,IAAA,eAAM,EAAC,iBAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACtD,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IACxC,UAAU,EAAE,MAAM;IAClB,QAAQ,EAAE,UAAU;IACpB,QAAQ,EAAE,OAAO;CAClB,CAAC,CAAC,CAAC"}
+{"version":3,"file":"AmountInputAdornment.style.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInputAdornment.style.tsx"],"names":[],"mappings":";;;AAAA,4CAA8D;AAC9D,iDAA8C;AAEjC,QAAA,SAAS,GAAG,IAAA,eAAM,EAAC,iBAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACzD,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IACxC,UAAU,EAAE,MAAM;IAClB,QAAQ,EAAE,UAAU;IACpB,QAAQ,EAAE,OAAO;CAClB,CAAC,CAAC,CAAC;AAES,QAAA,iBAAiB,GAAG,IAAA,eAAM,EAAC,mBAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAChE,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,EAAE;IACV,YAAY,EAAE,KAAK,CAAC,KAAK,CAAC,qBAAqB;CAChD,CAAC,CAAC,CAAC"}

package/_cjs/components/AmountInput/AmountInputEndAdornment.d.ts

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

package/_cjs/components/AmountInput/AmountInputEndAdornment.js

@@ -3,22 +3,16 @@ 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 react_hook_form_1 = require("react-hook-form");
 const react_i18next_1 = require("react-i18next");
 const viem_1 = require("viem");
 const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
+const stores_1 = require("../../stores");
 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.useAvailableChains)();
-    const [chainId, tokenAddress] = (0, react_hook_form_1.useWatch)({
-        name: [
-            providers_1.FormKeyHelper.getChainKey(formType),
-            providers_1.FormKeyHelper.getTokenKey(formType),
-        ],
-    });
+    const { setFieldValue } = (0, stores_1.useFieldActions)();
+    const [chainId, tokenAddress] = (0, stores_1.useFieldValues)(stores_1.FormKeyHelper.getChainKey(formType), stores_1.FormKeyHelper.getTokenKey(formType));
     // We get gas recommendations for the source chain to make sure that after pressing the Max button
     // the user will have enough funds remaining to cover gas costs
     const { data } = (0, hooks_1.useGasRecommendation)(chainId);
@@ -35,11 +29,11 @@ const AmountInputEndAdornment = ({ formType }) => {
                 maxAmount = tokenAmount - recommendedAmount;
             }
         }
-        setValue(providers_1.FormKeyHelper.getAmountKey(formType), maxAmount && token ? (0, viem_1.formatUnits)(maxAmount, token.decimals) : '', {
-            shouldTouch: true,
+        setFieldValue(stores_1.FormKeyHelper.getAmountKey(formType), maxAmount && token ? (0, viem_1.formatUnits)(maxAmount, token.decimals) : '', {
+            isTouched: 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 }));
+    return ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", children: isLoading && tokenAddress ? ((0, jsx_runtime_1.jsx)(AmountInputAdornment_style_1.MaxButtonSkeleton, { variant: "rectangular" })) : formType === 'from' && token?.amount ? ((0, jsx_runtime_1.jsx)(AmountInputAdornment_style_1.MaxButton, { onClick: handleMax, children: t('button.max') })) : null }));
 };
 exports.AmountInputEndAdornment = AmountInputEndAdornment;
 //# sourceMappingURL=AmountInputEndAdornment.js.map

package/_cjs/components/AmountInput/AmountInputEndAdornment.js.map

@@ -1 +1 @@
-{"version":3,"file":"AmountInputEndAdornment.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInputEndAdornment.tsx"],"names":[],"mappings":";;;;AAAA,4CAAyD;AACzD,qDAA2D;AAC3D,iDAA+C;AAC/C,+BAAmC;AACnC,uCAIqB;AAErB,+CAAgD;AAChD,6EAAsD;AAE/C,MAAM,uBAAuB,GAAG,CAAC,EAAE,QAAQ,EAAiB,EAAE,EAAE;IACrE,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,gCAAc,GAAE,CAAC;IACtC,MAAM,EAAE,YAAY,EAAE,GAAG,IAAA,0BAAkB,GAAE,CAAC;IAC9C,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,IAAA,0BAAQ,EAAC;QACvC,IAAI,EAAE;YACJ,yBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC;YACnC,yBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC;SACpC;KACF,CAAC,CAAC;IAEH,kGAAkG;IAClG,+DAA+D;IAC/D,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,4BAAoB,EAAC,OAAO,CAAC,CAAC;IAE/C,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAA,8BAAsB,EAAC,OAAO,EAAE,YAAY,CAAC,CAAC;IAE3E,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,MAAM,KAAK,GAAG,YAAY,CAAC,OAAO,CAAC,CAAC;QACpC,IAAI,SAAS,GAAG,KAAK,EAAE,MAAM,CAAC;QAC9B,IACE,KAAK,EAAE,WAAW,CAAC,OAAO,KAAK,YAAY;YAC3C,IAAI,EAAE,SAAS;YACf,IAAI,EAAE,WAAW,EACjB,CAAC;YACD,MAAM,WAAW,GAAG,KAAK,EAAE,MAAM,IAAI,EAAE,CAAC;YACxC,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC;YAC/D,IAAI,WAAW,GAAG,iBAAiB,EAAE,CAAC;gBACpC,SAAS,GAAG,WAAW,GAAG,iBAAiB,CAAC;YAC9C,CAAC;QACH,CAAC;QAED,QAAQ,CACN,yBAAa,CAAC,YAAY,CAAC,QAAQ,CAAC,EACpC,SAAS,IAAI,KAAK,CAAC,CAAC,CAAC,IAAA,kBAAW,EAAC,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,EAChE;YACE,WAAW,EAAE,IAAI;SAClB,CACF,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,yBAAc,IAAC,QAAQ,EAAC,KAAK,YAC3B,SAAS,IAAI,YAAY,CAAC,CAAC,CAAC,CAC3B,uBAAC,mBAAQ,IACP,OAAO,EAAC,aAAa,EACrB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,EAAE,EAAE,EAAE,YAAY,EAAE,GAAG,EAAE,GACzB,CACH,CAAC,CAAC,CAAC,QAAQ,KAAK,MAAM,IAAI,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CACzC,uBAAC,mCAAM,IAAC,OAAO,EAAE,SAAS,YAAG,CAAC,CAAC,YAAY,CAAC,GAAU,CACvD,CAAC,CAAC,CAAC,IAAI,GACO,CAClB,CAAC;AACJ,CAAC,CAAC;AAvDW,QAAA,uBAAuB,2BAuDlC"}
+{"version":3,"file":"AmountInputEndAdornment.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInputEndAdornment.tsx"],"names":[],"mappings":";;;;AAAA,4CAA+C;AAC/C,iDAA+C;AAC/C,+BAAmC;AACnC,uCAIqB;AAErB,yCAA8E;AAC9E,6EAA4E;AAErE,MAAM,uBAAuB,GAAG,CAAC,EAAE,QAAQ,EAAiB,EAAE,EAAE;IACrE,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,YAAY,EAAE,GAAG,IAAA,0BAAkB,GAAE,CAAC;IAC9C,MAAM,EAAE,aAAa,EAAE,GAAG,IAAA,wBAAe,GAAE,CAAC;IAE5C,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,IAAA,uBAAc,EAC5C,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,EACnC,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,CACpC,CAAC;IAEF,kGAAkG;IAClG,+DAA+D;IAC/D,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,4BAAoB,EAAC,OAAO,CAAC,CAAC;IAE/C,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAA,8BAAsB,EAAC,OAAO,EAAE,YAAY,CAAC,CAAC;IAE3E,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,MAAM,KAAK,GAAG,YAAY,CAAC,OAAO,CAAC,CAAC;QACpC,IAAI,SAAS,GAAG,KAAK,EAAE,MAAM,CAAC;QAC9B,IACE,KAAK,EAAE,WAAW,CAAC,OAAO,KAAK,YAAY;YAC3C,IAAI,EAAE,SAAS;YACf,IAAI,EAAE,WAAW,EACjB,CAAC;YACD,MAAM,WAAW,GAAG,KAAK,EAAE,MAAM,IAAI,EAAE,CAAC;YACxC,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC;YAC/D,IAAI,WAAW,GAAG,iBAAiB,EAAE,CAAC;gBACpC,SAAS,GAAG,WAAW,GAAG,iBAAiB,CAAC;YAC9C,CAAC;QACH,CAAC;QAED,aAAa,CACX,sBAAa,CAAC,YAAY,CAAC,QAAQ,CAAC,EACpC,SAAS,IAAI,KAAK,CAAC,CAAC,CAAC,IAAA,kBAAW,EAAC,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,EAChE;YACE,SAAS,EAAE,IAAI;SAChB,CACF,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,yBAAc,IAAC,QAAQ,EAAC,KAAK,YAC3B,SAAS,IAAI,YAAY,CAAC,CAAC,CAAC,CAC3B,uBAAC,8CAAiB,IAAC,OAAO,EAAC,aAAa,GAAG,CAC5C,CAAC,CAAC,CAAC,QAAQ,KAAK,MAAM,IAAI,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CACzC,uBAAC,sCAAS,IAAC,OAAO,EAAE,SAAS,YAAG,CAAC,CAAC,YAAY,CAAC,GAAa,CAC7D,CAAC,CAAC,CAAC,IAAI,GACO,CAClB,CAAC;AACJ,CAAC,CAAC;AAjDW,QAAA,uBAAuB,2BAiDlC"}

package/_cjs/components/AmountInput/AmountInputStartAdornment.d.ts

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

package/_cjs/components/AmountInput/AmountInputStartAdornment.js

@@ -2,21 +2,15 @@
 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 stores_1 = require("../../stores");
 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 [chainId, tokenAddress] = (0, stores_1.useFieldValues)(stores_1.FormKeyHelper.getChainKey(formType), stores_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 } }));
+    return isSelected ? ((0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatar, { token: token, chain: chain })) : ((0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatarDefault, {}));
 };
 exports.AmountInputStartAdornment = AmountInputStartAdornment;
 //# sourceMappingURL=AmountInputStartAdornment.js.map

package/_cjs/components/AmountInput/AmountInputStartAdornment.js.map

@@ -1 +1 @@
-{"version":3,"file":"AmountInputStartAdornment.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInputStartAdornment.tsx"],"names":[],"mappings":";;;;AAAA,qDAA2C;AAC3C,uCAAiD;AAEjD,+CAAgD;AAChD,gDAAiE;AAE1D,MAAM,yBAAyB,GAA4B,CAAC,EACjE,QAAQ,GACT,EAAE,EAAE;IACH,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,IAAA,0BAAQ,EAAC;QACvC,IAAI,EAAE;YACJ,yBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC;YACnC,yBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC;SACpC;KACF,CAAC,CAAC;IAEH,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,gBAAQ,EAAC,OAAO,CAAC,CAAC;IACpC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,gBAAQ,EAAC,OAAO,EAAE,YAAY,CAAC,CAAC;IAClD,MAAM,UAAU,GAAG,CAAC,CAAC,CAAC,KAAK,IAAI,KAAK,CAAC,CAAC;IAEtC,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,uBAAC,yBAAW,IAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,GAAI,CACnE,CAAC,CAAC,CAAC,CACF,uBAAC,gCAAkB,IAAC,EAAE,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,GAAI,CAC9C,CAAC;AACJ,CAAC,CAAC;AAnBW,QAAA,yBAAyB,6BAmBpC"}
+{"version":3,"file":"AmountInputStartAdornment.js","sourceRoot":"","sources":["../../../components/AmountInput/AmountInputStartAdornment.tsx"],"names":[],"mappings":";;;;AAAA,uCAAiD;AAEjD,yCAA6D;AAC7D,gDAAiE;AAE1D,MAAM,yBAAyB,GAA4B,CAAC,EACjE,QAAQ,GACT,EAAE,EAAE;IACH,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,IAAA,uBAAc,EAC5C,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,EACnC,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,CACpC,CAAC;IAEF,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,gBAAQ,EAAC,OAAO,CAAC,CAAC;IACpC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,gBAAQ,EAAC,OAAO,EAAE,YAAY,CAAC,CAAC;IAClD,MAAM,UAAU,GAAG,CAAC,CAAC,CAAC,KAAK,IAAI,KAAK,CAAC,CAAC;IAEtC,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,uBAAC,yBAAW,IAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,CAC5C,CAAC,CAAC,CAAC,CACF,uBAAC,gCAAkB,KAAG,CACvB,CAAC;AACJ,CAAC,CAAC;AAjBW,QAAA,yBAAyB,6BAiBpC"}

package/_cjs/components/AmountInput/PriceFormHelperText.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { TokenAmount } from '@lifi/sdk';
+import type { FormTypeProps } from '../../stores';
+export declare const PriceFormHelperText: React.FC<FormTypeProps>;
+export declare const PriceFormHelperTextBase: React.FC<FormTypeProps & {
+    isLoading?: boolean;
+    tokenAddress?: string;
+    token?: TokenAmount;
+}>;

package/_cjs/components/AmountInput/PriceFormHelperText.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PriceFormHelperTextBase = exports.PriceFormHelperText = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_i18next_1 = require("react-i18next");
+const hooks_1 = require("../../hooks");
+const stores_1 = require("../../stores");
+const utils_1 = require("../../utils");
+const PriceFormHelperText = ({ formType }) => {
+    const [chainId, tokenAddress] = (0, stores_1.useFieldValues)(stores_1.FormKeyHelper.getChainKey(formType), stores_1.FormKeyHelper.getTokenKey(formType));
+    const { token, isLoading } = (0, hooks_1.useTokenAddressBalance)(chainId, tokenAddress);
+    return ((0, jsx_runtime_1.jsx)(exports.PriceFormHelperTextBase, { formType: formType, isLoading: isLoading, tokenAddress: tokenAddress, token: token }));
+};
+exports.PriceFormHelperText = PriceFormHelperText;
+const PriceFormHelperTextBase = ({ formType, isLoading, tokenAddress, token }) => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const [amount] = (0, stores_1.useFieldValues)(stores_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,
+            marginLeft: 2,
+            marginTop: 0.75,
+        }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { color: fromAmountTokenPrice ? 'text.secondary' : 'grey.600', fontWeight: 400, fontSize: 12, lineHeight: 1, 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: 12 })) : token?.amount ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { fontWeight: 400, fontSize: 12, color: "text.secondary", lineHeight: 1, pl: 0.25, children: `/ ${t(`format.number`, {
+                    value: (0, utils_1.formatTokenAmount)(token.amount, token.decimals),
+                })}` })) : null] }));
+};
+exports.PriceFormHelperTextBase = PriceFormHelperTextBase;
+//# sourceMappingURL=PriceFormHelperText.js.map

package/_cjs/components/AmountInput/PriceFormHelperText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PriceFormHelperText.js","sourceRoot":"","sources":["../../../components/AmountInput/PriceFormHelperText.tsx"],"names":[],"mappings":";;;;AACA,4CAAqE;AACrE,iDAA+C;AAC/C,uCAAqD;AAErD,yCAA6D;AAC7D,uCAAkE;AAE3D,MAAM,mBAAmB,GAA4B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC3E,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,IAAA,uBAAc,EAC5C,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,EACnC,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,CACpC,CAAC;IACF,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAA,8BAAsB,EAAC,OAAO,EAAE,YAAY,CAAC,CAAC;IAE3E,OAAO,CACL,uBAAC,+BAAuB,IACtB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,GACZ,CACH,CAAC;AACJ,CAAC,CAAC;AAfW,QAAA,mBAAmB,uBAe9B;AAEK,MAAM,uBAAuB,GAMhC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,EAAE;IACnD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,CAAC,MAAM,CAAC,GAAG,IAAA,uBAAc,EAAC,sBAAa,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEtE,MAAM,oBAAoB,GAAG,IAAA,wBAAgB,EAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;IAEvE,OAAO,CACL,wBAAC,yBAAc,IACb,SAAS,EAAC,KAAK,EACf,EAAE,EAAE;YACF,OAAO,EAAE,MAAM;YACf,cAAc,EAAE,eAAe;YAC/B,MAAM,EAAE,CAAC;YACT,UAAU,EAAE,CAAC;YACb,SAAS,EAAE,IAAI;SAChB,aAED,uBAAC,qBAAU,IACT,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,UAAU,EAC3D,UAAU,EAAE,GAAG,EACf,QAAQ,EAAE,EAAE,EACZ,UAAU,EAAE,CAAC,EACb,IAAI,EAAE,CAAC,EACP,EAAE,EAAE;oBACF,SAAS,EAAE,YAAY;oBACvB,YAAY,EAAE,YAAY;iBAC3B,YAEA,CAAC,CAAC,iBAAiB,EAAE;oBACpB,KAAK,EAAE,oBAAoB;iBAC5B,CAAC,GACS,EACZ,SAAS,IAAI,YAAY,CAAC,CAAC,CAAC,CAC3B,uBAAC,mBAAQ,IAAC,OAAO,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,CACnD,CAAC,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CAClB,uBAAC,qBAAU,IACT,UAAU,EAAE,GAAG,EACf,QAAQ,EAAE,EAAE,EACZ,KAAK,EAAC,gBAAgB,EACtB,UAAU,EAAE,CAAC,EACb,EAAE,EAAE,IAAI,YAEP,KAAK,CAAC,CAAC,eAAe,EAAE;oBACvB,KAAK,EAAE,IAAA,yBAAiB,EAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC;iBACvD,CAAC,EAAE,GACO,CACd,CAAC,CAAC,CAAC,IAAI,IACO,CAClB,CAAC;AACJ,CAAC,CAAC;AAvDW,QAAA,uBAAuB,2BAuDlC"}

package/_cjs/components/Card/CardHeader.js

@@ -10,14 +10,15 @@ exports.CardHeader = (0, styles_1.styled)(material_1.CardHeader)(({ theme }) =>
         alignSelf: 'center',
     },
     [`.${CardHeader_1.cardHeaderClasses.title}`]: {
-        fontWeight: '500',
-        fontSize: '1.125rem',
-        lineHeight: '1.2778',
+        fontWeight: 500,
+        fontSize: 18,
+        lineHeight: 1.3334,
         color: theme.palette.text.primary,
     },
     [`.${CardHeader_1.cardHeaderClasses.subheader}`]: {
-        fontWeight: '400',
-        fontSize: '0.75rem',
+        fontWeight: 500,
+        fontSize: 12,
+        lineHeight: 1.3334,
         color: theme.palette.text.secondary,
     },
 }));

package/_cjs/components/Card/CardHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../components/Card/CardHeader.tsx"],"names":[],"mappings":";;;AAAA,4CAA4D;AAC5D,yDAA6D;AAC7D,iDAA8C;AAEjC,QAAA,UAAU,GAAG,IAAA,eAAM,EAAC,qBAAa,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAC9D,CAAC,IAAI,8BAAiB,CAAC,MAAM,EAAE,CAAC,EAAE;QAChC,SAAS,EAAE,CAAC,CAAC;QACb,SAAS,EAAE,QAAQ;KACpB;IACD,CAAC,IAAI,8BAAiB,CAAC,KAAK,EAAE,CAAC,EAAE;QAC/B,UAAU,EAAE,KAAK;QACjB,QAAQ,EAAE,UAAU;QACpB,UAAU,EAAE,QAAQ;QACpB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;KAClC;IACD,CAAC,IAAI,8BAAiB,CAAC,SAAS,EAAE,CAAC,EAAE;QACnC,UAAU,EAAE,KAAK;QACjB,QAAQ,EAAE,SAAS;QACnB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS;KACpC;CACF,CAAC,CAAC,CAAC"}
+{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../components/Card/CardHeader.tsx"],"names":[],"mappings":";;;AAAA,4CAA4D;AAC5D,yDAA6D;AAC7D,iDAA8C;AAEjC,QAAA,UAAU,GAAG,IAAA,eAAM,EAAC,qBAAa,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAC9D,CAAC,IAAI,8BAAiB,CAAC,MAAM,EAAE,CAAC,EAAE;QAChC,SAAS,EAAE,CAAC,CAAC;QACb,SAAS,EAAE,QAAQ;KACpB;IACD,CAAC,IAAI,8BAAiB,CAAC,KAAK,EAAE,CAAC,EAAE;QAC/B,UAAU,EAAE,GAAG;QACf,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;KAClC;IACD,CAAC,IAAI,8BAAiB,CAAC,SAAS,EAAE,CAAC,EAAE;QACnC,UAAU,EAAE,GAAG;QACf,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS;KACpC;CACF,CAAC,CAAC,CAAC"}

package/_cjs/components/Card/CardTitle.js

@@ -6,11 +6,10 @@ 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',
+    fontSize: 14,
+    lineHeight: 1,
     fontWeight: 700,
-    padding: theme.spacing(1.75, 2, 0, 2),
+    padding: theme.spacing(2, 2, 0, 2),
     '&:after': {
         content: required ? '" *"' : 'none',
         color: theme.palette.error.main,

package/_cjs/components/Card/CardTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardTitle.js","sourceRoot":"","sources":["../../../components/Card/CardTitle.tsx"],"names":[],"mappings":";;;AAAA,4CAA2C;AAC3C,iDAA8C;AAEjC,QAAA,SAAS,GAAG,IAAA,eAAM,EAAC,qBAAU,EAAE;IAC1C,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACpE,CAAC,CAAyB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;IACnD,QAAQ,EAAE,UAAU;IACpB,UAAU,EAAE,OAAO;IACnB,aAAa,EAAE,WAAW;IAC1B,UAAU,EAAE,GAAG;IACf,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;IACrC,SAAS,EAAE;QACT,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;QACnC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;KAChC;CACF,CAAC,CAAC,CAAC"}
+{"version":3,"file":"CardTitle.js","sourceRoot":"","sources":["../../../components/Card/CardTitle.tsx"],"names":[],"mappings":";;;AAAA,4CAA2C;AAC3C,iDAA8C;AAEjC,QAAA,SAAS,GAAG,IAAA,eAAM,EAAC,qBAAU,EAAE;IAC1C,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACpE,CAAC,CAAyB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;IACnD,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,CAAC;IACb,UAAU,EAAE,GAAG;IACf,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;IAClC,SAAS,EAAE;QACT,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;QACnC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;KAChC;CACF,CAAC,CAAC,CAAC"}

package/_cjs/components/ChainSelect/ChainSelect.d.ts

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

package/_cjs/components/ChainSelect/ChainSelect.js

@@ -4,9 +4,7 @@ exports.ChainSelect = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const react_1 = require("react");
-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");
@@ -14,9 +12,7 @@ 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 [chainId] = (0, stores_1.useFieldValues)(stores_1.FormKeyHelper.getChainKey(formType));
     (0, react_1.useEffect)(() => {
         const hasChainInOrderedList = chainOrder.includes(chainId);
         // If we don't have a chain in the ordered chain list we should add it.

package/_cjs/components/ChainSelect/ChainSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainSelect.js","sourceRoot":"","sources":["../../../components/ChainSelect/ChainSelect.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ChainSelect.js","sourceRoot":"","sources":["../../../components/ChainSelect/ChainSelect.tsx"],"names":[],"mappings":";;;;AAEA,4CAA2E;AAC3E,iCAAkC;AAClC,uDAA+C;AAE/C,yCAA8E;AAC9E,uCAA+C;AAC/C,2DAAgE;AAChE,qDAAkD;AAE3C,MAAM,WAAW,GAAG,CAAC,EAAE,QAAQ,EAAiB,EAAE,EAAE;IACzD,MAAM,QAAQ,GAAG,IAAA,8BAAW,GAAE,CAAC;IAC/B,MAAM,EACJ,UAAU,EACV,MAAM,EACN,SAAS,EACT,SAAS,EACT,aAAa,EACb,eAAe,GAChB,GAAG,IAAA,+BAAc,EAAC,QAAQ,CAAC,CAAC;IAE7B,MAAM,CAAC,OAAO,CAAC,GAAG,IAAA,uBAAc,EAAC,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEtE,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,qBAAqB,GAAG,UAAU,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QAC3D,uEAAuE;QACvE,IAAI,CAAC,qBAAqB,EAAE,CAAC;YAC3B,aAAa,CAAC,OAAO,CAAC,CAAC;QACzB,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC;IAEzC,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,QAAQ,CAAC,wBAAgB,CAAC,GAAG,QAAQ,OAAO,CAAC,CAAC,CAAC;IACjD,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC,CAAC,GAAG,wBAAe,CAAC;IAE7D,OAAO,CACL,wBAAC,kCAAc,eACZ,SAAS;gBACR,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,wBAAe,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5D,uBAAC,mBAAQ,IAEP,OAAO,EAAC,aAAa,EACrB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,IAJlB,KAAK,CAKV,CACH,CAAC;gBACJ,CAAC,CAAC,SAAS,EAAE,CAAC,GAAG,CAAC,CAAC,KAAe,EAAE,EAAE,CAAC,CACnC,uBAAC,kBAAO,IAEN,KAAK,EAAE,KAAK,CAAC,IAAI,EACjB,SAAS,EAAC,KAAK,EACf,UAAU,EAAE,GAAG,EACf,KAAK,kBAEL,uBAAC,6BAAS,IACR,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,CAAC,EACxC,OAAO,EAAE,OAAO,KAAK,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,YAEtD,uBAAC,iBAAM,IACL,GAAG,EAAE,KAAK,CAAC,OAAO,EAClB,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,YAE5B,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,GACP,GACC,IAjBP,KAAK,CAAC,EAAE,CAkBL,CACX,CAAC,EACL,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAClB,uBAAC,6BAAS,IAAC,OAAO,EAAE,aAAa,YAC/B,uBAAC,cAAG,IACF,EAAE,EAAE;wBACF,KAAK,EAAE,EAAE;wBACT,MAAM,EAAE,EAAE;wBACV,OAAO,EAAE,MAAM;wBACf,UAAU,EAAE,QAAQ;qBACrB,YAED,wBAAC,qBAAU,IAAC,UAAU,EAAE,GAAG,kBAAI,YAAY,IAAc,GACrD,GACI,CACb,CAAC,CAAC,CAAC,IAAI,IACO,CAClB,CAAC;AACJ,CAAC,CAAC;AA7EW,QAAA,WAAW,eA6EtB"}

package/_cjs/components/ChainSelect/useChainSelect.d.ts

@@ -1,5 +1,5 @@
 import type { EVMChain } from '@lifi/sdk';
-import type { FormType } from '../../providers';
+import type { FormType } from '../../stores';
 export declare const useChainSelect: (formType: FormType) => {
     chainOrder: number[];
     chains: import("@lifi/sdk").ExtendedChain[] | undefined;

package/_cjs/components/ChainSelect/useChainSelect.js

@@ -1,16 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useChainSelect = void 0;
-const react_hook_form_1 = require("react-hook-form");
 const hooks_1 = require("../../hooks");
 const providers_1 = require("../../providers");
 const stores_1 = require("../../stores");
 const types_1 = require("../../types");
 const useChainSelect = (formType) => {
     const { requiredUI } = (0, providers_1.useWidgetConfig)();
-    const chainKey = providers_1.FormKeyHelper.getChainKey(formType);
-    const { field: { onChange, onBlur }, } = (0, react_hook_form_1.useController)({ name: chainKey });
-    const { setValue, getValues } = (0, react_hook_form_1.useFormContext)();
+    const chainKey = stores_1.FormKeyHelper.getChainKey(formType);
+    const { onChange, onBlur } = (0, stores_1.useFieldController)({ name: chainKey });
+    const { setFieldValue, getFieldValues } = (0, stores_1.useFieldActions)();
     const { chains, isLoading, getChainById } = (0, hooks_1.useChains)();
     const [chainOrder, setChainOrder] = (0, stores_1.useChainOrder)();
     const swapOnly = (0, hooks_1.useSwapOnly)();
@@ -27,17 +26,14 @@ const useChainSelect = (formType) => {
         onChange(chainId);
         onBlur();
         if (swapOnly) {
-            setValue(providers_1.FormKeyHelper.getChainKey('to'), chainId, {
-                shouldTouch: true,
+            setFieldValue(stores_1.FormKeyHelper.getChainKey('to'), chainId, {
+                isTouched: true,
             });
         }
-        setValue(providers_1.FormKeyHelper.getTokenKey(formType), '');
-        setValue(providers_1.FormKeyHelper.getAmountKey(formType), '');
-        setValue(providers_1.FormKey.TokenSearchFilter, '');
-        const [fromChainId, toChainId] = getValues([
-            providers_1.FormKey.FromChain,
-            providers_1.FormKey.ToChain,
-        ]);
+        setFieldValue(stores_1.FormKeyHelper.getTokenKey(formType), '');
+        setFieldValue(stores_1.FormKeyHelper.getAmountKey(formType), '');
+        setFieldValue('tokenSearchFilter', '');
+        const [fromChainId, toChainId] = getFieldValues('fromChain', 'toChain');
         const fromChain = getChainById(fromChainId);
         const toChain = getChainById(toChainId);
         const differentChainType = fromChain && toChain && fromChain.chainType !== toChain.chainType;
@@ -49,7 +45,7 @@ const useChainSelect = (formType) => {
         // prevents cases when after we switch the chain from one type to another "Send to wallet" field hides,
         // but it keeps toAddress value set for the previous chain pair.
         if (!requiredToAddress) {
-            setValue(providers_1.FormKey.ToAddress, '');
+            setFieldValue('toAddress', '');
         }
         setChainOrder(chainId);
     };

package/_cjs/components/ChainSelect/useChainSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useChainSelect.js","sourceRoot":"","sources":["../../../components/ChainSelect/useChainSelect.ts"],"names":[],"mappings":";;;AACA,qDAAgE;AAChE,uCAAqD;AAErD,+CAA0E;AAC1E,yCAA6C;AAC7C,uCAAyC;AAElC,MAAM,cAAc,GAAG,CAAC,QAAkB,EAAE,EAAE;IACnD,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,2BAAe,GAAE,CAAC;IACzC,MAAM,QAAQ,GAAG,yBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;IACrD,MAAM,EACJ,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,GAC5B,GAAG,IAAA,+BAAa,EAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;IACtC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAA,gCAAc,GAAE,CAAC;IACjD,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,IAAA,iBAAS,GAAE,CAAC;IACxD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,sBAAa,GAAE,CAAC;IACpD,MAAM,QAAQ,GAAG,IAAA,mBAAW,GAAE,CAAC;IAE/B,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,IAAI,CAAC,MAAM,EAAE,CAAC;YACZ,OAAO,EAAE,CAAC;QACZ,CAAC;QACD,MAAM,cAAc,GAAG,UAAU;aAC9B,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,CAAC;aAC9D,MAAM,CAAC,OAAO,CAAe,CAAC;QAEjC,OAAO,cAAc,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,OAAe,EAAE,EAAE;QAC1C,QAAQ,CAAC,OAAO,CAAC,CAAC;QAClB,MAAM,EAAE,CAAC;QACT,IAAI,QAAQ,EAAE,CAAC;YACb,QAAQ,CAAC,yBAAa,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE;gBACjD,WAAW,EAAE,IAAI;aAClB,CAAC,CAAC;QACL,CAAC;QACD,QAAQ,CAAC,yBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC,CAAC;QAClD,QAAQ,CAAC,yBAAa,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC,CAAC;QACnD,QAAQ,CAAC,mBAAO,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC;QAExC,MAAM,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG,SAAS,CAAC;YACzC,mBAAO,CAAC,SAAS;YACjB,mBAAO,CAAC,OAAO;SAChB,CAAC,CAAC;QAEH,MAAM,SAAS,GAAG,YAAY,CAAC,WAAW,CAAC,CAAC;QAC5C,MAAM,OAAO,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;QAExC,MAAM,kBAAkB,GACtB,SAAS,IAAI,OAAO,IAAI,SAAS,CAAC,SAAS,KAAK,OAAO,CAAC,SAAS,CAAC;QAEpE,MAAM,iBAAiB,GACrB,UAAU,EAAE,QAAQ,CAAC,kBAAU,CAAC,SAAS,CAAC,IAAI,kBAAkB,CAAC;QAEnE,qEAAqE;QACrE,qEAAqE;QACrE,4EAA4E;QAC5E,mFAAmF;QACnF,uGAAuG;QACvG,gEAAgE;QAChE,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACvB,QAAQ,CAAC,mBAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;QAClC,CAAC;QACD,aAAa,CAAC,OAAO,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO;QACL,UAAU;QACV,MAAM;QACN,SAAS;QACT,SAAS;QACT,aAAa;QACb,eAAe;KAChB,CAAC;AACJ,CAAC,CAAC;AApEW,QAAA,cAAc,kBAoEzB"}
+{"version":3,"file":"useChainSelect.js","sourceRoot":"","sources":["../../../components/ChainSelect/useChainSelect.ts"],"names":[],"mappings":";;;AACA,uCAAqD;AAErD,+CAAkD;AAClD,yCAKsB;AACtB,uCAAyC;AAElC,MAAM,cAAc,GAAG,CAAC,QAAkB,EAAE,EAAE;IACnD,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,2BAAe,GAAE,CAAC;IACzC,MAAM,QAAQ,GAAG,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;IACrD,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,IAAA,2BAAkB,EAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;IAEpE,MAAM,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,IAAA,wBAAe,GAAE,CAAC;IAC5D,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,IAAA,iBAAS,GAAE,CAAC;IACxD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,sBAAa,GAAE,CAAC;IACpD,MAAM,QAAQ,GAAG,IAAA,mBAAW,GAAE,CAAC;IAE/B,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,IAAI,CAAC,MAAM,EAAE,CAAC;YACZ,OAAO,EAAE,CAAC;QACZ,CAAC;QACD,MAAM,cAAc,GAAG,UAAU;aAC9B,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,CAAC;aAC9D,MAAM,CAAC,OAAO,CAAe,CAAC;QAEjC,OAAO,cAAc,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,OAAe,EAAE,EAAE;QAC1C,QAAQ,CAAC,OAAO,CAAC,CAAC;QAClB,MAAM,EAAE,CAAC;QACT,IAAI,QAAQ,EAAE,CAAC;YACb,aAAa,CAAC,sBAAa,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE;gBACtD,SAAS,EAAE,IAAI;aAChB,CAAC,CAAC;QACL,CAAC;QACD,aAAa,CAAC,sBAAa,CAAC,WAAW,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC,CAAC;QACvD,aAAa,CAAC,sBAAa,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC,CAAC;QACxD,aAAa,CAAC,mBAAmB,EAAE,EAAE,CAAC,CAAC;QAEvC,MAAM,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG,cAAc,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;QAExE,MAAM,SAAS,GAAG,YAAY,CAAC,WAAW,CAAC,CAAC;QAC5C,MAAM,OAAO,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;QAExC,MAAM,kBAAkB,GACtB,SAAS,IAAI,OAAO,IAAI,SAAS,CAAC,SAAS,KAAK,OAAO,CAAC,SAAS,CAAC;QAEpE,MAAM,iBAAiB,GACrB,UAAU,EAAE,QAAQ,CAAC,kBAAU,CAAC,SAAS,CAAC,IAAI,kBAAkB,CAAC;QAEnE,qEAAqE;QACrE,qEAAqE;QACrE,4EAA4E;QAC5E,mFAAmF;QACnF,uGAAuG;QACvG,gEAAgE;QAChE,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACvB,aAAa,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;QACjC,CAAC;QACD,aAAa,CAAC,OAAO,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO;QACL,UAAU;QACV,MAAM;QACN,SAAS;QACT,SAAS;QACT,aAAa;QACb,eAAe;KAChB,CAAC;AACJ,CAAC,CAAC;AAhEW,QAAA,cAAc,kBAgEzB"}

package/_cjs/components/Header/NavigationTabs.js

@@ -2,9 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NavigationTabs = void 0;
 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 providers_1 = require("../../providers");
 const stores_1 = require("../../stores");
 const Header_style_1 = require("./Header.style");
 const Tabs_1 = require("../Tabs");
@@ -14,11 +12,11 @@ const NavigationTabs = () => {
         state.state,
         state.setState,
     ]);
-    const { setValue } = (0, react_hook_form_1.useFormContext)();
+    const { setFieldValue } = (0, stores_1.useFieldActions)();
     const handleChange = (_, value) => {
-        setValue(providers_1.FormKey.FromAmount, '');
-        setValue(providers_1.FormKey.FromToken, '');
-        setValue(providers_1.FormKey.ToToken, '');
+        setFieldValue('fromAmount', '');
+        setFieldValue('fromToken', '');
+        setFieldValue('toToken', '');
         setState(value === 0 ? 'swap' : 'bridge');
     };
     return ((0, jsx_runtime_1.jsx)(Header_style_1.HeaderAppBar, { elevation: 0, sx: { py: 1 }, children: (0, jsx_runtime_1.jsxs)(Header_style_1.SplitTabs, { value: state === 'swap' ? 0 : 1, onChange: handleChange, "aria-label": "tabs", indicatorColor: "primary", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tab, { label: t('header.swap'), disableRipple: true }), (0, jsx_runtime_1.jsx)(Tabs_1.Tab, { label: t('header.bridge'), disableRipple: true })] }) }));