Merge branch 'main' into sort-imports-with-prettier

package.json

@@ -1,5 +1,5 @@
 {
-  "version": "3.0.0-alpha.37",
+  "version": "3.0.0-alpha.38",
   "private": true,
   "sideEffects": false,
   "type": "module",
@@ -44,11 +44,11 @@
     "@types/eslint": "^8.56.9",
     "@types/events": "^3.0.3",
     "@types/node": "^20.12.7",
-    "@types/react": "^18.2.78",
+    "@types/react": "^18.2.79",
     "@types/react-dom": "^18.2.25",
     "@types/uuid": "^9.0.8",
-    "@typescript-eslint/eslint-plugin": "^7.6.0",
-    "@typescript-eslint/parser": "^7.6.0",
+    "@typescript-eslint/eslint-plugin": "^7.7.0",
+    "@typescript-eslint/parser": "^7.7.0",
     "cpy-cli": "^5.0.0",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",

packages/wallet-management/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/wallet-management",
-  "version": "3.0.0-alpha.24",
+  "version": "3.0.0-alpha.25",
   "description": "LI.FI Wallet Management solution.",
   "type": "module",
   "main": "./src/index.ts",
@@ -46,10 +46,10 @@
     "lifi"
   ],
   "dependencies": {
-    "@lifi/sdk": "^3.0.0-alpha.58",
+    "@lifi/sdk": "^3.0.0-alpha.59",
     "@solana/wallet-adapter-base": "^0.9.23",
     "react": "^18.2.0",
-    "wagmi": "^2.5.19"
+    "wagmi": "^2.5.20"
   },
   "devDependencies": {
     "cpy-cli": "^5.0.0",

packages/widget-embedded/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget-embedded",
-  "version": "1.0.189",
+  "version": "1.0.190",
   "type": "module",
   "scripts": {
     "analyze": "source-map-explorer 'dist/assets/*.js' --no-border-checks",
@@ -21,28 +21,28 @@
   "dependencies": {
     "@ethersproject/abstract-signer": "^5.7.0",
     "@ethersproject/providers": "^5.7.2",
-    "@lifi/sdk": "^3.0.0-alpha.58",
-    "@lifi/wallet-management": "^3.0.0-alpha.24",
-    "@lifi/widget": "^3.0.0-alpha.37",
+    "@lifi/sdk": "^3.0.0-alpha.59",
+    "@lifi/wallet-management": "^3.0.0-alpha.25",
+    "@lifi/widget": "^3.0.0-alpha.38",
     "@mui/icons-material": "^5.15.15",
     "@mui/lab": "^5.0.0-alpha.170",
     "@mui/material": "^5.15.15",
     "@opensea/seaport-js": "4.0.0",
     "@tanstack/react-query": "^5.29.2",
     "bignumber.js": "^9.1.2",
-    "ethers": "^6.11.1",
+    "ethers": "^6.12.0",
     "events": "^3.3.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.22.3",
-    "wagmi": "^2.5.19"
+    "wagmi": "^2.5.20"
   },
   "devDependencies": {
     "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
     "@vitejs/plugin-react-swc": "^3.6.0",
     "source-map-explorer": "^2.5.3",
     "typescript": "^5.4.5",
-    "vite": "^5.2.8",
+    "vite": "^5.2.9",
     "vite-plugin-node-polyfills": "^0.21.0",
     "web-vitals": "^3.5.2"
   },

packages/widget-playground-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget-playground-next",
-  "version": "1.0.189",
+  "version": "1.0.190",
   "scripts": {
     "dev": "next dev -p 3001",
     "build": "next build",
@@ -16,34 +16,34 @@
     "@emotion/cache": "^11.11.0",
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
-    "@lifi/sdk": "^3.0.0-alpha.58",
-    "@lifi/wallet-management": "^3.0.0-alpha.24",
-    "@lifi/widget": "^3.0.0-alpha.37",
-    "@lifi/widget-playground": "^1.0.189",
+    "@lifi/sdk": "^3.0.0-alpha.59",
+    "@lifi/wallet-management": "^3.0.0-alpha.25",
+    "@lifi/widget": "^3.0.0-alpha.38",
+    "@lifi/widget-playground": "^1.0.190",
     "@mui/icons-material": "^5.15.15",
     "@mui/material": "^5.15.15",
     "@mui/material-nextjs": "^5.15.11",
     "@rainbow-me/rainbowkit": "^2.0.5",
     "@solana/wallet-adapter-base": "^0.9.23",
     "@solana/wallet-adapter-react": "^0.15.35",
-    "@solana/web3.js": "^1.91.4",
+    "@solana/web3.js": "^1.91.6",
     "@tanstack/react-query": "^5.29.2",
-    "core-js": "^3.36.1",
+    "core-js": "^3.37.0",
     "lodash.isequal": "^4.5.0",
     "microdiff": "^1.4.0",
-    "next": "14.2.1",
+    "next": "14.2.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "viem": "^2.9.17",
-    "wagmi": "^2.5.19",
+    "viem": "^2.9.21",
+    "wagmi": "^2.5.20",
     "zustand": "^4.5.2"
   },
   "devDependencies": {
     "@types/node": "^20.12.7",
-    "@types/react": "^18.2.78",
+    "@types/react": "^18.2.79",
     "@types/react-dom": "^18.2.25",
     "eslint": "^8.57.0",
-    "eslint-config-next": "14.2.1",
+    "eslint-config-next": "14.2.2",
     "typescript": "^5.4.5"
   },
   "private": true

packages/widget-playground-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget-playground-vite",
-  "version": "1.0.189",
+  "version": "1.0.190",
   "type": "module",
   "scripts": {
     "analyze": "source-map-explorer 'dist/assets/*.js' --no-border-checks",
@@ -18,23 +18,23 @@
   },
   "author": "Eugene Chybisov <[email protected]>",
   "dependencies": {
-    "@lifi/sdk": "^3.0.0-alpha.58",
-    "@lifi/wallet-management": "^3.0.0-alpha.24",
-    "@lifi/widget": "^3.0.0-alpha.37",
-    "@lifi/widget-playground": "^1.0.189",
+    "@lifi/sdk": "^3.0.0-alpha.59",
+    "@lifi/wallet-management": "^3.0.0-alpha.25",
+    "@lifi/widget": "^3.0.0-alpha.38",
+    "@lifi/widget-playground": "^1.0.190",
     "@mui/icons-material": "^5.15.15",
     "@mui/material": "^5.15.15",
     "@rainbow-me/rainbowkit": "^2.0.5",
     "@solana/wallet-adapter-base": "^0.9.23",
     "@solana/wallet-adapter-react": "^0.15.35",
-    "@solana/web3.js": "^1.91.4",
+    "@solana/web3.js": "^1.91.6",
     "@tanstack/react-query": "^5.29.2",
     "lodash.isequal": "^4.5.0",
     "microdiff": "^1.4.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "viem": "^2.9.17",
-    "wagmi": "^2.5.19",
+    "viem": "^2.9.21",
+    "wagmi": "^2.5.20",
     "zustand": "^4.5.2"
   },
   "devDependencies": {
@@ -43,7 +43,7 @@
     "rollup-plugin-polyfill-node": "^0.13.0",
     "source-map-explorer": "^2.5.3",
     "typescript": "^5.4.5",
-    "vite": "^5.2.8",
+    "vite": "^5.2.9",
     "vite-plugin-node-polyfills": "^0.21.0",
     "web-vitals": "^3.5.2"
   },

packages/widget-playground/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget-playground",
-  "version": "1.0.189",
+  "version": "1.0.190",
   "type": "module",
   "main": "./src/index.ts",
   "types": "./src/index.d.ts",
@@ -44,13 +44,13 @@
   "devDependencies": {
     "@types/lodash.isequal": "^4.5.8",
     "@types/node": "^20.12.7",
-    "@types/react": "^18.2.78",
+    "@types/react": "^18.2.79",
     "@types/react-dom": "^18.2.25",
     "@vitejs/plugin-react-swc": "^3.6.0",
     "cpy-cli": "^5.0.0",
     "jsdom": "^24.0.0",
     "typescript": "^5.4.5",
-    "vite": "^5.2.8",
+    "vite": "^5.2.9",
     "vitest": "^1.5.0"
   },
   "exports": {

packages/widget-playground/src/defaultWidgetConfig.ts

@@ -43,7 +43,7 @@ export const widgetBaseConfig: WidgetConfig = {
     apiUrl: 'https://li.quest/v1',
     rpcUrls: {
       [ChainId.SOL]: [
-        'https://withered-lingering-frog.solana-mainnet.quiknode.pro/',
+        'https://chaotic-restless-putty.solana-mainnet.quiknode.pro/',
       ],
     },
     routeOptions: {

packages/widget/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget",
-  "version": "3.0.0-alpha.37",
+  "version": "3.0.0-alpha.38",
   "description": "LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.",
   "type": "module",
   "main": "./src/index.ts",
@@ -50,16 +50,16 @@
   "dependencies": {
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
-    "@lifi/sdk": "^3.0.0-alpha.58",
-    "@lifi/wallet-management": "^3.0.0-alpha.24",
+    "@lifi/sdk": "^3.0.0-alpha.59",
+    "@lifi/wallet-management": "^3.0.0-alpha.25",
     "@mui/icons-material": "^5.15.15",
     "@mui/lab": "^5.0.0-alpha.170",
     "@mui/material": "^5.15.15",
     "@solana/wallet-adapter-base": "^0.9.23",
     "@solana/wallet-adapter-react": "^0.15.35",
-    "@solana/web3.js": "^1.91.4",
+    "@solana/web3.js": "^1.91.6",
     "@tanstack/react-query": "^5.29.2",
-    "@tanstack/react-virtual": "^3.2.1",
+    "@tanstack/react-virtual": "^3.3.0",
     "i18next": "^23.11.2",
     "microdiff": "^1.4.0",
     "mitt": "^3.0.1",
@@ -70,8 +70,8 @@
     "react-router-dom": "^6.22.3",
     "react-timer-hook": "^3.0.7",
     "uuid": "^9.0.1",
-    "viem": "^2.9.17",
-    "wagmi": "^2.5.19",
+    "viem": "^2.9.21",
+    "wagmi": "^2.5.20",
     "zustand": "^4.5.2"
   },
   "devDependencies": {

packages/widget/src/components/Card/InputCard.tsx

@@ -4,4 +4,4 @@ import { Card } from './Card.js';
 export const InputCard = styled(Card, {
   name: 'MuiInputCard',
   slot: 'root',
-})();
+})({});

packages/widget/src/components/ChainSelect/ChainSelect.tsx

@@ -3,7 +3,10 @@ import type { EVMChain } from '@lifi/sdk';
 import { Avatar, Box, Skeleton, Tooltip, Typography } from '@mui/material';
 import { useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { maxChainToOrder } from '../../stores/chains/createChainOrderStore.js';
+import {
+  maxChainsToOrder,
+  maxChainsToShow,
+} from '../../stores/chains/createChainOrderStore.js';
 import type { FormTypeProps } from '../../stores/form/types.js';
 import { FormKeyHelper } from '../../stores/form/types.js';
 import { useFieldValues } from '../../stores/form/useFieldValues.js';
@@ -39,17 +42,19 @@ export const ChainSelect = ({ formType }: FormTypeProps) => {
   };
 
   // We check if we can accommodate all the chains on the grid
-  // If there are more chains we slice the last one to show the number of hidden chains
+  // If there are more than 10 chains we show the number of hidden chains as the last one tile
   const chainsToHide =
-    chains?.length === maxChainToOrder
+    chains?.length === maxChainsToShow
       ? 0
-      : (chains?.length ?? 0) - (maxChainToOrder - 1);
-  const sliceValue = chainsToHide > 0 ? -1 : maxChainToOrder;
+      : (chains?.length ?? 0) - maxChainsToOrder;
+
+  // When there is less than 10 chains we don't care about the order
+  const chainsToShow = chainsToHide > 0 ? getChains() : chains;
 
   return (
     <ChainContainer>
       {isLoading
-        ? Array.from({ length: maxChainToOrder }).map((_, index) => (
+        ? Array.from({ length: maxChainsToOrder }).map((_, index) => (
             <Skeleton
               key={index}
               variant="rectangular"
@@ -58,34 +63,32 @@ export const ChainSelect = ({ formType }: FormTypeProps) => {
               sx={{ borderRadius: 1 }}
             />
           ))
-        : getChains()
-            .slice(0, sliceValue)
-            .map((chain: EVMChain) => (
-              <Tooltip
-                key={chain.id}
-                title={chain.name}
-                placement="top"
-                enterDelay={400}
-                enterNextDelay={100}
-                disableInteractive
-                arrow
+        : chainsToShow?.map((chain: EVMChain) => (
+            <Tooltip
+              key={chain.id}
+              title={chain.name}
+              placement="top"
+              enterDelay={400}
+              enterNextDelay={100}
+              disableInteractive
+              arrow
+            >
+              <ChainCard
+                component="button"
+                onClick={() => setCurrentChain(chain.id)}
+                type={chainId === chain.id ? 'selected' : 'default'}
+                selectionColor="primary"
               >
-                <ChainCard
-                  component="button"
-                  onClick={() => setCurrentChain(chain.id)}
-                  type={chainId === chain.id ? 'selected' : 'default'}
-                  selectionColor="primary"
+                <Avatar
+                  src={chain.logoURI}
+                  alt={chain.key}
+                  sx={{ width: 40, height: 40 }}
                 >
-                  <Avatar
-                    src={chain.logoURI}
-                    alt={chain.key}
-                    sx={{ width: 40, height: 40 }}
-                  >
-                    {chain.name[0]}
-                  </Avatar>
-                </ChainCard>
-              </Tooltip>
-            ))}
+                  {chain.name[0]}
+                </Avatar>
+              </ChainCard>
+            </Tooltip>
+          ))}
       {chainsToHide > 0 ? (
         <ChainCard component="button" onClick={showAllChains}>
           <Box

packages/widget/src/config/version.ts

@@ -1,2 +1,2 @@
 export const name = '@lifi/widget';
-export const version = '3.0.0-alpha.37';
+export const version = '3.0.0-alpha.38';