@layerswap/widget 1.1.3 → 1.1.4

package/dist/esm/Models/Theme.js

@@ -1,35 +1,4 @@
 export const THEME_COLORS = {
-    "imxMarketplace": {
-        buttonTextColor: '255, 255, 255',
-        tertiary: '140, 152, 192',
-        logo: '255, 255, 255',
-        primary: {
-            DEFAULT: '46, 236, 255',
-            '100': '209, 251, 255',
-            '200': '168, 247, 255',
-            '300': '128, 243, 255',
-            '400': '87, 240, 255',
-            '500': '46, 236, 255',
-            '600': '0, 232, 255',
-            '700': '0, 172, 189',
-            '800': '0, 121, 133',
-            '900': '0, 70, 77',
-            'text': '255, 255, 255',
-        },
-        secondary: {
-            DEFAULT: '17, 29, 54',
-            '100': '46, 59, 147',
-            '200': '35, 42, 112',
-            '300': '32, 41, 101',
-            '400': '28, 39, 89',
-            '500': '22, 37, 70',
-            '600': '20, 33, 62',
-            '700': '17, 29, 54',
-            '800': '15, 25, 47',
-            '900': '12, 21, 39',
-            'text': '209, 251, 255',
-        },
-    },
     "light": {
         tertiary: '134, 134, 134',
         buttonTextColor: '17, 17, 17',
@@ -65,7 +34,7 @@ export const THEME_COLORS = {
         tertiary: '118, 128, 147',
         buttonTextColor: '228, 229, 240',
         logo: '255, 0, 147',
-        borderRadius: 'medium',
+        borderRadius: 'default',
         warning: {
             Foreground: '255, 201, 74',
             Background: '47, 43, 29',
@@ -105,49 +74,6 @@ export const THEME_COLORS = {
             'text': '163, 173, 194',
         },
     },
-    "halloween": {
-        tertiary: "110, 80, 140",
-        buttonTextColor: "255, 240, 200",
-        logo: '255, 0, 147',
-        warning: {
-            Foreground: "255, 180, 70",
-            Background: "45, 30, 10",
-        },
-        error: {
-            Foreground: "255, 90, 90",
-            Background: "40, 15, 15",
-        },
-        success: {
-            Foreground: "150, 255, 180",
-            Background: "20, 40, 25",
-        },
-        primary: {
-            DEFAULT: "230, 80, 25",
-            "100": "255, 180, 120",
-            "200": "255, 150, 70",
-            "300": "255, 120, 50",
-            "400": "255, 100, 30",
-            "500": "230, 80, 25",
-            "600": "190, 60, 20",
-            "700": "150, 45, 15",
-            "800": "100, 30, 10",
-            "900": "50, 15, 5",
-            "text": "255, 240, 200",
-        },
-        secondary: {
-            DEFAULT: "35, 25, 60",
-            "100": "90, 75, 130",
-            "200": "75, 60, 120",
-            "300": "60, 50, 110",
-            "400": "50, 40, 90",
-            "500": "40, 30, 75",
-            "600": "30, 25, 65",
-            "700": "25, 20, 55",
-            "800": "18, 15, 45",
-            "900": "12, 10, 35",
-            "text": "220, 210, 250",
-        },
-    },
     "ton": {
         tertiary: '134, 134, 134',
         buttonTextColor: '15, 15, 15',

package/dist/esm/components/Buttons/connectButton.js

@@ -5,6 +5,6 @@ const ConnectButton = ({ children, className, }) => {
     const { providers } = useWallet();
     const filteredProviders = providers.filter(p => !!p.autofillSupportedNetworks);
     const { connect } = useConnectModal();
-    return (_jsx("button", { onClick: async () => { await connect(); }, type: "button", "aria-label": "Connect wallet", disabled: filteredProviders.length == 0, className: `${className} disabled:opacity-50 disabled:cursor-not-allowed enabled:active:animate-press-down`, children: children }));
+    return (_jsx("button", { onClick: async () => { await connect(); }, "data-attr": "connect-wallet", type: "button", "aria-label": "Connect wallet", disabled: filteredProviders.length == 0, className: `${className} disabled:opacity-50 disabled:cursor-not-allowed enabled:active:animate-press-down`, children: children }));
 };
 export default ConnectButton;

package/dist/esm/components/Common/ConnectWalletButton.js

@@ -17,7 +17,7 @@ const ConnectWalletButton = ({ provider, onConnect, descriptionText, ...rest })
             onConnect(result);
         setIsLoading(false);
     };
-    return _jsx("button", { ...rest, type: "button", onClick: handleConnect, disabled: !isProviderReady || rest.disabled, className: classNames(`py-5 px-6 bg-secondary-500 hover:bg-secondary-400 transition-colors duration-200 rounded-xl ${(isLoading || !isProviderReady) && 'cursor-progress opacity-80'} disabled:opacity-50 disabled:cursor-not-allowed`, rest.className), children: _jsxs("div", { className: "flex flex-row justify-between gap-9 items-stretch", children: [_jsx(ResolveConnectorIcon, { connector: provider?.name, iconClassName: "w-10 h-10 p-0.5 rounded-lg bg-secondary-800 border border-secondary-400", className: "grid grid-cols-2 gap-1 min-w-fit" }), _jsxs("div", { className: "h-full space-y-2", children: [_jsx("p", { className: "text-sm font-medium text-secondary-text text-start", children: descriptionText ?? 'Connect your wallet to browse and select from your addresses' }), _jsx("div", { className: "bg-primary-700/30 border-none text-primary! py-2 rounded-lg text-base font-semibold", children: !isProviderReady ?
+    return _jsx("button", { ...rest, type: "button", onClick: handleConnect, "data-attr": "connect-wallet", disabled: !isProviderReady || rest.disabled, className: classNames(`py-5 px-6 bg-secondary-500 hover:bg-secondary-400 transition-colors duration-200 rounded-xl ${(isLoading || !isProviderReady) && 'cursor-progress opacity-80'} disabled:opacity-50 disabled:cursor-not-allowed`, rest.className), children: _jsxs("div", { className: "flex flex-row justify-between gap-9 items-stretch", children: [_jsx(ResolveConnectorIcon, { connector: provider?.name, iconClassName: "w-10 h-10 p-0.5 rounded-lg bg-secondary-800 border border-secondary-400", className: "grid grid-cols-2 gap-1 min-w-fit" }), _jsxs("div", { className: "h-full space-y-2", children: [_jsx("p", { className: "text-sm font-medium text-secondary-text text-start", children: descriptionText ?? 'Connect your wallet to browse and select from your addresses' }), _jsx("div", { className: "bg-primary-700/30 border-none text-primary! py-2 rounded-lg text-base font-semibold", children: !isProviderReady ?
                                 _jsxs("div", { className: "flex items-center gap-1 justify-center", children: [_jsx(RefreshCw, { className: "h-3 w-auto animate-spin" }), _jsx("span", { className: "ml-1", children: "Initializing..." })] })
                                 :
                                     isLoading ?

package/dist/esm/components/Icons/CircularLoader.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const CircularLoader = (props) => {
-    return _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "33", viewBox: "0 0 32 33", fill: "none", ...props, children: [_jsx("path", { "fill-rule": "evenodd", clipRule: "evenodd", d: "M30.4172 18.2327C31.26 18.4985 31.7278 19.3971 31.4621 20.2398L31.0633 21.5045L30.5291 22.7942L29.8845 24.0325L29.1345 25.2098L28.2847 26.3173L27.3416 27.3465L26.3124 28.2896L25.2049 29.1394L24.0275 29.8894L22.8513 30.5017C22.0675 30.9098 21.1013 30.6051 20.6933 29.8213C20.2852 29.0375 20.5899 28.0713 21.3737 27.6633L22.426 27.1155L23.3677 26.5156L24.2535 25.8359L25.0767 25.0816L25.831 24.2584L26.5107 23.3726L27.1106 22.4309L27.6261 21.4406L28.0534 20.409L28.4102 19.2776C28.6759 18.4348 29.5745 17.967 30.4172 18.2327Z", fill: "#E42575" }), _jsx("path", { "fill-rule": "evenodd", clipRule: "evenodd", d: "M30.5546 15.0937C29.6919 15.2849 28.8375 14.7406 28.6462 13.8779L28.3895 12.7197L28.0537 11.6548L27.6264 10.6233L27.1109 9.63291L26.511 8.69125L25.8313 7.80545L25.077 6.98226L24.2538 6.22795L23.368 5.54825L22.4263 4.94834L21.436 4.43279L20.4044 4.00552L19.3396 3.66977L18.2495 3.42811L17.1425 3.28238L16.0271 3.23367L14.9116 3.28238L13.8047 3.42811L12.7146 3.66977L11.6498 4.00551L10.6182 4.43279L9.62786 4.94834L8.68618 5.54825L7.80038 6.22795L6.9772 6.98226L6.22288 7.80545L5.54319 8.69124L4.94329 9.6329L4.42772 10.6233L4.00046 11.6548L3.66471 12.7197L3.42305 13.8097L3.27731 14.9167L3.22861 16.0322L3.27731 17.1476L3.42305 18.2546L3.66471 19.3446L4.00045 20.4095L4.42772 21.441L4.94328 22.4314L5.54319 23.3731L6.22288 24.2588L6.9772 25.082L7.80039 25.8364L8.68617 26.516L9.62787 27.116L10.6182 27.6315L11.6497 28.0588L12.7146 28.3945L13.8047 28.6362L14.9116 28.7819L16.0969 28.8337C16.9797 28.8722 17.6641 29.6191 17.6256 30.5019C17.587 31.3848 16.8401 32.0692 15.9573 32.0306L14.6325 31.9728L13.2485 31.7906L11.8856 31.4884L10.5542 31.0687L9.26455 30.5345L8.02632 29.8899L6.84899 29.1398L5.74151 28.29L4.7123 27.3469L3.76921 26.3177L2.9194 25.2102L2.16936 24.0329L1.52478 22.7947L0.990575 21.505L0.570802 20.1737L0.268661 18.8108L0.0864524 17.4268L0.0255624 16.0321L0.0864562 14.6375L0.268663 13.2535L0.570804 11.8907L0.990572 10.5593L1.52478 9.26961L2.16936 8.03139L2.91941 6.85405L3.76921 5.74657L4.7123 4.71736L5.7415 3.77427L6.84899 2.92447L8.02632 2.17442L9.26455 1.52984L10.5542 0.995635L11.8856 0.575864L13.2485 0.273725L14.6325 0.0915153L16.0271 0.030625L17.4217 0.091515L18.8057 0.273724L20.1686 0.575863L21.4999 0.995635L22.7896 1.52984L24.0278 2.17442L25.2052 2.92447L26.3127 3.77427L27.3419 4.71736L28.285 5.74657L29.1348 6.85405L29.8848 8.03139L30.5294 9.26961L31.0636 10.5593L31.4834 11.8907L31.7704 13.1853C31.9616 14.048 31.4173 14.9024 30.5546 15.0937Z", fill: "#F8C8DC" })] });
+    return _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "33", viewBox: "0 0 32 33", fill: "none", ...props, children: [_jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M30.4172 18.2327C31.26 18.4985 31.7278 19.3971 31.4621 20.2398L31.0633 21.5045L30.5291 22.7942L29.8845 24.0325L29.1345 25.2098L28.2847 26.3173L27.3416 27.3465L26.3124 28.2896L25.2049 29.1394L24.0275 29.8894L22.8513 30.5017C22.0675 30.9098 21.1013 30.6051 20.6933 29.8213C20.2852 29.0375 20.5899 28.0713 21.3737 27.6633L22.426 27.1155L23.3677 26.5156L24.2535 25.8359L25.0767 25.0816L25.831 24.2584L26.5107 23.3726L27.1106 22.4309L27.6261 21.4406L28.0534 20.409L28.4102 19.2776C28.6759 18.4348 29.5745 17.967 30.4172 18.2327Z", fill: "#E42575" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M30.5546 15.0937C29.6919 15.2849 28.8375 14.7406 28.6462 13.8779L28.3895 12.7197L28.0537 11.6548L27.6264 10.6233L27.1109 9.63291L26.511 8.69125L25.8313 7.80545L25.077 6.98226L24.2538 6.22795L23.368 5.54825L22.4263 4.94834L21.436 4.43279L20.4044 4.00552L19.3396 3.66977L18.2495 3.42811L17.1425 3.28238L16.0271 3.23367L14.9116 3.28238L13.8047 3.42811L12.7146 3.66977L11.6498 4.00551L10.6182 4.43279L9.62786 4.94834L8.68618 5.54825L7.80038 6.22795L6.9772 6.98226L6.22288 7.80545L5.54319 8.69124L4.94329 9.6329L4.42772 10.6233L4.00046 11.6548L3.66471 12.7197L3.42305 13.8097L3.27731 14.9167L3.22861 16.0322L3.27731 17.1476L3.42305 18.2546L3.66471 19.3446L4.00045 20.4095L4.42772 21.441L4.94328 22.4314L5.54319 23.3731L6.22288 24.2588L6.9772 25.082L7.80039 25.8364L8.68617 26.516L9.62787 27.116L10.6182 27.6315L11.6497 28.0588L12.7146 28.3945L13.8047 28.6362L14.9116 28.7819L16.0969 28.8337C16.9797 28.8722 17.6641 29.6191 17.6256 30.5019C17.587 31.3848 16.8401 32.0692 15.9573 32.0306L14.6325 31.9728L13.2485 31.7906L11.8856 31.4884L10.5542 31.0687L9.26455 30.5345L8.02632 29.8899L6.84899 29.1398L5.74151 28.29L4.7123 27.3469L3.76921 26.3177L2.9194 25.2102L2.16936 24.0329L1.52478 22.7947L0.990575 21.505L0.570802 20.1737L0.268661 18.8108L0.0864524 17.4268L0.0255624 16.0321L0.0864562 14.6375L0.268663 13.2535L0.570804 11.8907L0.990572 10.5593L1.52478 9.26961L2.16936 8.03139L2.91941 6.85405L3.76921 5.74657L4.7123 4.71736L5.7415 3.77427L6.84899 2.92447L8.02632 2.17442L9.26455 1.52984L10.5542 0.995635L11.8856 0.575864L13.2485 0.273725L14.6325 0.0915153L16.0271 0.030625L17.4217 0.091515L18.8057 0.273724L20.1686 0.575863L21.4999 0.995635L22.7896 1.52984L24.0278 2.17442L25.2052 2.92447L26.3127 3.77427L27.3419 4.71736L28.285 5.74657L29.1348 6.85405L29.8848 8.03139L30.5294 9.26961L31.0636 10.5593L31.4834 11.8907L31.7704 13.1853C31.9616 14.048 31.4173 14.9024 30.5546 15.0937Z", fill: "#F8C8DC" })] });
 };
 export default CircularLoader;

package/dist/esm/components/Icons/MenuIcon.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const MenuIcon = (props) => {
-    return _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", ...props, children: [_jsx("path", { "fill-rule": "evenodd", clipRule: "evenodd", d: "M8 8C8.55228 8 9 7.55228 9 7C9 6.44772 8.55228 6 8 6C7.44772 6 7 6.44772 7 7C7 7.55228 7.44772 8 8 8ZM8 9C9.10457 9 10 8.10457 10 7C10 5.89543 9.10457 5 8 5C6.89543 5 6 5.89543 6 7C6 8.10457 6.89543 9 8 9Z", fill: "#A3ADC2" }), _jsx("path", { d: "M7.13477 6.5C7.04953 6.64718 7 6.81768 7 7C7 7.18232 7.04953 7.35282 7.13477 7.5H4.5C4.22386 7.5 4 7.27614 4 7C4 6.72386 4.22386 6.5 4.5 6.5H7.13477ZM19.5 6.5C19.7761 6.5 20 6.72386 20 7C20 7.27614 19.7761 7.5 19.5 7.5H8.86523C8.95047 7.35282 9 7.18232 9 7C9 6.81768 8.95047 6.64718 8.86523 6.5H19.5Z", fill: "#A3ADC2" }), _jsx("path", { d: "M14.0654 11.5C14.0242 11.66 14 11.8271 14 12C14 12.1729 14.0242 12.34 14.0654 12.5H4.5C4.22386 12.5 4 12.2761 4 12C4 11.7239 4.22386 11.5 4.5 11.5H14.0654ZM19.5 11.5C19.7761 11.5 20 11.7239 20 12C20 12.2761 19.7761 12.5 19.5 12.5H17.9346C17.9758 12.34 18 12.1729 18 12C18 11.8271 17.9758 11.66 17.9346 11.5H19.5Z", fill: "#A3ADC2" }), _jsx("path", { "fill-rule": "evenodd", clipRule: "evenodd", d: "M16 13C16.5523 13 17 12.5523 17 12C17 11.4477 16.5523 11 16 11C15.4477 11 15 11.4477 15 12C15 12.5523 15.4477 13 16 13ZM16 14C17.1046 14 18 13.1046 18 12C18 10.8954 17.1046 10 16 10C14.8954 10 14 10.8954 14 12C14 13.1046 14.8954 14 16 14Z", fill: "#A3ADC2" }), _jsx("path", { d: "M6.06543 16.5C6.0242 16.66 6 16.8271 6 17C6 17.1729 6.0242 17.34 6.06543 17.5H4.5C4.22386 17.5 4 17.2761 4 17C4 16.7239 4.22386 16.5 4.5 16.5H6.06543ZM19.5 16.5C19.7761 16.5 20 16.7239 20 17C20 17.2761 19.7761 17.5 19.5 17.5H9.93457C9.9758 17.34 10 17.1729 10 17C10 16.8271 9.9758 16.66 9.93457 16.5H19.5Z", fill: "#A3ADC2" }), _jsx("path", { "fill-rule": "evenodd", clipRule: "evenodd", d: "M8 18C8.55228 18 9 17.5523 9 17C9 16.4477 8.55228 16 8 16C7.44772 16 7 16.4477 7 17C7 17.5523 7.44772 18 8 18ZM8 19C9.10457 19 10 18.1046 10 17C10 15.8954 9.10457 15 8 15C6.89543 15 6 15.8954 6 17C6 18.1046 6.89543 19 8 19Z", fill: "#A3ADC2" })] });
+    return _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", ...props, children: [_jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 8C8.55228 8 9 7.55228 9 7C9 6.44772 8.55228 6 8 6C7.44772 6 7 6.44772 7 7C7 7.55228 7.44772 8 8 8ZM8 9C9.10457 9 10 8.10457 10 7C10 5.89543 9.10457 5 8 5C6.89543 5 6 5.89543 6 7C6 8.10457 6.89543 9 8 9Z", fill: "#A3ADC2" }), _jsx("path", { d: "M7.13477 6.5C7.04953 6.64718 7 6.81768 7 7C7 7.18232 7.04953 7.35282 7.13477 7.5H4.5C4.22386 7.5 4 7.27614 4 7C4 6.72386 4.22386 6.5 4.5 6.5H7.13477ZM19.5 6.5C19.7761 6.5 20 6.72386 20 7C20 7.27614 19.7761 7.5 19.5 7.5H8.86523C8.95047 7.35282 9 7.18232 9 7C9 6.81768 8.95047 6.64718 8.86523 6.5H19.5Z", fill: "#A3ADC2" }), _jsx("path", { d: "M14.0654 11.5C14.0242 11.66 14 11.8271 14 12C14 12.1729 14.0242 12.34 14.0654 12.5H4.5C4.22386 12.5 4 12.2761 4 12C4 11.7239 4.22386 11.5 4.5 11.5H14.0654ZM19.5 11.5C19.7761 11.5 20 11.7239 20 12C20 12.2761 19.7761 12.5 19.5 12.5H17.9346C17.9758 12.34 18 12.1729 18 12C18 11.8271 17.9758 11.66 17.9346 11.5H19.5Z", fill: "#A3ADC2" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16 13C16.5523 13 17 12.5523 17 12C17 11.4477 16.5523 11 16 11C15.4477 11 15 11.4477 15 12C15 12.5523 15.4477 13 16 13ZM16 14C17.1046 14 18 13.1046 18 12C18 10.8954 17.1046 10 16 10C14.8954 10 14 10.8954 14 12C14 13.1046 14.8954 14 16 14Z", fill: "#A3ADC2" }), _jsx("path", { d: "M6.06543 16.5C6.0242 16.66 6 16.8271 6 17C6 17.1729 6.0242 17.34 6.06543 17.5H4.5C4.22386 17.5 4 17.2761 4 17C4 16.7239 4.22386 16.5 4.5 16.5H6.06543ZM19.5 16.5C19.7761 16.5 20 16.7239 20 17C20 17.2761 19.7761 17.5 19.5 17.5H9.93457C9.9758 17.34 10 17.1729 10 17C10 16.8271 9.9758 16.66 9.93457 16.5H19.5Z", fill: "#A3ADC2" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 18C8.55228 18 9 17.5523 9 17C9 16.4477 8.55228 16 8 16C7.44772 16 7 16.4477 7 17C7 17.5523 7.44772 18 8 18ZM8 19C9.10457 19 10 18.1046 10 17C10 15.8954 9.10457 15 8 15C6.89543 15 6 15.8954 6 17C6 18.1046 6.89543 19 8 19Z", fill: "#A3ADC2" })] });
 };
 export default MenuIcon;

package/dist/esm/components/Icons/Wallets/Solflare.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const Solflare = (props) => {
-    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "290", height: "290", viewBox: "0 0 290 290", fill: "none", ...props, children: [_jsxs("g", { "clip-path": "url(#clip0_1796_821)", children: [_jsx("rect", { width: "290", height: "290", fill: "#FFEF46" }), _jsx("mask", { id: "mask0_1796_821", style: { "maskType": "luminance" }, maskUnits: "userSpaceOnUse", x: "0", y: "0", width: "290", height: "290", children: _jsx("path", { d: "M290 0H0V290H290V0Z", fill: "white" }) }), _jsxs("g", { mask: "url(#mask0_1796_821)", children: [_jsx("path", { d: "M63.2951 1H226.705C261.11 1 289 28.8905 289 63.2951V226.705C289 261.11 261.11 289 226.705 289H63.2951C28.8905 289 1 261.11 1 226.705V63.2951C1 28.8905 28.8905 1 63.2951 1Z", fill: "#FFEF46" }), _jsx("path", { d: "M140.548 153.231L154.832 139.432L181.462 148.147C198.893 153.958 207.609 164.61 207.609 179.62C207.609 190.999 203.251 198.504 194.536 208.188L191.873 211.093L192.841 204.314C196.714 179.62 189.452 168.968 165.484 161.22L140.548 153.231ZM104.717 68.739L177.347 92.9488L161.61 107.959L123.843 95.3698C110.77 91.012 106.412 83.9911 104.717 69.2232V68.739ZM100.359 191.725L116.822 175.988L147.811 186.157C164.031 191.483 169.599 198.504 167.905 216.177L100.359 191.725ZM79.539 121.516C79.539 116.917 81.9599 112.559 86.0756 108.927C90.4334 115.222 97.9384 120.79 109.801 124.664L135.464 133.137L121.18 146.937L96.0016 138.705C84.3809 134.832 79.539 129.021 79.539 121.516ZM155.558 248.618C208.819 213.272 237.387 189.304 237.387 159.768C237.387 140.158 225.766 129.263 200.104 120.79L180.736 114.253L233.756 63.4128L223.103 52.0342L207.367 65.8337L133.043 41.3818C110.043 48.8869 80.9916 70.9178 80.9916 92.9487C80.9916 95.3697 81.2337 97.7907 81.96 100.454C62.8342 111.348 55.0871 121.516 55.0871 134.105C55.0871 145.968 61.3816 157.831 81.4758 164.368L97.4542 169.694L42.2559 222.713L52.9082 234.092L70.0972 218.356L155.558 248.618Z", fill: "#02050A" })] })] }), _jsx("defs", { children: _jsx("clipPath", { id: "clip0_1796_821", children: _jsx("rect", { width: "290", height: "290", fill: "white" }) }) })] }));
+    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "290", height: "290", viewBox: "0 0 290 290", fill: "none", ...props, children: [_jsxs("g", { clipPath: "url(#clip0_1796_821)", children: [_jsx("rect", { width: "290", height: "290", fill: "#FFEF46" }), _jsx("mask", { id: "mask0_1796_821", style: { "maskType": "luminance" }, maskUnits: "userSpaceOnUse", x: "0", y: "0", width: "290", height: "290", children: _jsx("path", { d: "M290 0H0V290H290V0Z", fill: "white" }) }), _jsxs("g", { mask: "url(#mask0_1796_821)", children: [_jsx("path", { d: "M63.2951 1H226.705C261.11 1 289 28.8905 289 63.2951V226.705C289 261.11 261.11 289 226.705 289H63.2951C28.8905 289 1 261.11 1 226.705V63.2951C1 28.8905 28.8905 1 63.2951 1Z", fill: "#FFEF46" }), _jsx("path", { d: "M140.548 153.231L154.832 139.432L181.462 148.147C198.893 153.958 207.609 164.61 207.609 179.62C207.609 190.999 203.251 198.504 194.536 208.188L191.873 211.093L192.841 204.314C196.714 179.62 189.452 168.968 165.484 161.22L140.548 153.231ZM104.717 68.739L177.347 92.9488L161.61 107.959L123.843 95.3698C110.77 91.012 106.412 83.9911 104.717 69.2232V68.739ZM100.359 191.725L116.822 175.988L147.811 186.157C164.031 191.483 169.599 198.504 167.905 216.177L100.359 191.725ZM79.539 121.516C79.539 116.917 81.9599 112.559 86.0756 108.927C90.4334 115.222 97.9384 120.79 109.801 124.664L135.464 133.137L121.18 146.937L96.0016 138.705C84.3809 134.832 79.539 129.021 79.539 121.516ZM155.558 248.618C208.819 213.272 237.387 189.304 237.387 159.768C237.387 140.158 225.766 129.263 200.104 120.79L180.736 114.253L233.756 63.4128L223.103 52.0342L207.367 65.8337L133.043 41.3818C110.043 48.8869 80.9916 70.9178 80.9916 92.9487C80.9916 95.3697 81.2337 97.7907 81.96 100.454C62.8342 111.348 55.0871 121.516 55.0871 134.105C55.0871 145.968 61.3816 157.831 81.4758 164.368L97.4542 169.694L42.2559 222.713L52.9082 234.092L70.0972 218.356L155.558 248.618Z", fill: "#02050A" })] })] }), _jsx("defs", { children: _jsx("clipPath", { id: "clip0_1796_821", children: _jsx("rect", { width: "290", height: "290", fill: "white" }) }) })] }));
 };
 export default Solflare;

package/dist/esm/components/Input/Amount/MinMax.js

@@ -22,8 +22,15 @@ const MinMax = (props) => {
     const native_currency = gasData?.token || from?.token;
     const shouldPayGasWithTheToken = (native_currency?.symbol === fromCurrency?.symbol) || !native_currency;
     let maxAllowedAmount = useMemo(() => {
-        return resolveMaxAllowedAmount({ fromCurrency, limitsMaxAmount, walletBalance, gasAmount, native_currency, depositMethod });
+        return resolveMaxAllowedAmount({ fromCurrency, limitsMaxAmount, walletBalance, gasAmount, native_currency, depositMethod }) || 0;
     }, [fromCurrency, limitsMinAmount, limitsMaxAmount, walletBalance, gasAmount, native_currency, depositMethod]);
+    const minAmount = useMemo(() => {
+        if (walletBalance && walletBalance.amount !== undefined && limitsMinAmount !== undefined) {
+            return Number(walletBalance.amount) < limitsMinAmount ? Number(walletBalance.amount) : limitsMinAmount;
+        }
+        return limitsMinAmount || (fromCurrency.price_in_usd > 0 ? 0.01 / fromCurrency.price_in_usd : 0.01);
+    }, [walletBalance, limitsMinAmount, fromCurrency.price_in_usd]);
+    const halfOfBalance = (walletBalance?.amount || maxAllowedAmount) ? (walletBalance?.amount || maxAllowedAmount) / 2 : 0;
     const handleSetValue = (value) => {
         mutateBalances();
         setFieldValue('amount', value, true);
@@ -32,38 +39,24 @@ const MinMax = (props) => {
     const handleSetMinAmount = (e) => {
         e.preventDefault();
         e.stopPropagation();
-        if (!limitsMinAmount)
-            throw new Error("Wallet balance is not available");
-        handleSetValue(limitsMinAmount.toString());
+        handleSetValue(minAmount.toString());
     };
     const handleSetHalfAmount = async (e) => {
         e.preventDefault();
         e.stopPropagation();
-        if (!walletBalance?.amount)
-            throw new Error("Wallet balance is not available");
-        handleSetValue((walletBalance?.amount / 2).toString());
+        handleSetValue(halfOfBalance.toString());
     };
     const handleSetMaxAmount = async (e) => {
         e.preventDefault();
         e.stopPropagation();
-        if (!maxAllowedAmount)
-            throw new Error("Max amount is not available");
         handleSetValue(maxAllowedAmount.toString());
     };
-    const halfOfBalance = (walletBalance?.amount || 0) / 2;
     const showMaxTooltip = !!(depositMethod === 'wallet' && walletBalance?.amount && shouldPayGasWithTheToken && (!limitsMaxAmount || walletBalance.amount < limitsMaxAmount));
-    return (_jsxs("div", { className: "flex gap-1.5 group text-xs leading-4", onMouseLeave: () => onActionHover(undefined), children: [Number(limitsMinAmount) > 0 ?
-                _jsx(ActionButton, { label: "Min", onMouseEnter: () => onActionHover(limitsMinAmount), onClick: handleSetMinAmount, disabled: !limitsMinAmount })
-                :
-                    null, (depositMethod === 'wallet' && halfOfBalance > 0 && (halfOfBalance < (maxAllowedAmount || Infinity))) ?
-                _jsx(ActionButton, { label: "50%", onMouseEnter: () => onActionHover(halfOfBalance), onClick: handleSetHalfAmount })
-                :
-                    null, Number(maxAllowedAmount) > 0 ?
-                _jsxs(Tooltip, { disableHoverableContent: true, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("div", { children: _jsx(ActionButton, { label: "Max", onMouseEnter: () => onActionHover(maxAllowedAmount), disabled: !maxAllowedAmount, onClick: handleSetMaxAmount }) }) }), showMaxTooltip ? _jsx(TooltipContent, { className: "pointer-events-none w-80 grow p-2 !border-none !bg-secondary-300 text-xs rounded-xl", side: "top", align: "start", alignOffset: -10, children: _jsx("p", { children: "Max is calculated based on your balance minus gas fee for the transaction" }) }) : null] })
-                :
-                    null] }));
+    if (!from || !fromCurrency)
+        return null;
+    return (_jsxs("div", { className: "flex gap-1.5 group text-xs leading-4", onMouseLeave: () => onActionHover(undefined), children: [_jsx(ActionButton, { "data-attr": "min-amount", label: "Min", onMouseEnter: () => onActionHover(minAmount), onClick: handleSetMinAmount }), _jsx(ActionButton, { "data-attr": "half-amount", label: "50%", onMouseEnter: () => onActionHover(halfOfBalance), onClick: handleSetHalfAmount }), _jsxs(Tooltip, { disableHoverableContent: true, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(ActionButton, { "data-attr": "max-amount", label: "Max", onMouseEnter: () => onActionHover(maxAllowedAmount), onClick: handleSetMaxAmount }) }), showMaxTooltip ? _jsx(TooltipContent, { className: "pointer-events-none w-80 grow p-2 border-none! bg-secondary-300! text-xs rounded-xl!", side: "top", align: "start", alignOffset: -10, children: _jsx("p", { children: "Max is calculated based on your balance minus gas fee for the transaction" }) }) : null] })] }));
 };
 export default MinMax;
-const ActionButton = ({ label, onClick, onMouseEnter, disabled }) => {
-    return (_jsx("button", { onMouseEnter: onMouseEnter, onClick: onClick, typeof: "button", type: "button", disabled: disabled, className: "px-1.5 py-0.5 rounded-md duration-200 break-keep transition bg-secondary-300 hover:bg-secondary-200 text-secondary-text hover:text-primary-buttonTextColor cursor-pointer enabled:active:animate-press-down", children: label }));
+const ActionButton = ({ label, onClick, onMouseEnter, disabled, ...rest }) => {
+    return (_jsx("button", { ...rest, onMouseEnter: onMouseEnter, onClick: onClick, typeof: "button", type: "button", disabled: disabled, className: "px-1.5 py-0.5 rounded-md duration-200 break-keep transition bg-secondary-300 hover:bg-secondary-200 text-secondary-text hover:text-primary-buttonTextColor cursor-pointer enabled:active:animate-press-down", children: label }));
 };

package/dist/esm/components/Input/Amount/PriceImpact.js

@@ -8,7 +8,7 @@ export const PriceImpact = ({ quote, refuel, className }) => {
     const priceImpactValues = useMemo(() => quote ? resolvePriceImpactValues(quote, refuel) : undefined, [quote, refuel]);
     if (priceImpactValues === undefined)
         return null;
-    return (_jsx(_Fragment, { children: _jsxs(Tooltip, { openOnClick: true, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: clsx("flex text-secondary-text items-center cursor-default hover:text-primary-text", className, { "text-warning-foreground hover:text-warning-foreground/80": priceImpactValues.highMarketPriceImpact }), children: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsx("span", { children: "(" }), _jsx(Triangle, { fill: "currentColor", className: `w-3 h-3 stroke-1 fill-current transition-transform ${priceImpactValues.priceImpact !== undefined && priceImpactValues.priceImpact < 0 ? "rotate-180" : ""}` }), _jsxs("span", { children: ["$", Math.abs(priceImpactValues.priceImpact || 0).toFixed(2)] }), _jsx("span", { children: ")" })] }) }) }), _jsxs(TooltipContent, { arrowClasses: "!bg-secondary-500 !fill-secondary-500", side: "top", align: "center", className: "bg-secondary-500! border-secondary-500! text-secondary-text! text-xs font-normal rounded-xl p-4! shadow-card", children: [_jsxs("p", { className: clsx("text-primary-text font-medium text-sm flex items-baseline space-x-0.5 mb-1", { "text-warning-foreground": priceImpactValues.highMarketPriceImpact }), children: [priceImpactValues.highMarketPriceImpact ? (priceImpactValues.criticalMarketPriceImpact ? _jsx("span", { children: "Critical price impact:" }) : _jsx("span", { children: "High price impact:" })) : _jsx("span", { children: "Price impact:" }), _jsx("span", { children: formatCurrency(priceImpactValues.priceImpact) }), _jsx("span", { className: clsx("text-secondary-text text-xs font-normal", { "text-warning-foreground": priceImpactValues.highMarketPriceImpact }), children: priceImpactValues.priceImpactPercentage ? `(${priceImpactValues.priceImpactPercentage < 0 ? "-" : "+"}${Math.abs(priceImpactValues.priceImpactPercentage)}%)` : "" })] }), _jsx("p", { children: "This is the difference in total USD value" }), _jsx("p", { children: "between the assets you send and the assets you receive." }), _jsxs("ul", { className: "mt-3 space-y-2 ", children: [_jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Market impact" }), _jsx("span", { className: "text-primary-text", children: _jsx("span", { children: formatCurrency(priceImpactValues.marketImpact) }) })] }), _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Bridge expenses" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: priceImpactValues.bridgeExpenses?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(priceImpactValues.bridgeExpenses)).toFixed(2) })] })] }), _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Layerswap fees" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: priceImpactValues.layerswapFees?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(priceImpactValues.layerswapFees)).toFixed(2) })] })] }), refuel && _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Refuel" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: refuel?.amount_in_usd?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(refuel?.amount_in_usd)).toFixed(2) })] })] })] }), _jsx(TooltipArrow, { className: "bg-secondary-500! fill-secondary-500!" })] })] }) }));
+    return (_jsx(_Fragment, { children: _jsxs(Tooltip, { openOnClick: true, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { "data-attr": "price-impact", className: clsx("flex text-secondary-text items-center cursor-default hover:text-primary-text", className, { "text-warning-foreground hover:text-warning-foreground/80": priceImpactValues.highMarketPriceImpact }), children: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsx("span", { children: "(" }), _jsx(Triangle, { fill: "currentColor", className: `w-3 h-3 stroke-1 fill-current transition-transform ${priceImpactValues.priceImpact !== undefined && priceImpactValues.priceImpact < 0 ? "rotate-180" : ""}` }), _jsxs("span", { children: ["$", Math.abs(priceImpactValues.priceImpact || 0).toFixed(2)] }), _jsx("span", { children: ")" })] }) }) }), _jsxs(TooltipContent, { arrowClasses: "!bg-secondary-500 !fill-secondary-500", side: "top", align: "center", className: "bg-secondary-500! border-secondary-500! text-secondary-text! text-xs font-normal rounded-xl p-4! shadow-card", children: [_jsxs("p", { className: clsx("text-primary-text font-medium text-sm flex items-baseline space-x-0.5 mb-1", { "text-warning-foreground": priceImpactValues.highMarketPriceImpact }), children: [priceImpactValues.highMarketPriceImpact ? (priceImpactValues.criticalMarketPriceImpact ? _jsx("span", { children: "Critical price impact:" }) : _jsx("span", { children: "High price impact:" })) : _jsx("span", { children: "Price impact:" }), _jsx("span", { children: formatCurrency(priceImpactValues.priceImpact) }), _jsx("span", { className: clsx("text-secondary-text text-xs font-normal", { "text-warning-foreground": priceImpactValues.highMarketPriceImpact }), children: priceImpactValues.priceImpactPercentage ? `(${priceImpactValues.priceImpactPercentage < 0 ? "-" : "+"}${Math.abs(priceImpactValues.priceImpactPercentage)}%)` : "" })] }), _jsx("p", { children: "This is the difference in total USD value" }), _jsx("p", { children: "between the assets you send and the assets you receive." }), _jsxs("ul", { className: "mt-3 space-y-2 ", children: [_jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Market impact" }), _jsx("span", { className: "text-primary-text", children: _jsx("span", { children: formatCurrency(priceImpactValues.marketImpact) }) })] }), _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Bridge expenses" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: priceImpactValues.bridgeExpenses?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(priceImpactValues.bridgeExpenses)).toFixed(2) })] })] }), _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Layerswap fees" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: priceImpactValues.layerswapFees?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(priceImpactValues.layerswapFees)).toFixed(2) })] })] }), refuel && _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Refuel" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: refuel?.amount_in_usd?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(refuel?.amount_in_usd)).toFixed(2) })] })] })] }), _jsx(TooltipArrow, { className: "bg-secondary-500! fill-secondary-500!" })] })] }) }));
 };
 const formatCurrency = (value, decimals = 2) => {
     if (value === undefined || isNaN(value))

package/dist/esm/components/Input/Amount/helpers.js

@@ -1,10 +1,10 @@
 export const resolveMaxAllowedAmount = (props) => {
     const { limitsMaxAmount, walletBalance, gasAmount, fromCurrency, native_currency, depositMethod } = props;
-    if (!walletBalance || !walletBalance.amount || (limitsMaxAmount && walletBalance.amount > limitsMaxAmount) || depositMethod !== 'wallet')
+    if (!walletBalance || isNaN(Number(walletBalance.amount)) || depositMethod !== 'wallet')
         return limitsMaxAmount;
-    const shouldPayGasWithTheToken = (native_currency?.symbol === fromCurrency?.symbol) || !native_currency;
-    const payableAmount = walletBalance.amount - gasAmount;
+    const shouldPayGasWithTheToken = Number(walletBalance.amount) > 0 && (native_currency?.symbol === fromCurrency?.symbol) || !native_currency;
+    const payableAmount = Number(walletBalance.amount) - gasAmount;
     if (!shouldPayGasWithTheToken)
-        return walletBalance.amount;
+        return isNaN(Number(walletBalance.amount)) ? 0 : Number(walletBalance.amount);
     return Number(Number(payableAmount).toFixed(fromCurrency?.decimals));
 };

package/dist/esm/components/Input/CexPicker.js

@@ -40,7 +40,7 @@ const CexPicker = () => {
             setFieldValue
         });
     }, [direction, values]);
-    return (_jsx("div", { className: "flex w-full flex-col self-end relative ml-auto items-center", children: _jsxs(Selector, { children: [_jsx(SelectorTrigger, { disabled: false, className: "bg-secondary-500 !p-3", children: _jsx(SelectedExchangeDisplay, { exchange: fromExchange, placeholder: "Select Exchange" }) }), _jsx(SelectorContent, { isLoading: isLoading, searchHint: "Search", children: ({ closeModal, shouldFocus }) => {
+    return (_jsx("div", { className: "flex w-full flex-col self-end relative ml-auto items-center", children: _jsxs(Selector, { children: [_jsx(SelectorTrigger, { "data-attr": "from-cex-picker", disabled: false, className: "bg-secondary-500 !p-3", children: _jsx(SelectedExchangeDisplay, { exchange: fromExchange, placeholder: "Select Exchange" }) }), _jsx(SelectorContent, { isLoading: isLoading, searchHint: "Search", children: ({ closeModal, shouldFocus }) => {
                         return (_jsxs("div", { className: "overflow-y-auto flex flex-col h-full z-40 openpicker", children: [_jsx(SearchComponent, { searchQuery: searchQuery, setSearchQuery: setSearchQuery, isOpen: shouldFocus, className: "mb-2" }), _jsx(LayoutGroup, { children: _jsx(motion.div, { layoutScroll: true, className: "select-text in-has-[.hide-main-scrollbar]:overflow-y-hidden overflow-y-auto overflow-x-hidden styled-scroll pr-3 h-full", children: _jsx("div", { className: "relative", children: filteredExchanges.map((exchange) => {
                                                 return _jsx("div", { className: "py-1 box-border", children: _jsx(ExchangeNetwork, { route: exchange, direction: direction, onSelect: (n) => {
                                                             handleSelect(n);

package/dist/esm/components/Input/DestinationWalletPicker.js

@@ -7,7 +7,7 @@ import { ImageWithFallback } from "../../components/Common/ImageWithFallback";
 import clsx from 'clsx';
 const DestinationWalletPicker = (props) => {
     const { addressItem, connectedWallet, partner, destination } = props;
-    return destination && _jsx("div", { className: clsx("flex items-center space-x-2 text-sm rounded-lg py-1 px-2 justify-self-end", {
+    return destination && _jsx("div", { "data-attr": addressItem ? "address-item" : "add-address", className: clsx("flex items-center space-x-2 text-sm rounded-lg py-1 px-2 justify-self-end", {
             "hover:bg-secondary-400": addressItem,
             "bg-secondary-400 hover:bg-secondary-300": !addressItem
         }), children: _jsxs("div", { className: "rounded-lg flex space-x-1 items-center cursor-pointer", children: [addressItem &&

package/dist/esm/components/Input/NumericInput.js

@@ -7,15 +7,15 @@ import { isScientific } from "../utils/RoundDecimals";
 const NumericInput = forwardRef(function NumericInput({ label, disabled, tempValue, placeholder, minLength, maxLength, precision, step, name, className, children, onChange, onFocus, onBlur }, ref) {
     const { handleChange } = useFormikContext();
     const [field] = useField(name);
-    const formattedTempValue = tempValue ? isScientific(tempValue)
+    const formattedTempValue = Number(tempValue) >= 0 ? isScientific(tempValue)
         ? (!isNaN(Number(tempValue))
             ? Number(tempValue).toFixed(precision ?? 0).replace(/\.?0+$/, '')
             : '')
         : tempValue?.toString()
         : '';
     return _jsxs("div", { children: [label &&
-                _jsx("label", { htmlFor: name, className: "block font-semibold text-secondary-text text-sm mb-1.5 w-full", children: label }), _jsxs("div", { className: "flex relative w-full", children: [Number(tempValue) > 0 &&
-                        _jsx("span", { className: classNames('py-2 flex text-secondary-text/45 items-center h-12 leading-4 bg-secondary-700 min-w-0 rounded-lg font-semibold border-0 ', className), ref: ref, children: _jsx("span", { children: formattedTempValue }) }), !tempValue &&
+                _jsx("label", { htmlFor: name, className: "block font-semibold text-secondary-text text-sm mb-1.5 w-full", children: label }), _jsxs("div", { className: "flex relative w-full", children: [!isNaN(Number(tempValue)) &&
+                        _jsx("span", { className: classNames('py-2 flex text-secondary-text/45 items-center h-12 leading-4 bg-secondary-700 min-w-0 rounded-lg font-semibold border-0 ', className), ref: ref, children: _jsx("span", { children: formattedTempValue }) }), isNaN(Number(tempValue)) &&
                         _jsx("input", { ...field, inputMode: "decimal", autoComplete: "off", disabled: disabled, placeholder: placeholder, autoCorrect: "off", minLength: minLength, maxLength: maxLength, onInput: (event) => { replaceComma(event); limitDecimalPlaces(event, precision); }, onFocus: onFocus, onBlur: onBlur, type: "text", step: step, name: name, id: name, ref: ref, className: classNames('disabled:cursor-not-allowed h-12 leading-4 border-secondary-500 placeholder:text-secondary-text bg-secondary-700 focus:ring-primary focus:border-primary block min-w-0 rounded-lg font-semibold border-0', className), onChange: onChange ? onChange : e => {
                                 /^[0-9]*[.,]?[0-9]*$/.test(e.target.value) && handleChange(e);
                             } }), _jsx(_Fragment, { children: children })] })] });

package/dist/esm/components/Input/RoutePicker/Routes.js

@@ -10,7 +10,6 @@ import { useSwapAccounts } from "../../../context/swapAccounts";
 import { formatUsd } from "../../../components/utils/formatUsdAmount";
 import { getTotalBalanceInUSD } from "../../../helpers/balanceHelper";
 import { useMemo } from "react";
-import { isNewListed, NewBadge } from "../../../lib/isNewListed";
 import { TokenInfoIcon, TokenTitleWithBalance } from "./TokenTitleDetails";
 export const CurrencySelectItemDisplay = (props) => {
     const { item, route, direction, type } = props;
@@ -24,8 +23,7 @@ export const NetworkTokenTitle = (props) => {
     const tokenbalance = balances?.find(b => b.token === item.symbol);
     const formatted_balance_amount = (tokenbalance?.amount || tokenbalance?.amount === 0) ? truncateDecimals(tokenbalance?.amount, item.precision) : '';
     const usdAmount = (tokenbalance?.amount && item?.price_in_usd) ? item?.price_in_usd * tokenbalance?.amount : undefined;
-    const isNewlyListed = isNewListed(item?.listing_date);
-    return _jsx(SelectItem.DetailedTitle, { title: _jsx(TokenTitleWithBalance, { item: item, route: route, tokenbalance: tokenbalance, usdAmount: usdAmount, isNewlyListed: isNewlyListed }), secondaryImageAlt: route.display_name, secondary: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { className: "truncate", children: route.display_name }), _jsx(TokenInfoIcon, { item: item, route: route, className: "xs:hidden transition-all duration-300 opacity-0 group-hover:opacity-100 group-hover:delay-400 click-delay-on-hover shrink-0" })] }), secondaryLogoSrc: route.logo, children: (tokenbalance && Number(tokenbalance?.amount) > 0) ? (_jsx("span", { className: "text-sm text-secondary-text text-right my-auto font-medium block", children: _jsx("div", { className: 'text-xs leading-4 truncate', children: formatted_balance_amount }) })) : _jsx(_Fragment, {}) });
+    return _jsx(SelectItem.DetailedTitle, { title: _jsx(TokenTitleWithBalance, { item: item, route: route, tokenbalance: tokenbalance, usdAmount: usdAmount }), secondaryImageAlt: route.display_name, secondary: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { className: "truncate", children: route.display_name }), _jsx(TokenInfoIcon, { item: item, route: route, className: "xs:hidden transition-all duration-300 opacity-0 group-hover:opacity-100 group-hover:delay-400 click-delay-on-hover shrink-0" })] }), secondaryLogoSrc: route.logo, children: (tokenbalance && Number(tokenbalance?.amount) > 0) ? (_jsx("span", { className: "text-sm text-secondary-text text-right my-auto font-medium block", children: _jsx("div", { className: 'text-xs leading-4 truncate', children: formatted_balance_amount }) })) : _jsx(_Fragment, {}) });
 };
 export const NetworkRouteSelectItemDisplay = (props) => {
     const { item, direction, hideTokenImages } = props;
@@ -38,14 +36,11 @@ export const NetworkRouteSelectItemDisplay = (props) => {
     const filteredNetworkTokens = item?.tokens?.filter(token => tokensWithBalance?.includes(token.symbol));
     const hasLoadedBalances = totalInUSD !== null && Number(totalInUSD) > 0;
     const showTokenLogos = hasLoadedBalances && filteredNetworkTokens?.length;
-    const haveNewlyListedTokens = useMemo(() => item.tokens?.some(t => isNewListed(t.listing_date)), [item]);
-    return (_jsxs(SelectItem, { className: "bg-secondary-500 group rounded-xl hover:bg-secondary-400 group/item relative pr-7 py-2", children: [_jsx(SelectItem.Logo, { imgSrc: item.logo, altText: `${item.display_name} logo`, className: "rounded-md" }), _jsx(SelectItem.Title, { children: _jsxs(_Fragment, { children: [_jsx("span", { children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { children: item.display_name }), haveNewlyListedTokens &&
-                                        _jsx(NewBadge, {})] }) }), hasLoadedBalances ? (_jsxs("div", { className: `${showTokenLogos ? "flex flex-col space-y-0.5" : ""} ${hideTokenImages ? "hidden" : ""}`, children: [_jsx("span", { className: "text-secondary-text text-sm leading-4 font-medium", children: formatUsd(totalInUSD) }), showTokenLogos ? (_jsxs("div", { className: "flex justify-end items-center -space-x-2 relative h-4", children: [filteredNetworkTokens.slice(0, 3).map((t, index) => (_jsx(ImageWithFallback, { src: t.logo, alt: `${t.symbol} logo`, height: "16", width: "16", loading: "eager", fetchPriority: 'high', className: "rounded-full object-contain" }, `${t.symbol}-${index}`))), filteredNetworkTokens.length > 3 && (_jsx("div", { className: "w-4 h-4 bg-secondary-600 text-primary-text text-[8px] rounded-full flex items-center justify-center border-2 border-background", children: _jsxs("span", { children: ["+", filteredNetworkTokens.length - 3] }) }))] })) : _jsx(_Fragment, {})] })) : _jsx(_Fragment, {}), _jsx(ChevronDown, { className: "!w-3.5 !h-3.5 absolute right-2 top-1/2 -translate-y-1/2 text-secondary-text transition-opacity duration-200 opacity-0 group-hover/item:opacity-100", "aria-hidden": "true" })] }) })] }));
+    return (_jsxs(SelectItem, { className: "bg-secondary-500 group rounded-xl hover:bg-secondary-400 group/item relative pr-7 py-2", children: [_jsx(SelectItem.Logo, { imgSrc: item.logo, altText: `${item.display_name} logo`, className: "rounded-md" }), _jsx(SelectItem.Title, { children: _jsxs(_Fragment, { children: [_jsx("span", { children: item.display_name }), hasLoadedBalances ? (_jsxs("div", { className: `${showTokenLogos ? "flex flex-col space-y-0.5" : ""} ${hideTokenImages ? "hidden" : ""}`, children: [_jsx("span", { className: "text-secondary-text text-sm leading-4 font-medium", children: formatUsd(totalInUSD) }), showTokenLogos ? (_jsxs("div", { className: "flex justify-end items-center -space-x-2 relative h-4", children: [filteredNetworkTokens.slice(0, 3).map((t, index) => (_jsx(ImageWithFallback, { src: t.logo, alt: `${t.symbol} logo`, height: "16", width: "16", loading: "eager", fetchPriority: 'high', className: "rounded-full object-contain" }, `${t.symbol}-${index}`))), filteredNetworkTokens.length > 3 && (_jsx("div", { className: "w-4 h-4 bg-secondary-600 text-primary-text text-[8px] rounded-full flex items-center justify-center border-2 border-background", children: _jsxs("span", { children: ["+", filteredNetworkTokens.length - 3] }) }))] })) : _jsx(_Fragment, {})] })) : _jsx(_Fragment, {}), _jsx(ChevronDown, { className: "w-3.5! h-3.5! absolute right-2 top-1/2 -translate-y-1/2 text-secondary-text transition-opacity duration-200 opacity-0 group-hover/item:opacity-100", "aria-hidden": "true" })] }) })] }));
 };
 export const GroupedTokenHeader = ({ item, direction, hideTokenImages }) => {
     const swapAccounts = useSwapAccounts(direction);
     const tokens = item.items;
-    const haveNewlyListedTokens = useMemo(() => tokens.some(t => isNewListed(t.route.token.listing_date)), [tokens]);
     const balances = useBalanceStore(s => s.balances);
     const networksWithBalance = Array.from(new Map(tokens
         .map(({ route }) => {
@@ -72,8 +67,7 @@ export const GroupedTokenHeader = ({ item, direction, hideTokenImages }) => {
     const mainToken = tokens[0]?.route.token;
     const hasLoadedBalances = tokenBalances.hasVale && Number(tokenBalances.sum) >= 0;
     const showNetworkIcons = hasLoadedBalances && networksWithBalance.length > 0;
-    return (_jsxs(SelectItem, { className: "bg-secondary-500 group rounded-xl hover:bg-secondary-400 group/item relative pr-7 py-2", children: [_jsx(SelectItem.Logo, { imgSrc: mainToken.logo, altText: `${mainToken.symbol} logo`, className: "rounded-full" }), _jsx(SelectItem.Title, { children: _jsxs(_Fragment, { children: [_jsx("span", { children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { children: mainToken.symbol }), haveNewlyListedTokens &&
-                                        _jsx(NewBadge, {})] }) }), hasLoadedBalances ? (_jsxs("div", { className: `${showNetworkIcons ? "flex flex-col space-y-0.5" : ""} ${hideTokenImages ? "invisible" : "visible"}`, children: [_jsx("span", { className: "text-secondary-text text-sm leading-4 font-medium", children: formatUsd(tokenBalances.sum) }), showNetworkIcons && (_jsxs("div", { className: "flex justify-end items-center -space-x-1.5 relative h-4", children: [networksWithBalance.slice(0, 3).map((network, index) => (_jsx(ImageWithFallback, { src: network.logo, alt: `${network.display_name} logo`, height: "16", width: "16", loading: "eager", fetchPriority: "high", className: "rounded-full object-contain" }, `${network.display_name}-${index}`))), networksWithBalance.length > 3 && (_jsx("div", { className: "w-4 h-4 bg-secondary-600 text-primary-text text-[8px] rounded-full flex items-center justify-center border-2 border-background", children: _jsxs("span", { children: ["+", networksWithBalance.length - 3] }) }))] }))] })) : _jsx(_Fragment, {}), _jsx(ChevronDown, { className: "!w-3.5 !h-3.5 absolute right-2 top-1/2 -translate-y-1/2 text-secondary-text transition-opacity duration-200 opacity-0 group-hover/item:opacity-100", "aria-hidden": "true" })] }) })] }));
+    return (_jsxs(SelectItem, { className: "bg-secondary-500 group rounded-xl hover:bg-secondary-400 group/item relative pr-7 py-2", children: [_jsx(SelectItem.Logo, { imgSrc: mainToken.logo, altText: `${mainToken.symbol} logo`, className: "rounded-full" }), _jsx(SelectItem.Title, { children: _jsxs(_Fragment, { children: [_jsx("span", { children: mainToken.symbol }), hasLoadedBalances ? (_jsxs("div", { className: `${showNetworkIcons ? "flex flex-col space-y-0.5" : ""} ${hideTokenImages ? "invisible" : "visible"}`, children: [_jsx("span", { className: "text-secondary-text text-sm leading-4 font-medium", children: formatUsd(tokenBalances.sum) }), showNetworkIcons && (_jsxs("div", { className: "flex justify-end items-center -space-x-1.5 relative h-4", children: [networksWithBalance.slice(0, 3).map((network, index) => (_jsx(ImageWithFallback, { src: network.logo, alt: `${network.display_name} logo`, height: "16", width: "16", loading: "eager", fetchPriority: "high", className: "rounded-full object-contain" }, `${network.display_name}-${index}`))), networksWithBalance.length > 3 && (_jsx("div", { className: "w-4 h-4 bg-secondary-600 text-primary-text text-[8px] rounded-full flex items-center justify-center border-2 border-background", children: _jsxs("span", { children: ["+", networksWithBalance.length - 3] }) }))] }))] })) : _jsx(_Fragment, {}), _jsx(ChevronDown, { className: "!w-3.5 !h-3.5 absolute right-2 top-1/2 -translate-y-1/2 text-secondary-text transition-opacity duration-200 opacity-0 group-hover/item:opacity-100", "aria-hidden": "true" })] }) })] }));
 };
 export const SelectedCurrencyDisplay = (props) => {
     const { value, placeholder } = props;

package/dist/esm/components/Input/RoutePicker/TokenTitleDetails.js

@@ -2,9 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Info } from "lucide-react";
 import { ExtendedAddress } from "../Address/AddressPicker/AddressWithIcon";
 import { formatUsd } from "../../../components/utils/formatUsdAmount";
-import { NewBadge } from "../../../lib/isNewListed";
 export const TokenInfoIcon = ({ item, route, className, iconOnly = false }) => (_jsx("div", { className: className, children: _jsx(ExtendedAddress, { network: item.contract ? route : undefined, isForCurrency: true, showDetails: true, address: item.contract || `${route.display_name} native coin`, logo: item.logo, title: item.symbol, description: item.display_asset, isNativeToken: !item.contract, children: _jsxs("div", { className: `flex items-center gap-1 text-secondary-text cursor-pointer hover:text-primary-text ${iconOnly ? '' : 'text-xs'}`, children: [!iconOnly && (_jsxs("p", { className: "max-w-[90px] truncate", children: [_jsx("span", { children: "\u2022" }), " ", _jsx("span", { children: item.display_asset || item.symbol })] })), _jsx(Info, { className: iconOnly ? "h-4 w-4" : "h-3 w-3" })] }) }) }));
-export const TokenTitleWithBalance = ({ item, route, tokenbalance, usdAmount, isNewlyListed }) => {
-    return (_jsxs("div", { className: "flex items-center gap-2 justify-between w-full", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { children: item.symbol }), isNewlyListed &&
-                        _jsx(NewBadge, {}), _jsx(TokenInfoIcon, { item: item, route: route, iconOnly: true, className: "hidden xs:block transition-all duration-300 opacity-0 group-hover:opacity-100 group-hover:delay-400 click-delay-on-hover" })] }), (tokenbalance && Number(tokenbalance?.amount) > 0 && Number(usdAmount) > 0) && (_jsx("div", { className: "text-primary-text text-lg leading-[22px] font-medium", children: formatUsd(usdAmount) }))] }));
+export const TokenTitleWithBalance = ({ item, route, tokenbalance, usdAmount }) => {
+    return (_jsxs("div", { className: "flex items-center gap-2 justify-between w-full", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { children: item.symbol }), _jsx(TokenInfoIcon, { item: item, route: route, iconOnly: true, className: "hidden xs:block transition-all duration-300 opacity-0 group-hover:opacity-100 group-hover:delay-400 click-delay-on-hover" })] }), (tokenbalance && Number(tokenbalance?.amount) > 0 && Number(usdAmount) > 0) && (_jsx("div", { className: "text-primary-text text-lg leading-[22px] font-medium", children: formatUsd(usdAmount) }))] }));
 };

package/dist/esm/components/Input/RoutePicker/index.js

@@ -50,7 +50,7 @@ const RoutePicker = ({ direction, isExchange = false, className }) => {
         });
     }, [currencyFieldName, direction, setFieldValue]);
     const showbalance = !isExchange && (direction === 'to' || values.depositMethod === 'wallet');
-    return (_jsxs("div", { className: clsx("flex flex-col self-end relative items-center", className), children: [_jsxs(Selector, { children: [_jsx(SelectorTrigger, { disabled: false, className: "group-[.exchange-picker]:bg-secondary-500 py-1.5 px-2 group-[.exchange-picker]:py-2! group-[.exchange-picker]:px-3! active:animate-press-down group-[.exchange-picker]:active:animate-none", children: _jsx(SelectedRouteDisplay, { route: selectedRoute, token: selectedToken, placeholder: "Select token" }) }), _jsx(SelectorContent, { isLoading: isLoading, searchHint: "Search", header: _jsx(PickerWalletConnect, { direction: direction }), children: ({ closeModal }) => (_jsx(Content, { onSelect: (r, t) => { handleSelect(r, t); closeModal(); }, searchQuery: searchQuery, setSearchQuery: setSearchQuery, rowElements: routeElements, direction: direction, selectedRoute: selectedRoute?.name, selectedToken: selectedToken?.symbol })) })] }), showbalance &&
+    return (_jsxs("div", { className: clsx("flex flex-col self-end relative items-center", className), children: [_jsxs(Selector, { children: [_jsx(SelectorTrigger, { "data-attr": direction === "from" ? "from-route-picker" : "to-route-picker", disabled: false, className: "group-[.exchange-picker]:bg-secondary-500 py-1.5 px-2 group-[.exchange-picker]:py-2! group-[.exchange-picker]:px-3! active:animate-press-down group-[.exchange-picker]:active:animate-none", children: _jsx(SelectedRouteDisplay, { route: selectedRoute, token: selectedToken, placeholder: "Select token" }) }), _jsx(SelectorContent, { isLoading: isLoading, searchHint: "Search", header: _jsx(PickerWalletConnect, { direction: direction }), children: ({ closeModal }) => (_jsx(Content, { onSelect: (r, t) => { handleSelect(r, t); closeModal(); }, searchQuery: searchQuery, setSearchQuery: setSearchQuery, rowElements: routeElements, direction: direction, selectedRoute: selectedRoute?.name, selectedToken: selectedToken?.symbol })) })] }), showbalance &&
                 _jsx(Balance, { values: values, direction: direction })] }));
 };
 export default RoutePicker;

package/dist/esm/components/Input/SourceWalletPicker.js

@@ -113,7 +113,7 @@ const Connect = ({ connectFn, setMountWalletPortal }) => {
         await connect();
         setMountWalletPortal && setMountWalletPortal(false);
     };
-    return _jsx(SubmitButton, { onClick: () => connectFn ? connectFn() : connectWallet(), type: "button", icon: _jsx(WalletIcon, { className: "h-6 w-6", strokeWidth: 2 }), isDisabled: !isProvidersReady, children: "Connect a wallet" });
+    return _jsx(SubmitButton, { onClick: () => connectFn ? connectFn() : connectWallet(), type: "button", "data-attr": "connect-wallet", icon: _jsx(WalletIcon, { className: "h-6 w-6", strokeWidth: 2 }), isDisabled: !isProvidersReady, children: "Connect a wallet" });
 };
 const ContinueWithoutWallet = ({ onClick }) => {
     //TODO: bg-secondary-700 is a hotfix, should refactor and fix sticky footer for VaulDrawer

package/dist/esm/components/Modal/modalWithoutAnimation.js

@@ -48,7 +48,7 @@ export const ModalContent = (props) => {
     return createPortal(modalElement, widgetElement);
 };
 export const ModalTrigger = (props) => {
-    const { disabled = false, children, className = "", onClick } = props;
+    const { disabled = false, children, className = "", onClick, ...rest } = props;
     const { setIsOpen, setShouldFocus } = useContext(ModalContext);
     const { isDesktop } = useWindowDimensions();
     function openModal() {
@@ -56,5 +56,5 @@ export const ModalTrigger = (props) => {
         isDesktop && setShouldFocus(true);
         onClick?.();
     }
-    return (_jsx("div", { className: "rounded-2xl flex items-center relative w-full self-end", children: _jsx("button", { type: "button", onClick: openModal, disabled: disabled, className: clsx("rounded-2xl focus-peer:ring-primary focus-peer:border-secondary-400 focus-peer:border focus-peer:ring-1 focus:outline-none disabled:cursor-not-allowed relative grow flex items-center text-left justify-bottom w-full px-2 pr-0 bg-secondary-300 hover:bg-secondary-200 font-semibold", className), children: children }) }));
+    return (_jsx("div", { ...rest, className: "rounded-2xl flex items-center relative w-full z-10 self-end", children: _jsx("button", { type: "button", onClick: openModal, disabled: disabled, className: clsx("rounded-2xl focus-peer:ring-primary focus-peer:border-secondary-400 focus-peer:border focus-peer:ring-1 focus:outline-none disabled:cursor-not-allowed relative grow flex items-center text-left justify-bottom w-full px-2 pr-0 bg-secondary-300 hover:bg-secondary-200 font-semibold", className), children: children }) }));
 };

package/dist/esm/components/Modal/vaulModal.js

@@ -85,9 +85,9 @@ const Comp = ({ children, show, setShow, header, description, onClose, onAnimati
                         'border-none! rounded-none!': snap === 1,
                         'fixed! sm:absolute!': AppSettings.ThemeData?.enablePortal == true,
                     }), children: [_jsxs("div", { ref: headerRef, className: 'w-full relative', children: [isMobileWithoutPortal &&
-                                    _jsx("div", { className: "flex justify-center w-full mt-2 mb-[6px]", children: _jsx(Drawer.Handle, { className: '!w-12 !bg-primary-text-tertiary' }) }), _jsxs("div", { className: 'flex items-center w-full text-left justify-between px-4 sm:pt-2 pb-2', children: [_jsx(Drawer.Title, { className: "text-lg text-secondary-text font-semibold w-full", children: header }), _jsx(Drawer.Close, { asChild: true, children: _jsx("div", { children: _jsx(IconButton, { className: 'inline-flex active:animate-press-down', icon: _jsx(X, { strokeWidth: 2 }) }) }) })] }), description &&
+                                    _jsx("div", { className: "flex justify-center w-full mt-2 mb-[6px]", children: _jsx(Drawer.Handle, { className: 'w-12! bg-primary-text-tertiary!' }) }), _jsxs("div", { className: 'flex items-center w-full text-left justify-between px-4 sm:pt-2 pb-2', children: [_jsx(Drawer.Title, { className: "text-lg text-secondary-text font-semibold w-full", children: header }), _jsx(Drawer.Close, { asChild: true, children: _jsx("div", { children: _jsx(IconButton, { className: 'inline-flex active:animate-press-down', icon: _jsx(X, { strokeWidth: 2 }) }) }) })] }), description &&
                                     _jsx(Drawer.Description, { className: "text-sm mt-2 text-secondary-text px-4", children: description })] }), _jsxs("div", { className: 'flex flex-col w-full h-full max-h-[90dvh] px-4 styled-scroll overflow-x-hidden relative', id: "virtualListContainer", children: [children, _jsx(AnimatePresence, { children: !isLastSnap && snapElement &&
-                                        _jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.15 }, ref: expandRef, style: { top: `${Number(snapElement.height?.toString().replace('px', '')) - 88}px` }, className: 'w-full fixed left-0 z-50', children: _jsxs("button", { type: 'button', onClick: goToNextSnap, className: "w-full px-4 pt-10 pb-4 justify-center from-secondary-700 bg-gradient-to-t items-center gap-2 inline-flex text-secondary-text", children: [_jsx(ChevronUp, { className: "w-6 h-6 relative" }), _jsx("div", { className: "text-sm font-medium", children: "Expand" })] }) }) }), isMobile && _jsx(VaulFooter, { snapElement: snapElement })] }), !isMobile && _jsx(VaulFooter, { snapElement: snapElement })] })] }) }));
+                                        _jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.15 }, ref: expandRef, style: { top: `${Number(snapElement.height?.toString().replace('px', '')) - 88}px` }, className: 'w-full fixed left-0 z-50', children: _jsxs("button", { type: 'button', onClick: goToNextSnap, className: "w-full px-4 pt-10 pb-4 justify-center from-secondary-700 bg-linear-to-t items-center gap-2 inline-flex text-secondary-text", children: [_jsx(ChevronUp, { className: "w-6 h-6 relative" }), _jsx("div", { className: "text-sm font-medium", children: "Expand" })] }) }) }), isMobile && _jsx(VaulFooter, { snapElement: snapElement })] }), !isMobile && _jsx(VaulFooter, { snapElement: snapElement })] })] }) }));
 };
 const VaulFooter = ({ snapElement }) => {
     let [ref, { height }] = useMeasure();

package/dist/esm/components/Pages/Campaigns/Details/index.js

@@ -36,7 +36,7 @@ export const CampaignDetailsComponent = ({ campaignName }) => {
                             _jsx(Rewards, { campaign: campaign })
                             :
                                 _jsx(BriefInformation, { campaign: campaign }), _jsx(Leaderboard, { campaign: campaign })] }) }), _jsx(_Fragment, { children: !isConnected &&
-                    _jsx(Widget.Footer, { children: _jsx(SubmitButton, { isDisabled: false, isSubmitting: false, onClick: handleConnect, icon: _jsx(WalletIcon, { className: "stroke-2 w-6 h-6" }), children: "Connect a wallet" }) }) })] }));
+                    _jsx(Widget.Footer, { children: _jsx(SubmitButton, { "data-attr": "connect-wallet", isDisabled: false, isSubmitting: false, onClick: handleConnect, icon: _jsx(WalletIcon, { className: "stroke-2 w-6 h-6" }), children: "Connect a wallet" }) }) })] }));
 };
 const BriefInformation = ({ campaign }) => _jsx("p", { className: "text-secondary-text text-base", children: campaign.description ?
         campaign.description

package/dist/esm/components/Pages/Swap/Form/FeeDetails/Rate.js

@@ -2,16 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState } from "react";
 import { ArrowRight } from "lucide-react";
 import { truncateDecimals } from "../../../../../components/utils/RoundDecimals";
-export const RateElement = ({ fromAsset, toAsset, requestAmount, receiveAmount, totalFeeInUsd }) => {
+export const RateElement = ({ fromAsset, toAsset, rate }) => {
     const [flipped, setFlipped] = useState(false);
-    if (toAsset.price_in_usd === 0) {
-        return null;
-    }
-    const totalFee = totalFeeInUsd ? totalFeeInUsd / toAsset.price_in_usd : 0;
-    const totalAmount = receiveAmount + totalFee;
-    const fromRate = totalAmount / requestAmount;
-    const toRate = requestAmount / totalAmount;
-    const fromRateTruncated = truncateDecimals(fromRate, fromAsset?.precision || 6);
-    const toRateTruncated = truncateDecimals(toRate, toAsset?.precision || 6);
-    return (_jsx("div", { className: "flex text-sm ml-1 font-small items-center cursor-pointer", onClick: () => setFlipped(!flipped), children: !flipped ? (_jsxs(_Fragment, { children: [_jsxs("p", { children: [_jsx("span", { children: "1" }), " ", _jsx("span", { children: fromAsset?.symbol })] }), _jsx(ArrowRight, { className: "w-3 h-3 mx-1" }), _jsxs("span", { children: [fromRateTruncated, " ", toAsset?.symbol] })] })) : (_jsxs(_Fragment, { children: [_jsxs("p", { children: [_jsx("span", { children: "1" }), " ", _jsx("span", { children: toAsset?.symbol })] }), _jsx(ArrowRight, { className: "w-3 h-3 mx-1" }), _jsxs("span", { children: [toRateTruncated, " ", fromAsset?.symbol] })] })) }));
+    const flippedRate = 1 / rate;
+    const rateTruncated = truncateDecimals(rate, toAsset?.precision || 6);
+    const flippedRateTruncated = truncateDecimals(flippedRate, fromAsset?.precision || 6);
+    return (_jsx("div", { className: "flex text-sm ml-1 font-small items-center cursor-pointer", onClick: () => setFlipped(!flipped), children: !flipped ? (_jsxs(_Fragment, { children: [_jsxs("p", { children: [_jsx("span", { children: "1" }), " ", _jsx("span", { children: fromAsset?.symbol })] }), _jsx(ArrowRight, { className: "w-3 h-3 mx-1" }), _jsxs("span", { children: [rateTruncated, " ", toAsset?.symbol] })] })) : (_jsxs(_Fragment, { children: [_jsxs("p", { children: [_jsx("span", { children: "1" }), " ", _jsx("span", { children: toAsset?.symbol })] }), _jsx(ArrowRight, { className: "w-3 h-3 mx-1" }), _jsxs("span", { children: [flippedRateTruncated, " ", fromAsset?.symbol] })] })) }));
 };

package/dist/esm/components/Pages/Swap/Form/FeeDetails/Slippage.js

@@ -33,7 +33,7 @@ export const Slippage = ({ quoteData, values }) => {
         });
     }, [setAutoSlippage, setEditingCustomSlippage, setSlippage, inputRef]);
     return (_jsxs("div", { ref: ref, className: clsx("flex items-center w-full justify-between gap-1 text-sm px-2 py-1", { "bg-secondary-700 rounded-xl": editingSlippage }), children: [_jsx("div", { className: "inline-flex items-center text-left text-secondary-text py-2", children: _jsxs("label", { className: "flex items-center gap-1", children: [_jsx("span", { children: "Slippage" }), _jsxs(Tooltip, { openOnClick: true, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Info, { className: 'w-4 h-4' }) }), _jsx(TooltipContent, { className: "pointer-events-none w-80 grow p-2 !border-none !bg-secondary-300 text-xs rounded-xl", side: "top", align: "start", alignOffset: -30, children: _jsx("p", { children: "Your transaction will be refunded if the price moves more than the slippage percentage." }) })] })] }) }), !editingSlippage &&
-                _jsxs("div", { className: "text-right text-primary-text flex items-center gap-1", children: [!slippage && _jsx("div", { className: "text-secondary-text", children: "(Auto)" }), _jsxs("span", { children: [(((slippage ?? quoteData?.slippage) ?? 0) * 100).toFixed(2), "%"] }), _jsx("div", { onClick: () => { setEditingSlippage(true); activate(); }, className: "cursor-pointer hover:bg-secondary-400 p-1 bg-secondary-300 rounded-md text-secondary-text", children: _jsx(Pencil, { className: "h-3 w-3" }) })] }), editingSlippage &&
+                _jsxs("div", { className: "text-right text-primary-text flex items-center gap-1", children: [!slippage && _jsx("div", { className: "text-secondary-text", children: "(Auto)" }), _jsxs("span", { children: [(((slippage ?? quoteData?.slippage) ?? 0) * 100).toFixed(2), "%"] }), _jsx("div", { "data-attr": "edit-slippage", onClick: () => { setEditingSlippage(true); activate(); }, className: "cursor-pointer hover:bg-secondary-400 p-1 bg-secondary-300 rounded-md text-secondary-text", children: _jsx(Pencil, { className: "h-3 w-3" }) })] }), editingSlippage &&
                 _jsxs("div", { className: "flex items-center gap-1", children: [!autoSlippage && _jsxs("span", { className: "flex items-center gap-1 max-sm:hidden", children: [_jsx(QuickAction, { value: 0.5 }), _jsx(QuickAction, { value: 1 }), _jsx(QuickAction, { value: 2.5 })] }), !editingCustomSlippage &&
                             _jsxs("div", { className: "flex items-center gap-1 text-secondary-text text-sm px-2 py-2 -my-1 border border-secondary-300 rounded-lg font-normal leading-4 cursor-pointer", onClick: () => {
                                     setEditingCustomSlippage(true);

package/dist/esm/components/Pages/Swap/Form/FeeDetails/SwapQuote/DetailedEstimates.js

@@ -18,7 +18,7 @@ export const DetailedEstimates = ({ quote, reward, swapValues: values, variant }
     const shouldCheckNFT = reward?.campaign_type === "for_nft_holders" && reward?.nft_contract_address;
     const { balance: nftBalance, isLoading, error } = useSWRNftBalance(values.destination_address || '', values.to, reward?.nft_contract_address || '');
     const showReward = !(!reward || !values.destination_address || shouldCheckNFT && (isLoading || error || nftBalance === undefined || nftBalance <= 0));
-    return _jsxs("div", { className: "flex flex-col w-full px-2", children: [variant === "extended" && _jsx(GasFee, { values: values, quote: quote }), _jsx(Fees, { quote: quote, values: values }), values.depositMethod !== "deposit_address" && _jsx(Rate, { fromAsset: values?.fromAsset, toAsset: values?.toAsset, requestAmount: quote?.requested_amount, receiveAmount: quote?.receive_amount, totalFeeInUsd: quote?.total_fee_in_usd }), values.depositMethod === "deposit_address" && variant === "extended" && values?.fromAsset?.contract && _jsx(ExchangeTokenContract, { fromAsset: values?.fromAsset, network: values?.from }), variant === "extended" && values.depositMethod === "wallet" && _jsx(Slippage, { quoteData: quote, values: values }), _jsx(Estimates, { quote: quote }), showReward && _jsx(Reward, { reward: reward })] });
+    return _jsxs("div", { className: "flex flex-col w-full px-2", children: [variant === "extended" && _jsx(GasFee, { values: values, quote: quote }), _jsx(Fees, { quote: quote, values: values }), values.depositMethod !== "deposit_address" && _jsx(Rate, { fromAsset: values?.fromAsset, toAsset: values?.toAsset, rate: quote?.rate }), values.depositMethod === "deposit_address" && variant === "extended" && values?.fromAsset?.contract && _jsx(ExchangeTokenContract, { fromAsset: values?.fromAsset, network: values?.from }), variant === "extended" && values.depositMethod === "wallet" && _jsx(Slippage, { quoteData: quote, values: values }), _jsx(Estimates, { quote: quote }), showReward && _jsx(Reward, { reward: reward })] });
 };
 const RowWrapper = ({ children, title }) => {
     return _jsxs("div", { className: "flex items-center w-full justify-between gap-1 py-3 px-2 text-sm", children: [_jsx("div", { className: "inline-flex items-center text-left text-secondary-text gap-1 pr-4", children: _jsx("label", { children: title }) }), _jsx("div", { className: "text-right text-primary-text", children: children })] });
@@ -77,11 +77,11 @@ const Estimates = ({ quote }) => {
 const Reward = ({ reward }) => {
     return _jsx(RowWrapper, { title: "Reward", children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: reward?.amount_in_usd !== undefined && (_jsxs("span", { className: "text-sm ml-1 font-small", children: ["$", reward.amount_in_usd.toFixed(2)] })) }), _jsxs(TooltipContent, { className: "bg-secondary-300! border-secondary-300! text-primart-text!", children: [_jsxs("span", { children: [reward?.amount || '-', " "] }), _jsx("span", { children: reward?.amount ? reward.token.symbol : '' })] })] }) });
 };
-const Rate = ({ fromAsset, toAsset, requestAmount, receiveAmount, totalFeeInUsd }) => {
-    if (!fromAsset || !toAsset || !requestAmount || !receiveAmount || !totalFeeInUsd) {
+const Rate = ({ fromAsset, toAsset, rate }) => {
+    if (!fromAsset || !toAsset || !rate) {
         return null;
     }
-    return _jsx(RowWrapper, { title: "Rate", children: _jsx(RateElement, { fromAsset: fromAsset, toAsset: toAsset, requestAmount: requestAmount, receiveAmount: receiveAmount, totalFeeInUsd: totalFeeInUsd }) });
+    return _jsx(RowWrapper, { title: "Rate", children: _jsx(RateElement, { fromAsset: fromAsset, toAsset: toAsset, rate: rate }) });
 };
 const ExchangeTokenContract = ({ fromAsset, network }) => {
     return _jsx(RowWrapper, { title: `${network?.display_name} - ${fromAsset?.symbol}`, children: (fromAsset?.contract && network && (isValidAddress(fromAsset?.contract, network)) ?

package/dist/esm/components/Pages/Swap/Form/FeeDetails/SwapQuote/SummaryRow.js

@@ -19,7 +19,7 @@ export const SummaryRow = ({ quoteData, isQuoteLoading, values, wallet, onOpen,
                                     _jsx("div", { className: "text-sm group/addressItem text-secondary-text", children: _jsx(ExtendedAddress, { address: addressFormat(values?.destination_address, values?.to), network: values?.to, showDetails: wallet ? true : false, title: wallet?.displayName?.split("-")[0], description: wallet?.providerName, logo: wallet?.icon, shouldShowChevron: false }) })
                                     :
                                         _jsx("p", { className: "text-sm text-secondary-text", children: shortenAddress(values?.destination_address) }))] }) })] })), _jsxs("div", { className: "flex items-center w-full justify-between gap-1 text-sm px-2 py-3", children: [_jsx("div", { className: "inline-flex items-center text-left text-secondary-text", children: _jsx("label", { children: "Receive at least" }) }), _jsx("div", { className: "text-right text-primary-text h-5", children: quoteData?.quote?.min_receive_amount !== undefined && !isNaN(quoteData?.quote?.min_receive_amount) && (_jsx(NumberFlow, { value: quoteData?.quote?.min_receive_amount, trend: 0, format: { maximumFractionDigits: quoteData?.quote.destination_token?.decimals || 2 }, suffix: ` ${values?.toAsset?.symbol}` })) })] }), _jsx(Slippage, { quoteData: quoteData.quote, values: values }), isOpen &&
-                _jsx(GasFee, { values: values, quote: quoteData.quote }), _jsxs("div", { className: `${isOpen ? "hidden" : ""} flex items-center w-full justify-between px-2 py-3`, children: [_jsx(DetailsButton, { quote: quoteData?.quote, isQuoteLoading: isQuoteLoading, swapValues: values, destination: destination, destinationAddress: destinationAddress, reward: quoteData?.reward }), _jsxs("button", { type: "button", onClick: (e) => {
+                _jsx(GasFee, { values: values, quote: quoteData.quote }), _jsxs("div", { className: `${isOpen ? "hidden" : ""} flex items-center w-full justify-between px-2 py-3`, children: [_jsx(DetailsButton, { quote: quoteData?.quote, isQuoteLoading: isQuoteLoading, swapValues: values, destination: destination, destinationAddress: destinationAddress, reward: quoteData?.reward }), _jsxs("button", { "data-attr": "see-swap-details", type: "button", onClick: (e) => {
                             e.stopPropagation();
                             onOpen?.();
                         }, className: "flex items-center text-secondary-text text-sm whitespace-nowrap gap-0.5 hover:text-primary-text", "aria-label": "See details", children: [_jsx("span", { children: "See details" }), _jsx(ChevronDown, { className: "h-3.5 w-3.5" })] })] })] }));

package/dist/esm/components/Pages/Swap/Form/FeeDetails/index.js

@@ -20,7 +20,7 @@ export default function QuoteDetails({ swapValues: values, quote, isQuoteLoading
     const { toAsset, fromAsset: fromCurrency, destination_address } = values || {};
     const [isAccordionOpen, setIsAccordionOpen] = useState(false);
     return (_jsx(_Fragment, { children: quote &&
-            _jsx(Accordion, { type: 'single', collapsible: true, className: 'w-full', value: isAccordionOpen ? 'quote' : '', onValueChange: (value) => { setIsAccordionOpen(value === 'quote'); }, children: _jsxs(AccordionItem, { value: 'quote', className: 'bg-secondary-500 rounded-2xl', children: [_jsxs(AccordionTrigger, { className: clsx('p-3.5 pr-5 w-full rounded-2xl flex items-center justify-between transition-colors duration-200 hover:bg-secondary-400 mt-3', triggerClassnames, {
+            _jsx(Accordion, { type: 'single', collapsible: true, className: 'w-full', value: isAccordionOpen ? 'quote' : '', onValueChange: (value) => { setIsAccordionOpen(value === 'quote'); }, children: _jsxs(AccordionItem, { value: 'quote', className: 'bg-secondary-500 rounded-2xl', children: [_jsxs(AccordionTrigger, { "data-attr": "see-swap-details", className: clsx('p-3.5 pr-5 w-full rounded-2xl flex items-center justify-between transition-colors duration-200 hover:bg-secondary-400 mt-3', triggerClassnames, {
                                 'bg-secondary-500': !isAccordionOpen,
                                 'bg-secondary-400': isAccordionOpen,
                                 'animate-pulse-strong': isQuoteLoading && !isAccordionOpen

package/dist/esm/components/Pages/Swap/Form/SecondaryComponents/FormButton.js

@@ -12,6 +12,6 @@ const FormButton = ({ shouldConnectWallet, values, disabled, error, isSubmitting
     if (values?.to && !values?.destination_address && !error) {
         return (_jsx(Address, { partner: partner, children: () => (_jsx(SubmitButton, { type: "button", className: "w-full", children: _jsx("span", { className: "grow text-center", children: "Enter destination address" }) })) }));
     }
-    return (_jsx(SubmitButton, { type: "submit", isDisabled: disabled, isSubmitting: isSubmitting, children: actionDisplayName }));
+    return (_jsx(SubmitButton, { "data-attr": "submit-swap", type: "submit", isDisabled: disabled, isSubmitting: isSubmitting, children: actionDisplayName }));
 };
 export default FormButton;