@lifi/widget 4.0.0 → 4.2.0

package/dist/esm/components/Avatar/AccountAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccountAvatar.js","names":[],"sources":["../../../../src/components/Avatar/AccountAvatar.tsx"],"sourcesContent":["import { getConnectorIcon } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Badge } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useChain } from '../../hooks/useChain.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { AvatarDefault, AvatarMasked } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\n\ninterface AccountAvatarProps {\n  chainId?: number\n  account?: Account\n  toAddress?: ToAddress\n  empty?: boolean\n}\n\nexport const AccountAvatar = ({\n  chainId,\n  account,\n  empty,\n  toAddress,\n}: AccountAvatarProps): JSX.Element => {\n  const { chain } = useChain(chainId)\n\n  const avatar = empty ? (\n    <AvatarDefault />\n  ) : account?.connector || toAddress?.logoURI ? (\n    <AvatarMasked\n      src={toAddress?.logoURI || getConnectorIcon(account?.connector)}\n      alt={toAddress?.name || account?.connector?.name}\n    >\n      {(toAddress?.name || account?.connector?.name)?.[0]}\n    </AvatarMasked>\n  ) : (\n    <AvatarDefault>\n      <Wallet sx={{ fontSize: 20 }} />\n    </AvatarDefault>\n  )\n\n  return (\n    <Badge\n      overlap=\"circular\"\n      anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n      badgeContent={<ChainBadgeContent chain={chain} />}\n    >\n      {avatar}\n    </Badge>\n  )\n}\n"],"mappings":";;;;;;;;AAiBA,MAAa,iBAAiB,EAC5B,SACA,SACA,OACA,gBACqC;CACrC,MAAM,EAAE,UAAU,SAAS,OAAO;CAElC,MAAM,SAAS,QACb,oBAAC,eAAD,CAAgB,CAAA,IACd,SAAS,aAAa,WAAW,UACnC,oBAAC,cAAD;EACE,KAAK,WAAW,WAAW,iBAAiB,SAAS,SAAS;EAC9D,KAAK,WAAW,QAAQ,SAAS,WAAW;aAE1C,WAAW,QAAQ,SAAS,WAAW,QAAQ;CACrC,CAAA,IAEd,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA,EAClB,CAAA;CAGjB,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;EAAQ;EACxD,cAAc,oBAAC,mBAAD,EAA0B,MAAQ,CAAA;YAE/C;CACI,CAAA;AAEX"}
+{"version":3,"file":"AccountAvatar.js","names":[],"sources":["../../../../src/components/Avatar/AccountAvatar.tsx"],"sourcesContent":["import { getConnectorIcon } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Badge } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useChain } from '../../hooks/useChain.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { AvatarDefault, AvatarMasked } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\n\ninterface AccountAvatarProps {\n  chainId?: number\n  account?: Account\n  toAddress?: ToAddress\n  empty?: boolean\n}\n\nexport const AccountAvatar = ({\n  chainId,\n  account,\n  empty,\n  toAddress,\n}: AccountAvatarProps): JSX.Element => {\n  const { chain } = useChain(chainId)\n\n  const avatar = empty ? (\n    <AvatarDefault />\n  ) : account?.connector || toAddress?.logoURI ? (\n    <AvatarMasked\n      src={toAddress?.logoURI || getConnectorIcon(account?.connector)}\n      alt={toAddress?.name || account?.connector?.name}\n    >\n      {(toAddress?.name || account?.connector?.name)?.[0]}\n    </AvatarMasked>\n  ) : (\n    <AvatarDefault>\n      <Wallet sx={{ fontSize: 20 }} />\n    </AvatarDefault>\n  )\n\n  return (\n    <Badge\n      overlap=\"circular\"\n      anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n      badgeContent={<ChainBadgeContent chain={chain} />}\n    >\n      {avatar}\n    </Badge>\n  )\n}\n"],"mappings":";;;;;;;;AAiBA,MAAa,iBAAiB,EAC5B,SACA,SACA,OACA,gBACqC;CACrC,MAAM,EAAE,UAAU,SAAS,OAAO;CAElC,MAAM,SAAS,QACb,oBAAC,eAAD,CAAgB,CAAA,IACd,SAAS,aAAa,WAAW,UACnC,oBAAC,cAAD;EACE,KAAK,WAAW,WAAW,iBAAiB,SAAS,SAAS;EAC9D,KAAK,WAAW,QAAQ,SAAS,WAAW;aAE1C,WAAW,QAAQ,SAAS,WAAW,KAAA,GAAQ;CACrC,CAAA,IAEd,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA,EAClB,CAAA;CAGjB,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;EAAQ;EACxD,cAAc,oBAAC,mBAAD,EAA0B,MAAQ,CAAA;YAE/C;CACI,CAAA;AAEX"}

package/dist/esm/components/Avatar/Avatar.js

@@ -4,16 +4,25 @@ import { ChainBadgeContent } from "./ChainBadgeContent.js";
 import { Badge, Skeleton } from "@mui/material";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Avatar/Avatar.tsx
-const AvatarBadgedDefault = ({ sx, chain }) => {
+const AvatarBadgedDefault = ({ sx, chain, avatarSize, badgeSize }) => {
 	return /* @__PURE__ */ jsx(Badge, {
 		overlap: "circular",
 		anchorOrigin: {
 			vertical: "bottom",
 			horizontal: "right"
 		},
-		badgeContent: /* @__PURE__ */ jsx(ChainBadgeContent, { chain }),
+		badgeContent: /* @__PURE__ */ jsx(ChainBadgeContent, {
+			chain,
+			size: badgeSize
+		}),
 		sx,
-		children: /* @__PURE__ */ jsx(AvatarDefault, {})
+		children: /* @__PURE__ */ jsx(AvatarDefault, {
+			badgeSize,
+			sx: avatarSize ? {
+				width: avatarSize,
+				height: avatarSize
+			} : void 0
+		})
 	});
 };
 const AvatarBadgedSkeleton = ({ sx, avatarSize = 40, badgeSize = 16 }) => {

package/dist/esm/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","names":[],"sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport type { SxProps, Theme } from '@mui/material'\nimport { Badge, Skeleton } from '@mui/material'\nimport { AvatarDefault, AvatarSkeletonMaskedContainer } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\nimport { SmallAvatarSkeleton } from './SmallAvatar.js'\n\nexport const AvatarBadgedDefault: React.FC<{\n  sx?: SxProps<Theme>\n  chain?: ExtendedChain\n}> = ({ sx, chain }) => {\n  return (\n    <Badge\n      overlap=\"circular\"\n      anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n      badgeContent={<ChainBadgeContent chain={chain} />}\n      sx={sx}\n    >\n      <AvatarDefault />\n    </Badge>\n  )\n}\n\nexport const AvatarBadgedSkeleton: React.FC<{\n  sx?: SxProps<Theme>\n  avatarSize?: number\n  badgeSize?: number\n}> = ({ sx, avatarSize = 40, badgeSize = 16 }) => {\n  return (\n    <Badge\n      overlap=\"circular\"\n      anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n      badgeContent={<SmallAvatarSkeleton size={badgeSize} />}\n      sx={sx}\n    >\n      <AvatarSkeleton avatarSize={avatarSize} badgeSize={badgeSize} />\n    </Badge>\n  )\n}\n\nconst AvatarSkeleton: React.FC<{\n  avatarSize: number\n  badgeSize: number\n}> = ({ avatarSize, badgeSize }) => {\n  return (\n    <AvatarSkeletonMaskedContainer badgeSize={badgeSize}>\n      <Skeleton width={avatarSize} height={avatarSize} variant=\"circular\" />\n    </AvatarSkeletonMaskedContainer>\n  )\n}\n"],"mappings":";;;;;;AAOA,MAAa,uBAGP,EAAE,IAAI,YAAY;CACtB,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;EAAQ;EACxD,cAAc,oBAAC,mBAAD,EAA0B,MAAQ,CAAA;EAC5C;YAEJ,oBAAC,eAAD,CAAgB,CAAA;CACX,CAAA;AAEX;AAEA,MAAa,wBAIP,EAAE,IAAI,aAAa,IAAI,YAAY,SAAS;CAChD,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;EAAQ;EACxD,cAAc,oBAAC,qBAAD,EAAqB,MAAM,UAAY,CAAA;EACjD;YAEJ,oBAAC,gBAAD;GAA4B;GAAuB;EAAY,CAAA;CAC1D,CAAA;AAEX;AAEA,MAAM,kBAGA,EAAE,YAAY,gBAAgB;CAClC,OACE,oBAAC,+BAAD;EAA0C;YACxC,oBAAC,UAAD;GAAU,OAAO;GAAY,QAAQ;GAAY,SAAQ;EAAY,CAAA;CACxC,CAAA;AAEnC"}
+{"version":3,"file":"Avatar.js","names":[],"sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport type { SxProps, Theme } from '@mui/material'\nimport { Badge, Skeleton } from '@mui/material'\nimport { AvatarDefault, AvatarSkeletonMaskedContainer } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\nimport { SmallAvatarSkeleton } from './SmallAvatar.js'\n\nexport const AvatarBadgedDefault: React.FC<{\n  sx?: SxProps<Theme>\n  chain?: ExtendedChain\n  avatarSize?: number\n  badgeSize?: number\n}> = ({ sx, chain, avatarSize, badgeSize }) => {\n  return (\n    <Badge\n      overlap=\"circular\"\n      anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n      badgeContent={<ChainBadgeContent chain={chain} size={badgeSize} />}\n      sx={sx}\n    >\n      <AvatarDefault\n        badgeSize={badgeSize}\n        sx={avatarSize ? { width: avatarSize, height: avatarSize } : undefined}\n      />\n    </Badge>\n  )\n}\n\nexport const AvatarBadgedSkeleton: React.FC<{\n  sx?: SxProps<Theme>\n  avatarSize?: number\n  badgeSize?: number\n}> = ({ sx, avatarSize = 40, badgeSize = 16 }) => {\n  return (\n    <Badge\n      overlap=\"circular\"\n      anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n      badgeContent={<SmallAvatarSkeleton size={badgeSize} />}\n      sx={sx}\n    >\n      <AvatarSkeleton avatarSize={avatarSize} badgeSize={badgeSize} />\n    </Badge>\n  )\n}\n\nconst AvatarSkeleton: React.FC<{\n  avatarSize: number\n  badgeSize: number\n}> = ({ avatarSize, badgeSize }) => {\n  return (\n    <AvatarSkeletonMaskedContainer badgeSize={badgeSize}>\n      <Skeleton width={avatarSize} height={avatarSize} variant=\"circular\" />\n    </AvatarSkeletonMaskedContainer>\n  )\n}\n"],"mappings":";;;;;;AAOA,MAAa,uBAKP,EAAE,IAAI,OAAO,YAAY,gBAAgB;CAC7C,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;EAAQ;EACxD,cAAc,oBAAC,mBAAD;GAA0B;GAAO,MAAM;EAAY,CAAA;EAC7D;YAEJ,oBAAC,eAAD;GACa;GACX,IAAI,aAAa;IAAE,OAAO;IAAY,QAAQ;GAAW,IAAI,KAAA;EAC9D,CAAA;CACI,CAAA;AAEX;AAEA,MAAa,wBAIP,EAAE,IAAI,aAAa,IAAI,YAAY,SAAS;CAChD,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;EAAQ;EACxD,cAAc,oBAAC,qBAAD,EAAqB,MAAM,UAAY,CAAA;EACjD;YAEJ,oBAAC,gBAAD;GAA4B;GAAuB;EAAY,CAAA;CAC1D,CAAA;AAEX;AAEA,MAAM,kBAGA,EAAE,YAAY,gBAAgB;CAClC,OACE,oBAAC,+BAAD;EAA0C;YACxC,oBAAC,UAAD;GAAU,OAAO;GAAY,QAAQ;GAAY,SAAQ;EAAY,CAAA;CACxC,CAAA;AAEnC"}

package/dist/esm/components/Avatar/Avatar.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.style.js","names":["MuiAvatar"],"sources":["../../../../src/components/Avatar/Avatar.style.tsx"],"sourcesContent":["import type { CSSObject } from '@mui/material'\nimport {\n  AvatarGroup,\n  avatarClasses,\n  Box,\n  badgeClasses,\n  Avatar as MuiAvatar,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { getAvatarMask } from './utils.js'\n\nexport const AvatarMasked: React.FC<\n  React.ComponentProps<typeof MuiAvatar> & {\n    avatarSize?: number\n    badgeSize?: number\n  }\n> = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => prop !== 'avatarSize' && prop !== 'badgeSize',\n})<{ avatarSize?: number; badgeSize?: number }>(\n  ({ avatarSize = 40, badgeSize = 16 }) => ({\n    width: avatarSize,\n    height: avatarSize,\n    mask: getAvatarMask(badgeSize),\n  })\n)\n\nexport const TokenAvatarGroup: React.FC<\n  React.ComponentProps<typeof AvatarGroup> & { badgeSize?: number }\n> = styled(AvatarGroup)(({ theme }) => ({\n  [`& .${badgeClasses.badge}:last-of-type .${avatarClasses.root}`]: {\n    boxSizing: 'border-box',\n  },\n  [`& .${avatarClasses.root}`]: {\n    border: 'none',\n    marginLeft: 0,\n  },\n  [`& .${badgeClasses.root}:first-of-type`]: {\n    marginLeft: theme.spacing(-1),\n    border: 'none',\n  },\n  [`& .${badgeClasses.root}:last-of-type`]: {\n    border: 'none',\n  },\n}))\n\nexport const AvatarDefault: React.FC<\n  React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => {\n  const root = theme.components?.MuiAvatar?.styleOverrides?.root as CSSObject\n  return {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    borderRadius: '50%',\n    height: root?.height,\n    width: root?.width,\n    color: theme.vars.palette.text.secondary,\n    mask: getAvatarMask(badgeSize),\n    background: theme.vars.palette.grey[300],\n    ...theme.applyStyles('dark', {\n      background: theme.vars.palette.grey[800],\n    }),\n  }\n})\n\nexport const AvatarDefaultBadge: React.FC<\n  React.ComponentProps<typeof Box> & { size?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'size',\n})<{ size?: number }>(({ theme, size = 16 }) => {\n  return {\n    borderRadius: '50%',\n    height: size,\n    width: size,\n    background: theme.vars.palette.grey[300],\n    ...theme.applyStyles('dark', {\n      background: theme.vars.palette.grey[800],\n    }),\n  }\n})\n\nexport const AvatarSkeletonContainer: React.FC<\n  React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n  background: theme.vars.palette.background.paper,\n  borderRadius: '50%',\n}))\n\nexport const AvatarSkeletonMaskedContainer: React.FC<\n  React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => ({\n  background: theme.vars.palette.background.paper,\n  borderRadius: '50%',\n  mask: getAvatarMask(badgeSize),\n}))\n"],"mappings":";;;AAYA,MAAa,eAKT,OAAOA,QAAW,EACpB,oBAAoB,SAAS,SAAS,gBAAgB,SAAS,YACjE,CAAC,GACE,EAAE,aAAa,IAAI,YAAY,UAAU;CACxC,OAAO;CACP,QAAQ;CACR,MAAM,cAAc,SAAS;AAC/B,EACF;AAII,OAAO,WAAW,GAAG,EAAE,aAAa;EACrC,MAAM,aAAa,MAAM,iBAAiB,cAAc,SAAS,EAChE,WAAW,aACb;EACC,MAAM,cAAc,SAAS;EAC5B,QAAQ;EACR,YAAY;CACd;EACC,MAAM,aAAa,KAAK,kBAAkB;EACzC,YAAY,MAAM,QAAQ,EAAE;EAC5B,QAAQ;CACV;EACC,MAAM,aAAa,KAAK,iBAAiB,EACxC,QAAQ,OACV;AACF,EAAE;AAEF,MAAa,gBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,YACxC,CAAC,GAA2B,EAAE,OAAO,YAAY,SAAS;CACxD,MAAM,OAAO,MAAM,YAAY,WAAW,gBAAgB;CAC1D,OAAO;EACL,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,cAAc;EACd,QAAQ,MAAM;EACd,OAAO,MAAM;EACb,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,MAAM,cAAc,SAAS;EAC7B,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,KACtC,CAAC;CACH;AACF,CAAC;AAED,MAAa,qBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,OACxC,CAAC,GAAsB,EAAE,OAAO,OAAO,SAAS;CAC9C,OAAO;EACL,cAAc;EACd,QAAQ;EACR,OAAO;EACP,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,KACtC,CAAC;CACH;AACF,CAAC;AAED,MAAa,0BAET,OAAO,GAAG,GAAG,EAAE,aAAa;CAC9B,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;AAChB,EAAE;AAEF,MAAa,gCAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,YACxC,CAAC,GAA2B,EAAE,OAAO,YAAY,UAAU;CACzD,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;CACd,MAAM,cAAc,SAAS;AAC/B,EAAE"}
+{"version":3,"file":"Avatar.style.js","names":["MuiAvatar"],"sources":["../../../../src/components/Avatar/Avatar.style.tsx"],"sourcesContent":["import type { CSSObject } from '@mui/material'\nimport {\n  AvatarGroup,\n  avatarClasses,\n  Box,\n  badgeClasses,\n  Avatar as MuiAvatar,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { getAvatarMask } from './utils.js'\n\nexport const AvatarMasked: React.FC<\n  React.ComponentProps<typeof MuiAvatar> & {\n    avatarSize?: number\n    badgeSize?: number\n  }\n> = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => prop !== 'avatarSize' && prop !== 'badgeSize',\n})<{ avatarSize?: number; badgeSize?: number }>(\n  ({ avatarSize = 40, badgeSize = 16 }) => ({\n    width: avatarSize,\n    height: avatarSize,\n    mask: getAvatarMask(badgeSize),\n  })\n)\n\nexport const TokenAvatarGroup: React.FC<\n  React.ComponentProps<typeof AvatarGroup> & { badgeSize?: number }\n> = styled(AvatarGroup)(({ theme }) => ({\n  [`& .${badgeClasses.badge}:last-of-type .${avatarClasses.root}`]: {\n    boxSizing: 'border-box',\n  },\n  [`& .${avatarClasses.root}`]: {\n    border: 'none',\n    marginLeft: 0,\n  },\n  [`& .${badgeClasses.root}:first-of-type`]: {\n    marginLeft: theme.spacing(-1),\n    border: 'none',\n  },\n  [`& .${badgeClasses.root}:last-of-type`]: {\n    border: 'none',\n  },\n}))\n\nexport const AvatarDefault: React.FC<\n  React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => {\n  const root = theme.components?.MuiAvatar?.styleOverrides?.root as CSSObject\n  return {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    borderRadius: '50%',\n    height: root?.height,\n    width: root?.width,\n    color: theme.vars.palette.text.secondary,\n    mask: getAvatarMask(badgeSize),\n    background: theme.vars.palette.grey[300],\n    ...theme.applyStyles('dark', {\n      background: theme.vars.palette.grey[800],\n    }),\n  }\n})\n\nexport const AvatarDefaultBadge: React.FC<\n  React.ComponentProps<typeof Box> & { size?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'size',\n})<{ size?: number }>(({ theme, size = 16 }) => {\n  return {\n    borderRadius: '50%',\n    height: size,\n    width: size,\n    background: theme.vars.palette.grey[300],\n    ...theme.applyStyles('dark', {\n      background: theme.vars.palette.grey[800],\n    }),\n  }\n})\n\nexport const AvatarSkeletonContainer: React.FC<\n  React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n  background: theme.vars.palette.background.paper,\n  borderRadius: '50%',\n}))\n\nexport const AvatarSkeletonMaskedContainer: React.FC<\n  React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => ({\n  background: theme.vars.palette.background.paper,\n  borderRadius: '50%',\n  mask: getAvatarMask(badgeSize),\n}))\n"],"mappings":";;;AAYA,MAAa,eAKT,OAAOA,QAAW,EACpB,oBAAoB,SAAS,SAAS,gBAAgB,SAAS,YACjE,CAAC,CAAC,EACC,EAAE,aAAa,IAAI,YAAY,UAAU;CACxC,OAAO;CACP,QAAQ;CACR,MAAM,cAAc,SAAS;AAC/B,EACF;AAII,OAAO,WAAW,CAAC,EAAE,EAAE,aAAa;EACrC,MAAM,aAAa,MAAM,iBAAiB,cAAc,SAAS,EAChE,WAAW,aACb;EACC,MAAM,cAAc,SAAS;EAC5B,QAAQ;EACR,YAAY;CACd;EACC,MAAM,aAAa,KAAK,kBAAkB;EACzC,YAAY,MAAM,QAAQ,EAAE;EAC5B,QAAQ;CACV;EACC,MAAM,aAAa,KAAK,iBAAiB,EACxC,QAAQ,OACV;AACF,EAAE;AAEF,MAAa,gBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,YACxC,CAAC,CAAC,EAA0B,EAAE,OAAO,YAAY,SAAS;CACxD,MAAM,OAAO,MAAM,YAAY,WAAW,gBAAgB;CAC1D,OAAO;EACL,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,cAAc;EACd,QAAQ,MAAM;EACd,OAAO,MAAM;EACb,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,MAAM,cAAc,SAAS;EAC7B,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,KACtC,CAAC;CACH;AACF,CAAC;AAED,MAAa,qBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,OACxC,CAAC,CAAC,EAAqB,EAAE,OAAO,OAAO,SAAS;CAC9C,OAAO;EACL,cAAc;EACd,QAAQ;EACR,OAAO;EACP,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,KACtC,CAAC;CACH;AACF,CAAC;AAED,MAAa,0BAET,OAAO,GAAG,CAAC,EAAE,EAAE,aAAa;CAC9B,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;AAChB,EAAE;AAEF,MAAa,gCAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,YACxC,CAAC,CAAC,EAA0B,EAAE,OAAO,YAAY,UAAU;CACzD,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;CACd,MAAM,cAAc,SAAS;AAC/B,EAAE"}

package/dist/esm/components/Avatar/SmallAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SmallAvatar.js","names":[],"sources":["../../../../src/components/Avatar/SmallAvatar.tsx"],"sourcesContent":["import { Avatar, Skeleton, styled } from '@mui/material'\nimport type React from 'react'\nimport { AvatarSkeletonContainer } from './Avatar.style.js'\n\ninterface SmallAvatarProps {\n  size?: number\n}\n\nexport const SmallAvatar: React.FC<\n  React.ComponentProps<typeof Avatar> & SmallAvatarProps\n> = styled(Avatar, {\n  shouldForwardProp: (prop) => prop !== 'size',\n})<SmallAvatarProps>(({ theme, size = 16 }) => ({\n  background: theme.vars.palette.background.paper,\n  width: size,\n  height: size,\n}))\n\nexport const SmallAvatarSkeleton: React.FC<{\n  size?: number\n}> = ({ size = 16 }) => {\n  return (\n    <AvatarSkeletonContainer>\n      <Skeleton width={size} height={size} variant=\"circular\" />\n    </AvatarSkeletonContainer>\n  )\n}\n"],"mappings":";;;;AAQA,MAAa,cAET,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,OACxC,CAAC,GAAqB,EAAE,OAAO,OAAO,UAAU;CAC9C,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,OAAO;CACP,QAAQ;AACV,EAAE;AAEF,MAAa,uBAEP,EAAE,OAAO,SAAS;CACtB,OACE,oBAAC,yBAAD,EAAA,UACE,oBAAC,UAAD;EAAU,OAAO;EAAM,QAAQ;EAAM,SAAQ;CAAY,CAAA,EAClC,CAAA;AAE7B"}
+{"version":3,"file":"SmallAvatar.js","names":[],"sources":["../../../../src/components/Avatar/SmallAvatar.tsx"],"sourcesContent":["import { Avatar, Skeleton, styled } from '@mui/material'\nimport type React from 'react'\nimport { AvatarSkeletonContainer } from './Avatar.style.js'\n\ninterface SmallAvatarProps {\n  size?: number\n}\n\nexport const SmallAvatar: React.FC<\n  React.ComponentProps<typeof Avatar> & SmallAvatarProps\n> = styled(Avatar, {\n  shouldForwardProp: (prop) => prop !== 'size',\n})<SmallAvatarProps>(({ theme, size = 16 }) => ({\n  background: theme.vars.palette.background.paper,\n  width: size,\n  height: size,\n}))\n\nexport const SmallAvatarSkeleton: React.FC<{\n  size?: number\n}> = ({ size = 16 }) => {\n  return (\n    <AvatarSkeletonContainer>\n      <Skeleton width={size} height={size} variant=\"circular\" />\n    </AvatarSkeletonContainer>\n  )\n}\n"],"mappings":";;;;AAQA,MAAa,cAET,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,OACxC,CAAC,CAAC,EAAoB,EAAE,OAAO,OAAO,UAAU;CAC9C,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,OAAO;CACP,QAAQ;AACV,EAAE;AAEF,MAAa,uBAEP,EAAE,OAAO,SAAS;CACtB,OACE,oBAAC,yBAAD,EAAA,UACE,oBAAC,UAAD;EAAU,OAAO;EAAM,QAAQ;EAAM,SAAQ;CAAY,CAAA,EAClC,CAAA;AAE7B"}

package/dist/esm/components/BaseTransactionButton/BaseTransactionButton.js

@@ -41,6 +41,7 @@ const BaseTransactionButton = ({ onClick, text, disabled, loading, route, sx })
 		loadingPosition: "center",
 		fullWidth: true,
 		sx,
+		"data-testid": "widget-transaction-button",
 		children: getButtonText()
 	});
 };

package/dist/esm/components/BaseTransactionButton/BaseTransactionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseTransactionButton.js","names":[],"sources":["../../../../src/components/BaseTransactionButton/BaseTransactionButton.tsx"],"sourcesContent":["import { useWalletMenu } from '@lifi/wallet-management'\nimport { Button } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useRouteRequiredAccountConnection } from '../../hooks/useRouteRequiredAccountConnection.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport type { BaseTransactionButtonProps } from './types.js'\n\nexport const BaseTransactionButton: React.FC<BaseTransactionButtonProps> = ({\n  onClick,\n  text,\n  disabled,\n  loading,\n  route,\n  sx,\n}) => {\n  const { t } = useTranslation()\n  const { walletConfig } = useWidgetConfig()\n  const { openWalletMenu } = useWalletMenu()\n  const [fromChainId] = useFieldValues('fromChain')\n  const { chain } = useChain(fromChainId)\n  const { connected, missingChain } = useRouteRequiredAccountConnection(\n    route,\n    chain\n  )\n  const handleClick = async (e: React.MouseEvent<HTMLElement>) => {\n    if (connected) {\n      onClick?.()\n      return\n    }\n    const connectionOptions = missingChain ? { chain: missingChain } : undefined\n    if (\n      walletConfig?.onConnect &&\n      !walletConfig?.forceInternalWalletManagement\n    ) {\n      walletConfig.onConnect(connectionOptions)\n    } else {\n      openWalletMenu(connectionOptions)\n      e.currentTarget.blur() // Remove focus to prevent accessibility issues when opening drawer\n    }\n  }\n\n  const getButtonText = () => {\n    if (connected) {\n      if (text) {\n        return text\n      }\n    }\n    return missingChain\n      ? t('button.connectChainWallet', {\n          chain: missingChain.name,\n        })\n      : t('button.connectWallet')\n  }\n\n  return (\n    <Button\n      variant=\"contained\"\n      color=\"primary\"\n      onClick={handleClick}\n      disabled={connected && disabled}\n      loading={loading}\n      loadingPosition=\"center\"\n      fullWidth\n      sx={sx}\n    >\n      {getButtonText()}\n    </Button>\n  )\n}\n"],"mappings":";;;;;;;;;AASA,MAAa,yBAA+D,EAC1E,SACA,MACA,UACA,SACA,OACA,SACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,EAAE,mBAAmB,cAAc;CACzC,MAAM,CAAC,eAAe,eAAe,WAAW;CAChD,MAAM,EAAE,UAAU,SAAS,WAAW;CACtC,MAAM,EAAE,WAAW,iBAAiB,kCAClC,OACA,KACF;CACA,MAAM,cAAc,OAAO,MAAqC;EAC9D,IAAI,WAAW;GACb,UAAU;GACV;EACF;EACA,MAAM,oBAAoB,eAAe,EAAE,OAAO,aAAa,IAAI,KAAA;EACnE,IACE,cAAc,aACd,CAAC,cAAc,+BAEf,aAAa,UAAU,iBAAiB;OACnC;GACL,eAAe,iBAAiB;GAChC,EAAE,cAAc,KAAK;EACvB;CACF;CAEA,MAAM,sBAAsB;EAC1B,IAAI;OACE,MACF,OAAO;EAAA;EAGX,OAAO,eACH,EAAE,6BAA6B,EAC7B,OAAO,aAAa,KACtB,CAAC,IACD,EAAE,sBAAsB;CAC9B;CAEA,OACE,oBAAC,QAAD;EACE,SAAQ;EACR,OAAM;EACN,SAAS;EACT,UAAU,aAAa;EACd;EACT,iBAAgB;EAChB,WAAA;EACI;YAEH,cAAc;CACT,CAAA;AAEZ"}
+{"version":3,"file":"BaseTransactionButton.js","names":[],"sources":["../../../../src/components/BaseTransactionButton/BaseTransactionButton.tsx"],"sourcesContent":["import { useWalletMenu } from '@lifi/wallet-management'\nimport { Button } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useRouteRequiredAccountConnection } from '../../hooks/useRouteRequiredAccountConnection.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport type { BaseTransactionButtonProps } from './types.js'\n\nexport const BaseTransactionButton: React.FC<BaseTransactionButtonProps> = ({\n  onClick,\n  text,\n  disabled,\n  loading,\n  route,\n  sx,\n}) => {\n  const { t } = useTranslation()\n  const { walletConfig } = useWidgetConfig()\n  const { openWalletMenu } = useWalletMenu()\n  const [fromChainId] = useFieldValues('fromChain')\n  const { chain } = useChain(fromChainId)\n  const { connected, missingChain } = useRouteRequiredAccountConnection(\n    route,\n    chain\n  )\n  const handleClick = async (e: React.MouseEvent<HTMLElement>) => {\n    if (connected) {\n      onClick?.()\n      return\n    }\n    const connectionOptions = missingChain ? { chain: missingChain } : undefined\n    if (\n      walletConfig?.onConnect &&\n      !walletConfig?.forceInternalWalletManagement\n    ) {\n      walletConfig.onConnect(connectionOptions)\n    } else {\n      openWalletMenu(connectionOptions)\n      e.currentTarget.blur() // Remove focus to prevent accessibility issues when opening drawer\n    }\n  }\n\n  const getButtonText = () => {\n    if (connected) {\n      if (text) {\n        return text\n      }\n    }\n    return missingChain\n      ? t('button.connectChainWallet', {\n          chain: missingChain.name,\n        })\n      : t('button.connectWallet')\n  }\n\n  return (\n    <Button\n      variant=\"contained\"\n      color=\"primary\"\n      onClick={handleClick}\n      disabled={connected && disabled}\n      loading={loading}\n      loadingPosition=\"center\"\n      fullWidth\n      sx={sx}\n      data-testid=\"widget-transaction-button\"\n    >\n      {getButtonText()}\n    </Button>\n  )\n}\n"],"mappings":";;;;;;;;;AASA,MAAa,yBAA+D,EAC1E,SACA,MACA,UACA,SACA,OACA,SACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,EAAE,mBAAmB,cAAc;CACzC,MAAM,CAAC,eAAe,eAAe,WAAW;CAChD,MAAM,EAAE,UAAU,SAAS,WAAW;CACtC,MAAM,EAAE,WAAW,iBAAiB,kCAClC,OACA,KACF;CACA,MAAM,cAAc,OAAO,MAAqC;EAC9D,IAAI,WAAW;GACb,UAAU;GACV;EACF;EACA,MAAM,oBAAoB,eAAe,EAAE,OAAO,aAAa,IAAI,KAAA;EACnE,IACE,cAAc,aACd,CAAC,cAAc,+BAEf,aAAa,UAAU,iBAAiB;OACnC;GACL,eAAe,iBAAiB;GAChC,EAAE,cAAc,KAAK;EACvB;CACF;CAEA,MAAM,sBAAsB;EAC1B,IAAI;OACE,MACF,OAAO;EAAA;EAGX,OAAO,eACH,EAAE,6BAA6B,EAC7B,OAAO,aAAa,KACtB,CAAC,IACD,EAAE,sBAAsB;CAC9B;CAEA,OACE,oBAAC,QAAD;EACE,SAAQ;EACR,OAAM;EACN,SAAS;EACT,UAAU,aAAa;EACd;EACT,iBAAgB;EAChB,WAAA;EACI;EACJ,eAAY;YAEX,cAAc;CACT,CAAA;AAEZ"}

package/dist/esm/components/BottomSheet/BottomSheet.js

@@ -1,10 +1,10 @@
 import { useGetScrollableContainer } from "../../hooks/useScrollableContainer.js";
 import { modalProps, slotProps } from "../Dialog/Dialog.js";
-import { forwardRef, startTransition, useCallback, useImperativeHandle, useRef, useState } from "react";
+import { startTransition, useCallback, useImperativeHandle, useRef, useState } from "react";
 import { Drawer } from "@mui/material";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/BottomSheet/BottomSheet.tsx
-const BottomSheet = forwardRef(({ elementRef, children, open, onClose, keepMounted = false }, ref) => {
+const BottomSheet = ({ elementRef, children, open, onClose, keepMounted = false, ref }) => {
 	const getContainer = useGetScrollableContainer();
 	const openRef = useRef(open);
 	const [drawerOpen, setDrawerOpen] = useState(open);
@@ -39,7 +39,7 @@ const BottomSheet = forwardRef(({ elementRef, children, open, onClose, keepMount
 		inert: isInert,
 		children
 	});
-});
+};
 //#endregion
 export { BottomSheet };
 

package/dist/esm/components/BottomSheet/BottomSheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheet.js","names":[],"sources":["../../../../src/components/BottomSheet/BottomSheet.tsx"],"sourcesContent":["import { Drawer } from '@mui/material'\nimport type { ForwardRefExoticComponent, RefAttributes } from 'react'\nimport {\n  forwardRef,\n  startTransition,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react'\nimport { useGetScrollableContainer } from '../../hooks/useScrollableContainer.js'\nimport { modalProps, slotProps } from '../Dialog/Dialog.js'\nimport type { BottomSheetBase, BottomSheetProps } from './types.js'\n\nexport const BottomSheet: ForwardRefExoticComponent<\n  Omit<BottomSheetProps, 'ref'> & RefAttributes<BottomSheetBase>\n> = forwardRef<BottomSheetBase, BottomSheetProps>(\n  ({ elementRef, children, open, onClose, keepMounted = false }, ref) => {\n    const getContainer = useGetScrollableContainer()\n    const openRef = useRef(open)\n    const [drawerOpen, setDrawerOpen] = useState(open)\n    const [isInert, setIsInert] = useState(!open)\n\n    const close = useCallback(() => {\n      // Set inert first to prevent focus issues\n      setIsInert(true)\n      // Push the state update to the next event loop tick\n      // to ensure the inert is applied to before the drawer is closed\n      startTransition(() => {\n        setDrawerOpen(false)\n        openRef.current = false\n        onClose?.()\n      })\n    }, [onClose])\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        isOpen: () => openRef.current,\n        open: () => {\n          setIsInert(false)\n          setDrawerOpen(true)\n          openRef.current = true\n        },\n        close,\n      }),\n      [close]\n    )\n\n    return (\n      <Drawer\n        container={getContainer}\n        ref={elementRef}\n        anchor=\"bottom\"\n        open={drawerOpen}\n        onClose={close}\n        ModalProps={modalProps}\n        slotProps={slotProps}\n        disableAutoFocus\n        keepMounted={keepMounted}\n        inert={isInert}\n      >\n        {children}\n      </Drawer>\n    )\n  }\n)\n"],"mappings":";;;;;;AAcA,MAAa,cAET,YACD,EAAE,YAAY,UAAU,MAAM,SAAS,cAAc,SAAS,QAAQ;CACrE,MAAM,eAAe,0BAA0B;CAC/C,MAAM,UAAU,OAAO,IAAI;CAC3B,MAAM,CAAC,YAAY,iBAAiB,SAAS,IAAI;CACjD,MAAM,CAAC,SAAS,cAAc,SAAS,CAAC,IAAI;CAE5C,MAAM,QAAQ,kBAAkB;EAE9B,WAAW,IAAI;EAGf,sBAAsB;GACpB,cAAc,KAAK;GACnB,QAAQ,UAAU;GAClB,UAAU;EACZ,CAAC;CACH,GAAG,CAAC,OAAO,CAAC;CAEZ,oBACE,YACO;EACL,cAAc,QAAQ;EACtB,YAAY;GACV,WAAW,KAAK;GAChB,cAAc,IAAI;GAClB,QAAQ,UAAU;EACpB;EACA;CACF,IACA,CAAC,KAAK,CACR;CAEA,OACE,oBAAC,QAAD;EACE,WAAW;EACX,KAAK;EACL,QAAO;EACP,MAAM;EACN,SAAS;EACT,YAAY;EACD;EACX,kBAAA;EACa;EACb,OAAO;EAEN;CACK,CAAA;AAEZ,CACF"}
+{"version":3,"file":"BottomSheet.js","names":[],"sources":["../../../../src/components/BottomSheet/BottomSheet.tsx"],"sourcesContent":["import { Drawer } from '@mui/material'\nimport type { JSX, Ref } from 'react'\nimport {\n  startTransition,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react'\nimport { useGetScrollableContainer } from '../../hooks/useScrollableContainer.js'\nimport { modalProps, slotProps } from '../Dialog/Dialog.js'\nimport type { BottomSheetBase, BottomSheetProps } from './types.js'\n\nexport const BottomSheet = ({\n  elementRef,\n  children,\n  open,\n  onClose,\n  keepMounted = false,\n  ref,\n}: Omit<BottomSheetProps, 'ref'> & {\n  ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n  const getContainer = useGetScrollableContainer()\n  const openRef = useRef(open)\n  const [drawerOpen, setDrawerOpen] = useState(open)\n  const [isInert, setIsInert] = useState(!open)\n\n  const close = useCallback(() => {\n    // Set inert first to prevent focus issues\n    setIsInert(true)\n    // Push the state update to the next event loop tick\n    // to ensure the inert is applied to before the drawer is closed\n    startTransition(() => {\n      setDrawerOpen(false)\n      openRef.current = false\n      onClose?.()\n    })\n  }, [onClose])\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      isOpen: () => openRef.current,\n      open: () => {\n        setIsInert(false)\n        setDrawerOpen(true)\n        openRef.current = true\n      },\n      close,\n    }),\n    [close]\n  )\n\n  return (\n    <Drawer\n      container={getContainer}\n      ref={elementRef}\n      anchor=\"bottom\"\n      open={drawerOpen}\n      onClose={close}\n      ModalProps={modalProps}\n      slotProps={slotProps}\n      disableAutoFocus\n      keepMounted={keepMounted}\n      inert={isInert}\n    >\n      {children}\n    </Drawer>\n  )\n}\n"],"mappings":";;;;;;AAaA,MAAa,eAAe,EAC1B,YACA,UACA,MACA,SACA,cAAc,OACd,UAGiB;CACjB,MAAM,eAAe,0BAA0B;CAC/C,MAAM,UAAU,OAAO,IAAI;CAC3B,MAAM,CAAC,YAAY,iBAAiB,SAAS,IAAI;CACjD,MAAM,CAAC,SAAS,cAAc,SAAS,CAAC,IAAI;CAE5C,MAAM,QAAQ,kBAAkB;EAE9B,WAAW,IAAI;EAGf,sBAAsB;GACpB,cAAc,KAAK;GACnB,QAAQ,UAAU;GAClB,UAAU;EACZ,CAAC;CACH,GAAG,CAAC,OAAO,CAAC;CAEZ,oBACE,YACO;EACL,cAAc,QAAQ;EACtB,YAAY;GACV,WAAW,KAAK;GAChB,cAAc,IAAI;GAClB,QAAQ,UAAU;EACpB;EACA;CACF,IACA,CAAC,KAAK,CACR;CAEA,OACE,oBAAC,QAAD;EACE,WAAW;EACX,KAAK;EACL,QAAO;EACP,MAAM;EACN,SAAS;EACT,YAAY;EACD;EACX,kBAAA;EACa;EACb,OAAO;EAEN;CACK,CAAA;AAEZ"}

package/dist/esm/components/ButtonTertiary.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonTertiary.js","names":[],"sources":["../../../src/components/ButtonTertiary.tsx"],"sourcesContent":["import { Button, buttonClasses, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const ButtonTertiary: React.FC<React.ComponentProps<typeof Button>> =\n  styled(Button)(({ theme }) => ({\n    color: theme.vars.palette.text.primary,\n    height: 40,\n    fontSize: 14,\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n    '&:hover, &:active': {\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n    },\n    [`&.${buttonClasses.loading}:disabled`]: {\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n    },\n    ...theme.applyStyles('dark', {\n      color: theme.vars.palette.text.primary,\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n      '&:hover, &:active': {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n      },\n      [`&.${buttonClasses.loading}:disabled`]: {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n      },\n    }),\n    [`.${buttonClasses.loadingIndicator}`]: {\n      color: theme.vars.palette.text.primary,\n    },\n  }))\n"],"mappings":";;AAGA,MAAa,iBACX,OAAO,MAAM,GAAG,EAAE,aAAa;CAC7B,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,QAAQ;CACR,UAAU;CACV,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;CAC9E,qBAAqB,EACnB,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;EACC,KAAK,cAAc,QAAQ,aAAa,EACvC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACA,GAAG,MAAM,YAAY,QAAQ;EAC3B,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;EAC9E,qBAAqB,EACnB,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;GACC,KAAK,cAAc,QAAQ,aAAa,EACvC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACF,CAAC;EACA,IAAI,cAAc,qBAAqB,EACtC,OAAO,MAAM,KAAK,QAAQ,KAAK,QACjC;AACF,EAAE"}
+{"version":3,"file":"ButtonTertiary.js","names":[],"sources":["../../../src/components/ButtonTertiary.tsx"],"sourcesContent":["import { Button, buttonClasses, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const ButtonTertiary: React.FC<React.ComponentProps<typeof Button>> =\n  styled(Button)(({ theme }) => ({\n    color: theme.vars.palette.text.primary,\n    height: 40,\n    fontSize: 14,\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n    '&:hover, &:active': {\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n    },\n    [`&.${buttonClasses.loading}:disabled`]: {\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n    },\n    ...theme.applyStyles('dark', {\n      color: theme.vars.palette.text.primary,\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n      '&:hover, &:active': {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n      },\n      [`&.${buttonClasses.loading}:disabled`]: {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n      },\n    }),\n    [`.${buttonClasses.loadingIndicator}`]: {\n      color: theme.vars.palette.text.primary,\n    },\n  }))\n"],"mappings":";;AAGA,MAAa,iBACX,OAAO,MAAM,CAAC,EAAE,EAAE,aAAa;CAC7B,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,QAAQ;CACR,UAAU;CACV,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;CAC9E,qBAAqB,EACnB,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;EACC,KAAK,cAAc,QAAQ,aAAa,EACvC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACA,GAAG,MAAM,YAAY,QAAQ;EAC3B,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;EAC9E,qBAAqB,EACnB,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;GACC,KAAK,cAAc,QAAQ,aAAa,EACvC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACF,CAAC;EACA,IAAI,cAAc,qBAAqB,EACtC,OAAO,MAAM,KAAK,QAAQ,KAAK,QACjC;AACF,EAAE"}

package/dist/esm/components/Card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","names":["Card","MuiCard"],"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import type { CardProps as MuiCardProps } from '@mui/material'\nimport { Card as MuiCard, styled } from '@mui/material'\nimport type React from 'react'\n\nexport interface CardProps extends MuiCardProps {\n  type?: 'default' | 'selected' | 'error'\n  selectionColor?: 'primary' | 'secondary'\n  indented?: boolean\n}\n\nexport const Card: React.FC<React.ComponentProps<typeof MuiCard> & CardProps> =\n  styled(MuiCard, {\n    shouldForwardProp: (prop) =>\n      !['type', 'indented', 'selectionColor'].includes(prop as string),\n  })<CardProps>(({ theme }) => {\n    return {\n      padding: 0,\n      variants: [\n        {\n          props: ({ indented }) => indented,\n          style: {\n            padding: theme.spacing(2),\n          },\n        },\n        {\n          props: {\n            selectionColor: 'primary',\n            type: 'selected',\n          },\n          style: {\n            borderWidth: 1,\n            borderStyle: 'solid',\n            borderColor: theme.vars.palette.primary.main,\n            backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 5%, white)`,\n            '&:hover': {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 10%, white)`,\n            },\n            ...theme.applyStyles('dark', {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 35%, black)`,\n              '&:hover': {\n                backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 40%, black)`,\n              },\n              borderColor: theme.vars.palette.primary.main,\n            }),\n          },\n        },\n        {\n          props: {\n            selectionColor: 'secondary',\n            type: 'selected',\n          },\n          style: {\n            borderWidth: 1,\n            borderStyle: 'solid',\n            borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n            backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, white)`,\n            '&:hover': {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, white)`,\n            },\n            ...theme.applyStyles('dark', {\n              borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, black)`,\n              '&:hover': {\n                backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, black)`,\n              },\n            }),\n          },\n        },\n        {\n          props: {\n            type: 'error',\n          },\n          style: {\n            borderWidth: 1,\n            borderStyle: 'solid',\n            borderColor: theme.vars.palette.error.main,\n          },\n        },\n      ],\n    }\n  })\n"],"mappings":";;AAUA,MAAaA,SACX,OAAOC,MAAS,EACd,oBAAoB,SAClB,CAAC;CAAC;CAAQ;CAAY;AAAgB,EAAE,SAAS,IAAc,EACnE,CAAC,GAAc,EAAE,YAAY;CAC3B,OAAO;EACL,SAAS;EACT,UAAU;GACR;IACE,QAAQ,EAAE,eAAe;IACzB,OAAO,EACL,SAAS,MAAM,QAAQ,CAAC,EAC1B;GACF;GACA;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;IACR;IACA,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,QAAQ;KACxC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,cACzE;KACA,GAAG,MAAM,YAAY,QAAQ;MAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;MACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,cACzE;MACA,aAAa,MAAM,KAAK,QAAQ,QAAQ;KAC1C,CAAC;IACH;GACF;GACA;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;IACR;IACA,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,cAC3E;KACA,GAAG,MAAM,YAAY,QAAQ;MAC3B,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,cAC3E;KACF,CAAC;IACH;GACF;GACA;IACE,OAAO,EACL,MAAM,QACR;IACA,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,MAAM;IACxC;GACF;EACF;CACF;AACF,CAAC"}
+{"version":3,"file":"Card.js","names":["Card","MuiCard"],"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import type { CardProps as MuiCardProps } from '@mui/material'\nimport { Card as MuiCard, styled } from '@mui/material'\nimport type React from 'react'\n\nexport interface CardProps extends MuiCardProps {\n  type?: 'default' | 'selected' | 'error'\n  selectionColor?: 'primary' | 'secondary'\n  indented?: boolean\n}\n\nexport const Card: React.FC<React.ComponentProps<typeof MuiCard> & CardProps> =\n  styled(MuiCard, {\n    shouldForwardProp: (prop) =>\n      !['type', 'indented', 'selectionColor'].includes(prop as string),\n  })<CardProps>(({ theme }) => {\n    return {\n      padding: 0,\n      variants: [\n        {\n          props: ({ indented }) => indented,\n          style: {\n            padding: theme.spacing(2),\n          },\n        },\n        {\n          props: {\n            selectionColor: 'primary',\n            type: 'selected',\n          },\n          style: {\n            borderWidth: 1,\n            borderStyle: 'solid',\n            borderColor: theme.vars.palette.primary.main,\n            backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 5%, white)`,\n            '&:hover': {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 10%, white)`,\n            },\n            ...theme.applyStyles('dark', {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 35%, black)`,\n              '&:hover': {\n                backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 40%, black)`,\n              },\n              borderColor: theme.vars.palette.primary.main,\n            }),\n          },\n        },\n        {\n          props: {\n            selectionColor: 'secondary',\n            type: 'selected',\n          },\n          style: {\n            borderWidth: 1,\n            borderStyle: 'solid',\n            borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n            backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, white)`,\n            '&:hover': {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, white)`,\n            },\n            ...theme.applyStyles('dark', {\n              borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, black)`,\n              '&:hover': {\n                backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, black)`,\n              },\n            }),\n          },\n        },\n        {\n          props: {\n            type: 'error',\n          },\n          style: {\n            borderWidth: 1,\n            borderStyle: 'solid',\n            borderColor: theme.vars.palette.error.main,\n          },\n        },\n      ],\n    }\n  })\n"],"mappings":";;AAUA,MAAaA,SACX,OAAOC,MAAS,EACd,oBAAoB,SAClB,CAAC;CAAC;CAAQ;CAAY;AAAgB,CAAC,CAAC,SAAS,IAAc,EACnE,CAAC,CAAC,EAAa,EAAE,YAAY;CAC3B,OAAO;EACL,SAAS;EACT,UAAU;GACR;IACE,QAAQ,EAAE,eAAe;IACzB,OAAO,EACL,SAAS,MAAM,QAAQ,CAAC,EAC1B;GACF;GACA;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;IACR;IACA,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,QAAQ;KACxC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,cACzE;KACA,GAAG,MAAM,YAAY,QAAQ;MAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;MACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,cACzE;MACA,aAAa,MAAM,KAAK,QAAQ,QAAQ;KAC1C,CAAC;IACH;GACF;GACA;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;IACR;IACA,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,cAC3E;KACA,GAAG,MAAM,YAAY,QAAQ;MAC3B,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,cAC3E;KACF,CAAC;IACH;GACF;GACA;IACE,OAAO,EACL,MAAM,QACR;IACA,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,MAAM;IACxC;GACF;EACF;CACF;AACF,CAAC"}

package/dist/esm/components/Card/CardButton.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardButton.style.js","names":[],"sources":["../../../../src/components/Card/CardButton.style.tsx"],"sourcesContent":["import { Box, ButtonBase, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const CardRowButton: React.FC<React.ComponentProps<typeof ButtonBase>> =\n  styled(ButtonBase)(({ theme }) => ({\n    background: 'none',\n    color: 'inherit',\n    border: 'none',\n    font: 'inherit',\n    cursor: 'pointer',\n    outline: 'inherit',\n    display: 'flex',\n    width: '100%',\n    justifyContent: 'space-between',\n    alignItems: 'center',\n    padding: theme.spacing(2),\n    borderRadius: theme.vars.shape.borderRadius,\n  }))\n\nexport const CardValue: React.FC<React.ComponentProps<typeof Typography>> =\n  styled(Typography)({\n    lineHeight: '1.25',\n    fontWeight: 500,\n  })\n\nexport const CardTitleContainer: React.FC<React.ComponentProps<typeof Box>> =\n  styled(Box)(({ theme }) => ({\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(1.5),\n  }))\n"],"mappings":";;AAGA,MAAa,gBACX,OAAO,UAAU,GAAG,EAAE,aAAa;CACjC,YAAY;CACZ,OAAO;CACP,QAAQ;CACR,MAAM;CACN,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,gBAAgB;CAChB,YAAY;CACZ,SAAS,MAAM,QAAQ,CAAC;CACxB,cAAc,MAAM,KAAK,MAAM;AACjC,EAAE;AAEJ,MAAa,YACX,OAAO,UAAU,EAAE;CACjB,YAAY;CACZ,YAAY;AACd,CAAC;AAEH,MAAa,qBACX,OAAO,GAAG,GAAG,EAAE,aAAa;CAC1B,SAAS;CACT,YAAY;CACZ,KAAK,MAAM,QAAQ,GAAG;AACxB,EAAE"}
+{"version":3,"file":"CardButton.style.js","names":[],"sources":["../../../../src/components/Card/CardButton.style.tsx"],"sourcesContent":["import { Box, ButtonBase, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const CardRowButton: React.FC<React.ComponentProps<typeof ButtonBase>> =\n  styled(ButtonBase)(({ theme }) => ({\n    background: 'none',\n    color: 'inherit',\n    border: 'none',\n    font: 'inherit',\n    cursor: 'pointer',\n    outline: 'inherit',\n    display: 'flex',\n    width: '100%',\n    justifyContent: 'space-between',\n    alignItems: 'center',\n    padding: theme.spacing(2),\n    borderRadius: theme.vars.shape.borderRadius,\n  }))\n\nexport const CardValue: React.FC<React.ComponentProps<typeof Typography>> =\n  styled(Typography)({\n    lineHeight: '1.25',\n    fontWeight: 500,\n  })\n\nexport const CardTitleContainer: React.FC<React.ComponentProps<typeof Box>> =\n  styled(Box)(({ theme }) => ({\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(1.5),\n  }))\n"],"mappings":";;AAGA,MAAa,gBACX,OAAO,UAAU,CAAC,EAAE,EAAE,aAAa;CACjC,YAAY;CACZ,OAAO;CACP,QAAQ;CACR,MAAM;CACN,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,gBAAgB;CAChB,YAAY;CACZ,SAAS,MAAM,QAAQ,CAAC;CACxB,cAAc,MAAM,KAAK,MAAM;AACjC,EAAE;AAEJ,MAAa,YACX,OAAO,UAAU,CAAC,CAAC;CACjB,YAAY;CACZ,YAAY;AACd,CAAC;AAEH,MAAa,qBACX,OAAO,GAAG,CAAC,EAAE,EAAE,aAAa;CAC1B,SAAS;CACT,YAAY;CACZ,KAAK,MAAM,QAAQ,GAAG;AACxB,EAAE"}

package/dist/esm/components/Card/CardHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeader.js","names":["CardHeader","MuiCardHeader"],"sources":["../../../../src/components/Card/CardHeader.tsx"],"sourcesContent":["import {\n  cardHeaderClasses,\n  CardHeader as MuiCardHeader,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const CardHeader: React.FC<React.ComponentProps<typeof MuiCardHeader>> =\n  styled(MuiCardHeader)(({ theme }) => ({\n    [`.${cardHeaderClasses.action}`]: {\n      marginTop: -2,\n      alignSelf: 'center',\n    },\n    [`.${cardHeaderClasses.title}`]: {\n      fontWeight: 600,\n      fontSize: 18,\n      lineHeight: 1.3334,\n      color: theme.vars.palette.text.primary,\n      textAlign: 'left',\n    },\n    [`.${cardHeaderClasses.subheader}`]: {\n      fontWeight: 500,\n      fontSize: 12,\n      lineHeight: 1.3334,\n      color: theme.vars.palette.text.secondary,\n      textAlign: 'left',\n    },\n  }))\n"],"mappings":";;AAOA,MAAaA,eACX,OAAOC,UAAa,GAAG,EAAE,aAAa;EACnC,IAAI,kBAAkB,WAAW;EAChC,WAAW;EACX,WAAW;CACb;EACC,IAAI,kBAAkB,UAAU;EAC/B,YAAY;EACZ,UAAU;EACV,YAAY;EACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,WAAW;CACb;EACC,IAAI,kBAAkB,cAAc;EACnC,YAAY;EACZ,UAAU;EACV,YAAY;EACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,WAAW;CACb;AACF,EAAE"}
+{"version":3,"file":"CardHeader.js","names":["CardHeader","MuiCardHeader"],"sources":["../../../../src/components/Card/CardHeader.tsx"],"sourcesContent":["import {\n  cardHeaderClasses,\n  CardHeader as MuiCardHeader,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const CardHeader: React.FC<React.ComponentProps<typeof MuiCardHeader>> =\n  styled(MuiCardHeader)(({ theme }) => ({\n    [`.${cardHeaderClasses.action}`]: {\n      marginTop: -2,\n      alignSelf: 'center',\n    },\n    [`.${cardHeaderClasses.title}`]: {\n      fontWeight: 600,\n      fontSize: 18,\n      lineHeight: 1.3334,\n      color: theme.vars.palette.text.primary,\n      textAlign: 'left',\n    },\n    [`.${cardHeaderClasses.subheader}`]: {\n      fontWeight: 500,\n      fontSize: 12,\n      lineHeight: 1.3334,\n      color: theme.vars.palette.text.secondary,\n      textAlign: 'left',\n    },\n  }))\n"],"mappings":";;AAOA,MAAaA,eACX,OAAOC,UAAa,CAAC,EAAE,EAAE,aAAa;EACnC,IAAI,kBAAkB,WAAW;EAChC,WAAW;EACX,WAAW;CACb;EACC,IAAI,kBAAkB,UAAU;EAC/B,YAAY;EACZ,UAAU;EACV,YAAY;EACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,WAAW;CACb;EACC,IAAI,kBAAkB,cAAc;EACnC,YAAY;EACZ,UAAU;EACV,YAAY;EACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,WAAW;CACb;AACF,EAAE"}

package/dist/esm/components/Card/CardIconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardIconButton.js","names":["MuiIconButton"],"sources":["../../../../src/components/Card/CardIconButton.tsx"],"sourcesContent":["import type { IconButtonProps, LinkProps } from '@mui/material'\nimport { IconButton as MuiIconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const CardIconButton: React.FC<\n  React.ComponentProps<typeof MuiIconButton> &\n    IconButtonProps &\n    Pick<LinkProps, 'href' | 'target' | 'rel'>\n> = styled(MuiIconButton)<\n  IconButtonProps & Pick<LinkProps, 'href' | 'target' | 'rel'>\n>(({ theme }) => {\n  return {\n    padding: theme.spacing(0.5),\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n    '&:hover': {\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n    },\n    fontSize: '1rem',\n  }\n})\n"],"mappings":";;AAIA,MAAa,iBAIT,OAAOA,UAAa,GAErB,EAAE,YAAY;CACf,OAAO;EACL,SAAS,MAAM,QAAQ,EAAG;EAC1B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;EAC9E,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;EACA,UAAU;CACZ;AACF,CAAC"}
+{"version":3,"file":"CardIconButton.js","names":["MuiIconButton"],"sources":["../../../../src/components/Card/CardIconButton.tsx"],"sourcesContent":["import type { IconButtonProps, LinkProps } from '@mui/material'\nimport { IconButton as MuiIconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const CardIconButton: React.FC<\n  React.ComponentProps<typeof MuiIconButton> &\n    IconButtonProps &\n    Pick<LinkProps, 'href' | 'target' | 'rel'>\n> = styled(MuiIconButton)<\n  IconButtonProps & Pick<LinkProps, 'href' | 'target' | 'rel'>\n>(({ theme }) => {\n  return {\n    padding: theme.spacing(0.5),\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n    '&:hover': {\n      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n    },\n    fontSize: '1rem',\n  }\n})\n"],"mappings":";;AAIA,MAAa,iBAIT,OAAOA,UAAa,CAAC,EAEtB,EAAE,YAAY;CACf,OAAO;EACL,SAAS,MAAM,QAAQ,EAAG;EAC1B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;EAC9E,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;EACA,UAAU;CACZ;AACF,CAAC"}

package/dist/esm/components/Card/CardLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardLabel.js","names":[],"sources":["../../../../src/components/Card/CardLabel.tsx"],"sourcesContent":["import { Box, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const CardLabel: React.FC<\n  React.ComponentProps<typeof Box> & {\n    variant?: 'secondary' | 'success' | 'warning'\n  }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: 'secondary' | 'success' | 'warning' }>(({ theme }) => ({\n  borderRadius: theme.vars.shape.borderRadius,\n  padding: 0,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  height: 24,\n  minWidth: 24,\n  userSelect: 'none',\n  fontSize: '1rem',\n  backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 88%, black)`,\n  color: theme.vars.palette.text.primary,\n  ...theme.applyStyles('dark', {\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 84%, white)`,\n  }),\n  variants: [\n    {\n      props: { variant: 'secondary' },\n      style: {\n        color: theme.palette.getContrastText(theme.palette.secondary.main),\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 20%, ${theme.vars.palette.secondary.main})`,\n        ...theme.applyStyles('dark', {\n          backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 20%, ${theme.vars.palette.secondary.main})`,\n        }),\n      },\n    },\n    {\n      props: { variant: 'success' },\n      style: {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 84%, ${theme.vars.palette.success.main})`,\n        color: theme.vars.palette.success.main,\n        ...theme.applyStyles('dark', {\n          backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 76%, ${theme.vars.palette.success.main})`,\n          color: `color-mix(in srgb, ${theme.vars.palette.success.main} 76%, white)`,\n        }),\n      },\n    },\n    {\n      props: { variant: 'warning' },\n      style: {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.warning.main} 32%, transparent)`,\n        color: `color-mix(in srgb, ${theme.vars.palette.warning.main} 64%, black)`,\n        ...theme.applyStyles('dark', {\n          backgroundColor: `color-mix(in srgb, ${theme.vars.palette.warning.main} 16%, transparent)`,\n          color: theme.vars.palette.warning.main,\n        }),\n      },\n    },\n  ],\n}))\n\nexport const CardLabelTypography: React.FC<\n  React.ComponentProps<typeof Typography> & { type?: 'icon' }\n> = styled(Typography, {\n  shouldForwardProp: (prop) => prop !== 'type',\n})<{ type?: 'icon' }>(({ theme }) => ({\n  padding: theme.spacing(0.75, 1.5),\n  fontSize: 12,\n  lineHeight: 1,\n  fontWeight: '600',\n  variants: [\n    {\n      props: {\n        type: 'icon',\n      },\n      style: {\n        padding: theme.spacing(0.75, 0, 0.75, 0.75),\n      },\n    },\n  ],\n}))\n"],"mappings":";;AAGA,MAAa,YAIT,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,UACxC,CAAC,GAAsD,EAAE,aAAa;CACpE,cAAc,MAAM,KAAK,MAAM;CAC/B,SAAS;CACT,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,QAAQ;CACR,UAAU;CACV,YAAY;CACZ,UAAU;CACV,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM;CAC3E,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,cAC7E,CAAC;CACD,UAAU;EACR;GACE,OAAO,EAAE,SAAS,YAAY;GAC9B,OAAO;IACL,OAAO,MAAM,QAAQ,gBAAgB,MAAM,QAAQ,UAAU,IAAI;IACjE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,UAAU,KAAK;IACrH,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,UAAU,KAAK,GACvH,CAAC;GACH;EACF;EACA;GACE,OAAO,EAAE,SAAS,UAAU;GAC5B,OAAO;IACL,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,QAAQ,KAAK;IACnH,OAAO,MAAM,KAAK,QAAQ,QAAQ;IAClC,GAAG,MAAM,YAAY,QAAQ;KAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACnH,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IAC/D,CAAC;GACH;EACF;EACA;GACE,OAAO,EAAE,SAAS,UAAU;GAC5B,OAAO;IACL,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IACvE,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IAC7D,GAAG,MAAM,YAAY,QAAQ;KAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACvE,OAAO,MAAM,KAAK,QAAQ,QAAQ;IACpC,CAAC;GACH;EACF;CACF;AACF,EAAE;AAEF,MAAa,sBAET,OAAO,YAAY,EACrB,oBAAoB,SAAS,SAAS,OACxC,CAAC,GAAsB,EAAE,aAAa;CACpC,SAAS,MAAM,QAAQ,KAAM,GAAG;CAChC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,UAAU,CACR;EACE,OAAO,EACL,MAAM,OACR;EACA,OAAO,EACL,SAAS,MAAM,QAAQ,KAAM,GAAG,KAAM,GAAI,EAC5C;CACF,CACF;AACF,EAAE"}
+{"version":3,"file":"CardLabel.js","names":[],"sources":["../../../../src/components/Card/CardLabel.tsx"],"sourcesContent":["import { Box, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const CardLabel: React.FC<\n  React.ComponentProps<typeof Box> & {\n    variant?: 'secondary' | 'success' | 'warning'\n  }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: 'secondary' | 'success' | 'warning' }>(({ theme }) => ({\n  borderRadius: theme.vars.shape.borderRadius,\n  padding: 0,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  height: 24,\n  minWidth: 24,\n  userSelect: 'none',\n  fontSize: '1rem',\n  backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 88%, black)`,\n  color: theme.vars.palette.text.primary,\n  ...theme.applyStyles('dark', {\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 84%, white)`,\n  }),\n  variants: [\n    {\n      props: { variant: 'secondary' },\n      style: {\n        color: theme.palette.getContrastText(theme.palette.secondary.main),\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 20%, ${theme.vars.palette.secondary.main})`,\n        ...theme.applyStyles('dark', {\n          backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 20%, ${theme.vars.palette.secondary.main})`,\n        }),\n      },\n    },\n    {\n      props: { variant: 'success' },\n      style: {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 84%, ${theme.vars.palette.success.main})`,\n        color: theme.vars.palette.success.main,\n        ...theme.applyStyles('dark', {\n          backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 76%, ${theme.vars.palette.success.main})`,\n          color: `color-mix(in srgb, ${theme.vars.palette.success.main} 76%, white)`,\n        }),\n      },\n    },\n    {\n      props: { variant: 'warning' },\n      style: {\n        backgroundColor: `color-mix(in srgb, ${theme.vars.palette.warning.main} 32%, transparent)`,\n        color: `color-mix(in srgb, ${theme.vars.palette.warning.main} 64%, black)`,\n        ...theme.applyStyles('dark', {\n          backgroundColor: `color-mix(in srgb, ${theme.vars.palette.warning.main} 16%, transparent)`,\n          color: theme.vars.palette.warning.main,\n        }),\n      },\n    },\n  ],\n}))\n\nexport const CardLabelTypography: React.FC<\n  React.ComponentProps<typeof Typography> & { type?: 'icon' }\n> = styled(Typography, {\n  shouldForwardProp: (prop) => prop !== 'type',\n})<{ type?: 'icon' }>(({ theme }) => ({\n  padding: theme.spacing(0.75, 1.5),\n  fontSize: 12,\n  lineHeight: 1,\n  fontWeight: '600',\n  variants: [\n    {\n      props: {\n        type: 'icon',\n      },\n      style: {\n        padding: theme.spacing(0.75, 0, 0.75, 0.75),\n      },\n    },\n  ],\n}))\n"],"mappings":";;AAGA,MAAa,YAIT,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,UACxC,CAAC,CAAC,EAAqD,EAAE,aAAa;CACpE,cAAc,MAAM,KAAK,MAAM;CAC/B,SAAS;CACT,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,QAAQ;CACR,UAAU;CACV,YAAY;CACZ,UAAU;CACV,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM;CAC3E,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,cAC7E,CAAC;CACD,UAAU;EACR;GACE,OAAO,EAAE,SAAS,YAAY;GAC9B,OAAO;IACL,OAAO,MAAM,QAAQ,gBAAgB,MAAM,QAAQ,UAAU,IAAI;IACjE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,UAAU,KAAK;IACrH,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,UAAU,KAAK,GACvH,CAAC;GACH;EACF;EACA;GACE,OAAO,EAAE,SAAS,UAAU;GAC5B,OAAO;IACL,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,QAAQ,KAAK;IACnH,OAAO,MAAM,KAAK,QAAQ,QAAQ;IAClC,GAAG,MAAM,YAAY,QAAQ;KAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,QAAQ,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACnH,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IAC/D,CAAC;GACH;EACF;EACA;GACE,OAAO,EAAE,SAAS,UAAU;GAC5B,OAAO;IACL,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IACvE,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IAC7D,GAAG,MAAM,YAAY,QAAQ;KAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACvE,OAAO,MAAM,KAAK,QAAQ,QAAQ;IACpC,CAAC;GACH;EACF;CACF;AACF,EAAE;AAEF,MAAa,sBAET,OAAO,YAAY,EACrB,oBAAoB,SAAS,SAAS,OACxC,CAAC,CAAC,EAAqB,EAAE,aAAa;CACpC,SAAS,MAAM,QAAQ,KAAM,GAAG;CAChC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,UAAU,CACR;EACE,OAAO,EACL,MAAM,OACR;EACA,OAAO,EACL,SAAS,MAAM,QAAQ,KAAM,GAAG,KAAM,GAAI,EAC5C;CACF,CACF;AACF,EAAE"}

package/dist/esm/components/Card/CardTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardTitle.js","names":[],"sources":["../../../../src/components/Card/CardTitle.tsx"],"sourcesContent":["import { styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const CardTitle: React.FC<\n  React.ComponentProps<typeof Typography> & { required?: boolean }\n> = styled(Typography, {\n  shouldForwardProp: (prop) => !['required'].includes(prop as string),\n})<{ required?: boolean }>(({ theme }) => ({\n  fontSize: 14,\n  lineHeight: 1,\n  fontWeight: 700,\n  padding: theme.spacing(2, 2, 0, 2),\n  textAlign: 'left',\n  color: theme.vars.palette.text.primary,\n  '&:after': {\n    content: 'none',\n    color: theme.vars.palette.error.main,\n  },\n  variants: [\n    {\n      props: ({ required }) => required,\n      style: {\n        '&:after': {\n          content: '\" *\"',\n        },\n      },\n    },\n  ],\n}))\n"],"mappings":";;AAGA,MAAa,YAET,OAAO,YAAY,EACrB,oBAAoB,SAAS,CAAC,CAAC,UAAU,EAAE,SAAS,IAAc,EACpE,CAAC,GAA2B,EAAE,aAAa;CACzC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,CAAC;CACjC,WAAW;CACX,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,WAAW;EACT,SAAS;EACT,OAAO,MAAM,KAAK,QAAQ,MAAM;CAClC;CACA,UAAU,CACR;EACE,QAAQ,EAAE,eAAe;EACzB,OAAO,EACL,WAAW,EACT,SAAS,SACX,EACF;CACF,CACF;AACF,EAAE"}
+{"version":3,"file":"CardTitle.js","names":[],"sources":["../../../../src/components/Card/CardTitle.tsx"],"sourcesContent":["import { styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const CardTitle: React.FC<\n  React.ComponentProps<typeof Typography> & { required?: boolean }\n> = styled(Typography, {\n  shouldForwardProp: (prop) => !['required'].includes(prop as string),\n})<{ required?: boolean }>(({ theme }) => ({\n  fontSize: 14,\n  lineHeight: 1,\n  fontWeight: 700,\n  padding: theme.spacing(2, 2, 0, 2),\n  textAlign: 'left',\n  color: theme.vars.palette.text.primary,\n  '&:after': {\n    content: 'none',\n    color: theme.vars.palette.error.main,\n  },\n  variants: [\n    {\n      props: ({ required }) => required,\n      style: {\n        '&:after': {\n          content: '\" *\"',\n        },\n      },\n    },\n  ],\n}))\n"],"mappings":";;AAGA,MAAa,YAET,OAAO,YAAY,EACrB,oBAAoB,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC,SAAS,IAAc,EACpE,CAAC,CAAC,EAA0B,EAAE,aAAa;CACzC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,CAAC;CACjC,WAAW;CACX,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,WAAW;EACT,SAAS;EACT,OAAO,MAAM,KAAK,QAAQ,MAAM;CAClC;CACA,UAAU,CACR;EACE,QAAQ,EAAE,eAAe;EACzB,OAAO,EACL,WAAW,EACT,SAAS,SACX,EACF;CACF,CACF;AACF,EAAE"}

package/dist/esm/components/Card/InputCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputCard.js","names":["Card"],"sources":["../../../../src/components/Card/InputCard.tsx"],"sourcesContent":["import { styled } from '@mui/material'\nimport type React from 'react'\nimport { Card } from './Card.js'\n\nexport const InputCard: React.FC<React.ComponentProps<typeof Card>> = styled(\n  Card,\n  {\n    name: 'MuiInputCard',\n    slot: 'root',\n  }\n)({})\n"],"mappings":";;;AAIA,MAAa,YAAyD,OACpEA,QACA;CACE,MAAM;CACN,MAAM;AACR,CACF,EAAE,CAAC,CAAC"}
+{"version":3,"file":"InputCard.js","names":["Card"],"sources":["../../../../src/components/Card/InputCard.tsx"],"sourcesContent":["import { styled } from '@mui/material'\nimport type React from 'react'\nimport { Card } from './Card.js'\n\nexport const InputCard: React.FC<React.ComponentProps<typeof Card>> = styled(\n  Card,\n  {\n    name: 'MuiInputCard',\n    slot: 'root',\n  }\n)({})\n"],"mappings":";;;AAIA,MAAa,YAAyD,OACpEA,QACA;CACE,MAAM;CACN,MAAM;AACR,CACF,CAAC,CAAC,CAAC,CAAC"}

package/dist/esm/components/ChainSelect/ChainSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/ChainSelect.tsx"],"sourcesContent":["import type { EVMChain } from '@lifi/sdk'\nimport { Skeleton, type Theme, Tooltip, useMediaQuery } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { type JSX, memo, useCallback, useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport {\n  maxChainsToOrder,\n  maxChainsToShow,\n  maxGridItemsToShow,\n} from '../../stores/chains/createChainOrderStore.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { AllChainsAvatar } from '../Chains/AllChainsAvatar.js'\nimport {\n  ChainAvatar,\n  ChainCard,\n  ChainContainer,\n  MoreChainsBox,\n  MoreChainsText,\n} from './ChainSelect.style.js'\nimport { useChainSelect } from './useChainSelect.js'\n\nexport const ChainSelect: React.NamedExoticComponent<FormTypeProps> = memo(\n  ({ formType }: FormTypeProps): JSX.Element => {\n    const { t } = useTranslation()\n    const navigate = useNavigate()\n    const isMobile = useMediaQuery((theme: Theme) =>\n      theme.breakpoints.down(theme.breakpoints.values.xs)\n    )\n    const { setFieldValue } = useFieldActions()\n    const {\n      chainOrder,\n      chains,\n      isLoading,\n      getSelectedChains,\n      setChainOrder,\n      setCurrentChain,\n    } = useChainSelect(formType)\n\n    const [showAllNetworks, isAllNetworks, setIsAllNetworks] =\n      useChainOrderStore((state) => [\n        state[`${formType}ShowAllNetworks`],\n        state[`${formType}IsAllNetworks`],\n        state.setIsAllNetworks,\n      ])\n\n    const [chainId] = useFieldValues(FormKeyHelper.getChainKey(formType))\n\n    useEffect(() => {\n      if (chainId) {\n        const hasChainInOrderedList = chainOrder.includes(chainId)\n        // If we don't have a chain in the ordered chain list we should add it.\n        if (!hasChainInOrderedList) {\n          setChainOrder(chainId, formType)\n        }\n      }\n    }, [chainId, chainOrder, formType, setChainOrder])\n\n    const onChainSelect = useCallback(\n      (selectedChainId: number) => {\n        setIsAllNetworks(false, formType)\n        setCurrentChain(selectedChainId)\n      },\n      [setIsAllNetworks, setCurrentChain, formType]\n    )\n\n    const showAllChains = useCallback(() => {\n      navigate({ to: navigationRoutes[`${formType}Chain`] })\n    }, [navigate, formType])\n\n    const selectAllNetworks = useCallback(() => {\n      setIsAllNetworks(true, formType)\n      // Reset the chain and token fields when selecting all networks\n      setFieldValue(FormKeyHelper.getChainKey(formType), '', {\n        isTouched: true,\n      })\n      setFieldValue(FormKeyHelper.getTokenKey(formType), '', {\n        isTouched: true,\n      })\n    }, [setIsAllNetworks, formType, setFieldValue])\n\n    const chainsToHide =\n      chains?.length === maxChainsToShow\n        ? 0\n        : (chains?.length ?? 0) - maxChainsToOrder\n\n    const chainsToShow = useMemo(\n      () => (chainsToHide > 0 ? getSelectedChains() : chains) ?? [],\n      [chainsToHide, getSelectedChains, chains]\n    )\n\n    const tilesCount =\n      chainsToShow.length +\n      (showAllNetworks ? 1 : 0) +\n      (chainsToHide > 0 ? 1 : 0)\n\n    if (isLoading) {\n      return (\n        <ChainContainer itemCount={tilesCount}>\n          {Array.from({ length: maxGridItemsToShow }).map((_, index) => (\n            <Skeleton\n              key={index}\n              variant=\"rectangular\"\n              width={56}\n              height={isMobile ? 36 : 56}\n              sx={{ borderRadius: 1 }}\n            />\n          ))}\n        </ChainContainer>\n      )\n    }\n\n    return (\n      <ChainContainer itemCount={tilesCount}>\n        {showAllNetworks && (\n          <Tooltip title={t('main.allNetworks')} enterNextDelay={100}>\n            <ChainCard\n              component=\"button\"\n              onClick={selectAllNetworks}\n              type={isAllNetworks ? 'selected' : 'default'}\n              selectionColor=\"secondary\"\n            >\n              <AllChainsAvatar\n                chains={chains ?? []}\n                size={isMobile ? 'small' : 'medium'}\n              />\n            </ChainCard>\n          </Tooltip>\n        )}\n        {chainsToShow.map((chain: EVMChain) => (\n          <ChainItem\n            key={chain.id}\n            chain={chain}\n            isSelected={chainId === chain.id}\n            isAllNetworks={isAllNetworks}\n            onSelect={onChainSelect}\n          />\n        ))}\n        {chainsToHide > 0 && (\n          <ChainCard component=\"button\" onClick={showAllChains}>\n            <MoreChainsBox>\n              <MoreChainsText>+{chainsToHide}</MoreChainsText>\n            </MoreChainsBox>\n          </ChainCard>\n        )}\n      </ChainContainer>\n    )\n  }\n)\n\nconst ChainItem = memo(\n  ({\n    chain,\n    isSelected,\n    isAllNetworks,\n    onSelect,\n  }: {\n    chain: EVMChain\n    isSelected: boolean\n    isAllNetworks: boolean\n    onSelect: (id: number) => void\n  }) => {\n    return (\n      <Tooltip title={chain.name} enterNextDelay={100}>\n        <ChainCard\n          component=\"button\"\n          onClick={() => onSelect(chain.id)}\n          type={!isAllNetworks && isSelected ? 'selected' : 'default'}\n          selectionColor=\"secondary\"\n        >\n          <ChainAvatar src={chain.logoURI} alt={chain.key}>\n            {chain.name[0]}\n          </ChainAvatar>\n        </ChainCard>\n      </Tooltip>\n    )\n  }\n)\n"],"mappings":";;;;;;;;;;;;;;AA2BA,MAAa,cAAyD,MACnE,EAAE,eAA2C;CAC5C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,WAAW,eAAe,UAC9B,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,CACpD;CACA,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EACJ,YACA,QACA,WACA,mBACA,eACA,oBACE,eAAe,QAAQ;CAE3B,MAAM,CAAC,iBAAiB,eAAe,oBACrC,oBAAoB,UAAU;EAC5B,MAAM,GAAG,SAAS;EAClB,MAAM,GAAG,SAAS;EAClB,MAAM;CACR,CAAC;CAEH,MAAM,CAAC,WAAW,eAAe,cAAc,YAAY,QAAQ,CAAC;CAEpE,gBAAgB;EACd,IAAI;OAGE,CAF0B,WAAW,SAAS,OAEzB,GACvB,cAAc,SAAS,QAAQ;EAAA;CAGrC,GAAG;EAAC;EAAS;EAAY;EAAU;CAAa,CAAC;CAEjD,MAAM,gBAAgB,aACnB,oBAA4B;EAC3B,iBAAiB,OAAO,QAAQ;EAChC,gBAAgB,eAAe;CACjC,GACA;EAAC;EAAkB;EAAiB;CAAQ,CAC9C;CAEA,MAAM,gBAAgB,kBAAkB;EACtC,SAAS,EAAE,IAAI,iBAAiB,GAAG,SAAS,QAAQ,CAAC;CACvD,GAAG,CAAC,UAAU,QAAQ,CAAC;CAEvB,MAAM,oBAAoB,kBAAkB;EAC1C,iBAAiB,MAAM,QAAQ;EAE/B,cAAc,cAAc,YAAY,QAAQ,GAAG,IAAI,EACrD,WAAW,KACb,CAAC;EACD,cAAc,cAAc,YAAY,QAAQ,GAAG,IAAI,EACrD,WAAW,KACb,CAAC;CACH,GAAG;EAAC;EAAkB;EAAU;CAAa,CAAC;CAE9C,MAAM,eACJ,QAAQ,WAAA,IACJ,KACC,QAAQ,UAAU,KAAA;CAEzB,MAAM,eAAe,eACZ,eAAe,IAAI,kBAAkB,IAAI,WAAW,CAAC,GAC5D;EAAC;EAAc;EAAmB;CAAM,CAC1C;CAEA,MAAM,aACJ,aAAa,UACZ,kBAAkB,IAAI,MACtB,eAAe,IAAI,IAAI;CAE1B,IAAI,WACF,OACE,oBAAC,gBAAD;EAAgB,WAAW;YACxB,MAAM,KAAK,EAAE,QAAA,GAA2B,CAAC,EAAE,KAAK,GAAG,UAClD,oBAAC,UAAD;GAEE,SAAQ;GACR,OAAO;GACP,QAAQ,WAAW,KAAK;GACxB,IAAI,EAAE,cAAc,EAAE;EACvB,GALM,KAKN,CACF;CACa,CAAA;CAIpB,OACE,qBAAC,gBAAD;EAAgB,WAAW;YAA3B;GACG,mBACC,oBAAC,SAAD;IAAS,OAAO,EAAE,kBAAkB;IAAG,gBAAgB;cACrD,oBAAC,WAAD;KACE,WAAU;KACV,SAAS;KACT,MAAM,gBAAgB,aAAa;KACnC,gBAAe;eAEf,oBAAC,iBAAD;MACE,QAAQ,UAAU,CAAC;MACnB,MAAM,WAAW,UAAU;KAC5B,CAAA;IACQ,CAAA;GACJ,CAAA;GAEV,aAAa,KAAK,UACjB,oBAAC,WAAD;IAES;IACP,YAAY,YAAY,MAAM;IACf;IACf,UAAU;GACX,GALM,MAAM,EAKZ,CACF;GACA,eAAe,KACd,oBAAC,WAAD;IAAW,WAAU;IAAS,SAAS;cACrC,oBAAC,eAAD,EAAA,UACE,qBAAC,gBAAD,EAAA,UAAA,CAAgB,KAAE,YAA6B,EAAA,CAAA,EAClC,CAAA;GACN,CAAA;EAEC;;AAEpB,CACF;AAEA,MAAM,YAAY,MACf,EACC,OACA,YACA,eACA,eAMI;CACJ,OACE,oBAAC,SAAD;EAAS,OAAO,MAAM;EAAM,gBAAgB;YAC1C,oBAAC,WAAD;GACE,WAAU;GACV,eAAe,SAAS,MAAM,EAAE;GAChC,MAAM,CAAC,iBAAiB,aAAa,aAAa;GAClD,gBAAe;aAEf,oBAAC,aAAD;IAAa,KAAK,MAAM;IAAS,KAAK,MAAM;cACzC,MAAM,KAAK;GACD,CAAA;EACJ,CAAA;CACJ,CAAA;AAEb,CACF"}
+{"version":3,"file":"ChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/ChainSelect.tsx"],"sourcesContent":["import type { EVMChain } from '@lifi/sdk'\nimport { Skeleton, type Theme, Tooltip, useMediaQuery } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { type JSX, memo, useCallback, useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport {\n  maxChainsToOrder,\n  maxChainsToShow,\n  maxGridItemsToShow,\n} from '../../stores/chains/createChainOrderStore.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { AllChainsAvatar } from '../Chains/AllChainsAvatar.js'\nimport {\n  ChainAvatar,\n  ChainCard,\n  ChainContainer,\n  MoreChainsBox,\n  MoreChainsText,\n} from './ChainSelect.style.js'\nimport { useChainSelect } from './useChainSelect.js'\n\nexport const ChainSelect: React.NamedExoticComponent<FormTypeProps> = memo(\n  ({ formType }: FormTypeProps): JSX.Element => {\n    const { t } = useTranslation()\n    const navigate = useNavigate()\n    const isMobile = useMediaQuery((theme: Theme) =>\n      theme.breakpoints.down(theme.breakpoints.values.xs)\n    )\n    const { setFieldValue } = useFieldActions()\n    const {\n      chainOrder,\n      chains,\n      isLoading,\n      getSelectedChains,\n      setChainOrder,\n      setCurrentChain,\n    } = useChainSelect(formType)\n\n    const [showAllNetworks, isAllNetworks, setIsAllNetworks] =\n      useChainOrderStore((state) => [\n        state[`${formType}ShowAllNetworks`],\n        state[`${formType}IsAllNetworks`],\n        state.setIsAllNetworks,\n      ])\n\n    const [chainId] = useFieldValues(FormKeyHelper.getChainKey(formType))\n\n    useEffect(() => {\n      if (chainId) {\n        const hasChainInOrderedList = chainOrder.includes(chainId)\n        // If we don't have a chain in the ordered chain list we should add it.\n        if (!hasChainInOrderedList) {\n          setChainOrder(chainId, formType)\n        }\n      }\n    }, [chainId, chainOrder, formType, setChainOrder])\n\n    const onChainSelect = useCallback(\n      (selectedChainId: number) => {\n        setIsAllNetworks(false, formType)\n        setCurrentChain(selectedChainId)\n      },\n      [setIsAllNetworks, setCurrentChain, formType]\n    )\n\n    const showAllChains = useCallback(() => {\n      navigate({ to: navigationRoutes[`${formType}Chain`] })\n    }, [navigate, formType])\n\n    const selectAllNetworks = useCallback(() => {\n      setIsAllNetworks(true, formType)\n      // Reset the chain and token fields when selecting all networks\n      setFieldValue(FormKeyHelper.getChainKey(formType), '', {\n        isTouched: true,\n      })\n      setFieldValue(FormKeyHelper.getTokenKey(formType), '', {\n        isTouched: true,\n      })\n    }, [setIsAllNetworks, formType, setFieldValue])\n\n    const chainsToHide =\n      chains?.length === maxChainsToShow\n        ? 0\n        : (chains?.length ?? 0) - maxChainsToOrder\n\n    const chainsToShow = useMemo(\n      () => (chainsToHide > 0 ? getSelectedChains() : chains) ?? [],\n      [chainsToHide, getSelectedChains, chains]\n    )\n\n    const tilesCount =\n      chainsToShow.length +\n      (showAllNetworks ? 1 : 0) +\n      (chainsToHide > 0 ? 1 : 0)\n\n    if (isLoading) {\n      return (\n        <ChainContainer itemCount={tilesCount}>\n          {Array.from({ length: maxGridItemsToShow }).map((_, index) => (\n            <Skeleton\n              key={index}\n              variant=\"rectangular\"\n              width={56}\n              height={isMobile ? 36 : 56}\n              sx={{ borderRadius: 1 }}\n            />\n          ))}\n        </ChainContainer>\n      )\n    }\n\n    return (\n      <ChainContainer itemCount={tilesCount}>\n        {showAllNetworks && (\n          <Tooltip title={t('main.allNetworks')} enterNextDelay={100}>\n            <ChainCard\n              component=\"button\"\n              onClick={selectAllNetworks}\n              type={isAllNetworks ? 'selected' : 'default'}\n              selectionColor=\"secondary\"\n            >\n              <AllChainsAvatar\n                chains={chains ?? []}\n                size={isMobile ? 'small' : 'medium'}\n              />\n            </ChainCard>\n          </Tooltip>\n        )}\n        {chainsToShow.map((chain: EVMChain) => (\n          <ChainItem\n            key={chain.id}\n            chain={chain}\n            isSelected={chainId === chain.id}\n            isAllNetworks={isAllNetworks}\n            onSelect={onChainSelect}\n          />\n        ))}\n        {chainsToHide > 0 && (\n          <ChainCard component=\"button\" onClick={showAllChains}>\n            <MoreChainsBox>\n              <MoreChainsText>+{chainsToHide}</MoreChainsText>\n            </MoreChainsBox>\n          </ChainCard>\n        )}\n      </ChainContainer>\n    )\n  }\n)\n\nconst ChainItem = memo(\n  ({\n    chain,\n    isSelected,\n    isAllNetworks,\n    onSelect,\n  }: {\n    chain: EVMChain\n    isSelected: boolean\n    isAllNetworks: boolean\n    onSelect: (id: number) => void\n  }) => {\n    return (\n      <Tooltip title={chain.name} enterNextDelay={100}>\n        <ChainCard\n          component=\"button\"\n          onClick={() => onSelect(chain.id)}\n          type={!isAllNetworks && isSelected ? 'selected' : 'default'}\n          selectionColor=\"secondary\"\n        >\n          <ChainAvatar src={chain.logoURI} alt={chain.key}>\n            {chain.name[0]}\n          </ChainAvatar>\n        </ChainCard>\n      </Tooltip>\n    )\n  }\n)\n"],"mappings":"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"}

package/dist/esm/components/ChainSelect/ChainSelect.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainSelect.style.js","names":["styled","Card"],"sources":["../../../../src/components/ChainSelect/ChainSelect.style.tsx"],"sourcesContent":["import { Avatar, Box, Typography } from '@mui/material'\nimport { styled } from '@mui/material/styles'\nimport type React from 'react'\nimport { Card } from '../../components/Card/Card.js'\nimport { maxChainsToShow } from '../../stores/chains/createChainOrderStore.js'\n\nconst chainCardWidthPx = 52\nconst chainCardHeightPx = 56\n// For mobile screens (xs, under 360px)\nconst chainCardWidthPxMobile = 36\nconst chainCardHeightPxMobile = 36\n\n// Chain grid layout settings:\n// These should remain consistent with `maxChainsToShow` to ensure\n// proper row/column distribution in the grid layout logic.\nconst maxRows = 2\nconst maxChainsPerRow = Math.ceil(maxChainsToShow / maxRows)\n\nexport const ChainCard: React.FC<\n  React.ComponentProps<typeof Card> & { itemCount?: number }\n> = styled(Card)(({ theme }) => ({\n  display: 'grid',\n  placeItems: 'center',\n  minWidth: chainCardWidthPx,\n  height: chainCardHeightPx,\n  [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n    height: chainCardHeightPxMobile,\n    minWidth: chainCardWidthPxMobile,\n  },\n}))\n\nexport const ChainAvatar: React.FC<\n  React.ComponentProps<typeof Avatar> & { itemCount?: number }\n> = styled(Avatar)(({ theme }) => ({\n  width: 40,\n  height: 40,\n  [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n    width: 28,\n    height: 28,\n  },\n}))\n\nexport const MoreChainsBox: React.FC<\n  React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box)(({ theme }) => ({\n  width: 40,\n  height: 40,\n  display: 'grid',\n  placeItems: 'center',\n  [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n    width: 28,\n    height: 28,\n  },\n}))\n\nexport const MoreChainsText: React.FC<\n  React.ComponentProps<typeof Typography> & { itemCount?: number }\n> = styled(Typography)(({ theme }) => ({\n  fontWeight: 500,\n  [theme.breakpoints.down('xs')]: {\n    fontSize: '.85rem',\n  },\n}))\n\nexport const ChainContainer: React.FC<\n  React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'itemCount',\n})<{ itemCount?: number }>(({ theme, itemCount = 0 }) => {\n  const rowCount = Math.min(Math.ceil(itemCount / maxChainsPerRow), maxRows)\n  const columnsPerRow = Math.ceil(itemCount / rowCount)\n  return {\n    display: 'grid',\n    gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPx}px, 1fr))`,\n    gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPx}px)`,\n    justifyContent: 'space-between',\n    gap: theme.spacing(1.5),\n    [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n      gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPxMobile}px, 1fr))`,\n      gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPxMobile}px)`,\n      gap: theme.spacing(1),\n    },\n  }\n})\n"],"mappings":";;;;AAMA,MAAM,mBAAmB;AACzB,MAAM,oBAAoB;AAE1B,MAAM,yBAAyB;AAC/B,MAAM,0BAA0B;AAKhC,MAAM,UAAU;AAChB,MAAM,kBAAkB,KAAK,KAAA,IAAuB,OAAO;AAE3D,MAAa,YAETA,SAAOC,MAAI,GAAG,EAAE,aAAa;CAC/B,SAAS;CACT,YAAY;CACZ,UAAU;CACV,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;EACrD,QAAQ;EACR,UAAU;CACZ;AACF,EAAE;AAEF,MAAa,cAETD,SAAO,MAAM,GAAG,EAAE,aAAa;CACjC,OAAO;CACP,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;EACrD,OAAO;EACP,QAAQ;CACV;AACF,EAAE;AAEF,MAAa,gBAETA,SAAO,GAAG,GAAG,EAAE,aAAa;CAC9B,OAAO;CACP,QAAQ;CACR,SAAS;CACT,YAAY;EACX,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;EACrD,OAAO;EACP,QAAQ;CACV;AACF,EAAE;AAEF,MAAa,iBAETA,SAAO,UAAU,GAAG,EAAE,aAAa;CACrC,YAAY;EACX,MAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,UAAU,SACZ;AACF,EAAE;AAEF,MAAa,iBAETA,SAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,YACxC,CAAC,GAA2B,EAAE,OAAO,YAAY,QAAQ;CACvD,MAAM,WAAW,KAAK,IAAI,KAAK,KAAK,YAAY,eAAe,GAAG,OAAO;CACzE,MAAM,gBAAgB,KAAK,KAAK,YAAY,QAAQ;CACpD,OAAO;EACL,SAAS;EACT,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,iBAAiB;EACrG,kBAAkB,UAAU,SAAS,IAAI,kBAAkB;EAC3D,gBAAgB;EAChB,KAAK,MAAM,QAAQ,GAAG;GACrB,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;GACrD,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,uBAAuB;GAC3G,kBAAkB,UAAU,SAAS,IAAI,wBAAwB;GACjE,KAAK,MAAM,QAAQ,CAAC;EACtB;CACF;AACF,CAAC"}
+{"version":3,"file":"ChainSelect.style.js","names":["styled","Card"],"sources":["../../../../src/components/ChainSelect/ChainSelect.style.tsx"],"sourcesContent":["import { Avatar, Box, Typography } from '@mui/material'\nimport { styled } from '@mui/material/styles'\nimport type React from 'react'\nimport { Card } from '../../components/Card/Card.js'\nimport { maxChainsToShow } from '../../stores/chains/createChainOrderStore.js'\n\nconst chainCardWidthPx = 52\nconst chainCardHeightPx = 56\n// For mobile screens (xs, under 360px)\nconst chainCardWidthPxMobile = 36\nconst chainCardHeightPxMobile = 36\n\n// Chain grid layout settings:\n// These should remain consistent with `maxChainsToShow` to ensure\n// proper row/column distribution in the grid layout logic.\nconst maxRows = 2\nconst maxChainsPerRow = Math.ceil(maxChainsToShow / maxRows)\n\nexport const ChainCard: React.FC<\n  React.ComponentProps<typeof Card> & { itemCount?: number }\n> = styled(Card)(({ theme }) => ({\n  display: 'grid',\n  placeItems: 'center',\n  minWidth: chainCardWidthPx,\n  height: chainCardHeightPx,\n  [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n    height: chainCardHeightPxMobile,\n    minWidth: chainCardWidthPxMobile,\n  },\n}))\n\nexport const ChainAvatar: React.FC<\n  React.ComponentProps<typeof Avatar> & { itemCount?: number }\n> = styled(Avatar)(({ theme }) => ({\n  width: 40,\n  height: 40,\n  [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n    width: 28,\n    height: 28,\n  },\n}))\n\nexport const MoreChainsBox: React.FC<\n  React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box)(({ theme }) => ({\n  width: 40,\n  height: 40,\n  display: 'grid',\n  placeItems: 'center',\n  [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n    width: 28,\n    height: 28,\n  },\n}))\n\nexport const MoreChainsText: React.FC<\n  React.ComponentProps<typeof Typography> & { itemCount?: number }\n> = styled(Typography)(({ theme }) => ({\n  fontWeight: 500,\n  [theme.breakpoints.down('xs')]: {\n    fontSize: '.85rem',\n  },\n}))\n\nexport const ChainContainer: React.FC<\n  React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'itemCount',\n})<{ itemCount?: number }>(({ theme, itemCount = 0 }) => {\n  const rowCount = Math.min(Math.ceil(itemCount / maxChainsPerRow), maxRows)\n  const columnsPerRow = Math.ceil(itemCount / rowCount)\n  return {\n    display: 'grid',\n    gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPx}px, 1fr))`,\n    gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPx}px)`,\n    justifyContent: 'space-between',\n    gap: theme.spacing(1.5),\n    [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n      gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPxMobile}px, 1fr))`,\n      gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPxMobile}px)`,\n      gap: theme.spacing(1),\n    },\n  }\n})\n"],"mappings":";;;;AAMA,MAAM,mBAAmB;AACzB,MAAM,oBAAoB;AAE1B,MAAM,yBAAyB;AAC/B,MAAM,0BAA0B;AAKhC,MAAM,UAAU;AAChB,MAAM,kBAAkB,KAAK,KAAA,IAAuB,OAAO;AAE3D,MAAa,YAETA,SAAOC,MAAI,CAAC,EAAE,EAAE,aAAa;CAC/B,SAAS;CACT,YAAY;CACZ,UAAU;CACV,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;EACrD,QAAQ;EACR,UAAU;CACZ;AACF,EAAE;AAEF,MAAa,cAETD,SAAO,MAAM,CAAC,EAAE,EAAE,aAAa;CACjC,OAAO;CACP,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;EACrD,OAAO;EACP,QAAQ;CACV;AACF,EAAE;AAEF,MAAa,gBAETA,SAAO,GAAG,CAAC,EAAE,EAAE,aAAa;CAC9B,OAAO;CACP,QAAQ;CACR,SAAS;CACT,YAAY;EACX,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;EACrD,OAAO;EACP,QAAQ;CACV;AACF,EAAE;AAEF,MAAa,iBAETA,SAAO,UAAU,CAAC,EAAE,EAAE,aAAa;CACrC,YAAY;EACX,MAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,UAAU,SACZ;AACF,EAAE;AAEF,MAAa,iBAETA,SAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,YACxC,CAAC,CAAC,EAA0B,EAAE,OAAO,YAAY,QAAQ;CACvD,MAAM,WAAW,KAAK,IAAI,KAAK,KAAK,YAAY,eAAe,GAAG,OAAO;CACzE,MAAM,gBAAgB,KAAK,KAAK,YAAY,QAAQ;CACpD,OAAO;EACL,SAAS;EACT,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,iBAAiB;EACrG,kBAAkB,UAAU,SAAS,IAAI,kBAAkB;EAC3D,gBAAgB;EAChB,KAAK,MAAM,QAAQ,GAAG;GACrB,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,IAAI;GACrD,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,uBAAuB;GAC3G,kBAAkB,UAAU,SAAS,IAAI,wBAAwB;GACjE,KAAK,MAAM,QAAQ,CAAC;EACtB;CACF;AACF,CAAC"}

package/dist/esm/components/ChainSelect/useChainSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/useChainSelect.ts"],"sourcesContent":["import type { EVMChain, ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useChains } from '../../hooks/useChains.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useToAddressReset } from '../../hooks/useToAddressReset.js'\nimport { useExternalWalletProvider } from '../../providers/WalletProvider/useExternalWalletProvider.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrder } from '../../stores/chains/useChainOrder.js'\nimport type { FormType } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { DisabledUIConfig } from '../../types/widget.js'\n\nexport const useChainSelect = (\n  formType: FormType\n): {\n  chainOrder: number[]\n  chains: ExtendedChain[] | undefined\n  getSelectedChains: () => EVMChain[]\n  isLoading: boolean\n  setChainOrder: (chainId: number, type: FormType) => void\n  setCurrentChain: (chainId: number) => void\n} => {\n  const { disabledUI } = useWidgetConfig()\n  const chainKey = FormKeyHelper.getChainKey(formType)\n  const { setFieldValue, getFieldValues } = useFieldActions()\n  const { useExternalWalletProvidersOnly, externalChainTypes } =\n    useExternalWalletProvider()\n  const { chains, isLoading, getChainById } = useChains(\n    formType,\n    // If the integrator uses external wallet management and has not opted in for partial wallet management,\n    // restrict the displayed chains to those compatible with external wallet management.\n    // This ensures users only see chains for which they can sign transactions.\n    formType === 'from' && useExternalWalletProvidersOnly\n      ? externalChainTypes\n      : undefined\n  )\n\n  const [chainOrder, setChainOrder] = useChainOrder(formType)\n  const swapOnly = useSwapOnly()\n  const { tryResetToAddress } = useToAddressReset()\n\n  const getSelectedChains = useCallback((): EVMChain[] => {\n    if (!chains) {\n      return []\n    }\n    const selectedChains = chainOrder\n      .map((chainId) => chains.find((chain) => chain.id === chainId))\n      .filter(Boolean) as EVMChain[]\n    return selectedChains\n  }, [chains, chainOrder])\n\n  const setCurrentChain = useCallback(\n    (chainId: number): void => {\n      setFieldValue(chainKey, chainId, { isDirty: true, isTouched: true })\n      if (swapOnly) {\n        setFieldValue(FormKeyHelper.getChainKey('to'), chainId, {\n          isTouched: true,\n        })\n      }\n      const tokenKey = FormKeyHelper.getTokenKey(formType)\n      if (!disabledUI?.[tokenKey as keyof DisabledUIConfig]) {\n        setFieldValue(tokenKey, '')\n      }\n      const amountKey = FormKeyHelper.getAmountKey(formType)\n      if (!disabledUI?.[amountKey as keyof DisabledUIConfig]) {\n        setFieldValue(amountKey, '')\n      }\n\n      const [toChainId] = getFieldValues('toChain')\n      const toChain = getChainById(toChainId)\n      if (toChain) {\n        tryResetToAddress(toChain)\n      }\n      setChainOrder(chainId, formType)\n    },\n    [\n      chainKey,\n      swapOnly,\n      setFieldValue,\n      disabledUI,\n      formType,\n      getChainById,\n      tryResetToAddress,\n      setChainOrder,\n      getFieldValues,\n    ]\n  )\n\n  return {\n    chainOrder: chainOrder,\n    chains: chains,\n    getSelectedChains: getSelectedChains,\n    isLoading: isLoading,\n    setChainOrder: setChainOrder,\n    setCurrentChain: setCurrentChain,\n  }\n}\n"],"mappings":";;;;;;;;;;AAaA,MAAa,kBACX,aAQG;CACH,MAAM,EAAE,eAAe,gBAAgB;CACvC,MAAM,WAAW,cAAc,YAAY,QAAQ;CACnD,MAAM,EAAE,eAAe,mBAAmB,gBAAgB;CAC1D,MAAM,EAAE,gCAAgC,uBACtC,0BAA0B;CAC5B,MAAM,EAAE,QAAQ,WAAW,iBAAiB,UAC1C,UAIA,aAAa,UAAU,iCACnB,qBACA,KAAA,CACN;CAEA,MAAM,CAAC,YAAY,iBAAiB,cAAc,QAAQ;CAC1D,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,sBAAsB,kBAAkB;CAiDhD,OAAO;EACO;EACJ;EACR,mBAlDwB,kBAA8B;GACtD,IAAI,CAAC,QACH,OAAO,CAAC;GAKV,OAHuB,WACpB,KAAK,YAAY,OAAO,MAAM,UAAU,MAAM,OAAO,OAAO,CAAC,EAC7D,OAAO,OACU;EACtB,GAAG,CAAC,QAAQ,UAAU,CA0Ce;EACxB;EACI;EACf,iBA3CsB,aACrB,YAA0B;GACzB,cAAc,UAAU,SAAS;IAAE,SAAS;IAAM,WAAW;GAAK,CAAC;GACnE,IAAI,UACF,cAAc,cAAc,YAAY,IAAI,GAAG,SAAS,EACtD,WAAW,KACb,CAAC;GAEH,MAAM,WAAW,cAAc,YAAY,QAAQ;GACnD,IAAI,CAAC,aAAa,WAChB,cAAc,UAAU,EAAE;GAE5B,MAAM,YAAY,cAAc,aAAa,QAAQ;GACrD,IAAI,CAAC,aAAa,YAChB,cAAc,WAAW,EAAE;GAG7B,MAAM,CAAC,aAAa,eAAe,SAAS;GAC5C,MAAM,UAAU,aAAa,SAAS;GACtC,IAAI,SACF,kBAAkB,OAAO;GAE3B,cAAc,SAAS,QAAQ;EACjC,GACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAS+B;CACjC;AACF"}
+{"version":3,"file":"useChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/useChainSelect.ts"],"sourcesContent":["import type { EVMChain, ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useChains } from '../../hooks/useChains.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useToAddressReset } from '../../hooks/useToAddressReset.js'\nimport { useExternalWalletProvider } from '../../providers/WalletProvider/useExternalWalletProvider.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrder } from '../../stores/chains/useChainOrder.js'\nimport type { FormType } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { DisabledUIConfig } from '../../types/widget.js'\n\nexport const useChainSelect = (\n  formType: FormType\n): {\n  chainOrder: number[]\n  chains: ExtendedChain[] | undefined\n  getSelectedChains: () => EVMChain[]\n  isLoading: boolean\n  setChainOrder: (chainId: number, type: FormType) => void\n  setCurrentChain: (chainId: number) => void\n} => {\n  const { disabledUI } = useWidgetConfig()\n  const chainKey = FormKeyHelper.getChainKey(formType)\n  const { setFieldValue, getFieldValues } = useFieldActions()\n  const { useExternalWalletProvidersOnly, externalChainTypes } =\n    useExternalWalletProvider()\n  const { chains, isLoading, getChainById } = useChains(\n    formType,\n    // If the integrator uses external wallet management and has not opted in for partial wallet management,\n    // restrict the displayed chains to those compatible with external wallet management.\n    // This ensures users only see chains for which they can sign transactions.\n    formType === 'from' && useExternalWalletProvidersOnly\n      ? externalChainTypes\n      : undefined\n  )\n\n  const [chainOrder, setChainOrder] = useChainOrder(formType)\n  const swapOnly = useSwapOnly()\n  const { tryResetToAddress } = useToAddressReset()\n\n  const getSelectedChains = useCallback((): EVMChain[] => {\n    if (!chains) {\n      return []\n    }\n    const selectedChains = chainOrder\n      .map((chainId) => chains.find((chain) => chain.id === chainId))\n      .filter(Boolean) as EVMChain[]\n    return selectedChains\n  }, [chains, chainOrder])\n\n  const setCurrentChain = useCallback(\n    (chainId: number): void => {\n      setFieldValue(chainKey, chainId, { isDirty: true, isTouched: true })\n      if (swapOnly) {\n        setFieldValue(FormKeyHelper.getChainKey('to'), chainId, {\n          isTouched: true,\n        })\n      }\n      const tokenKey = FormKeyHelper.getTokenKey(formType)\n      if (!disabledUI?.[tokenKey as keyof DisabledUIConfig]) {\n        setFieldValue(tokenKey, '')\n      }\n      const amountKey = FormKeyHelper.getAmountKey(formType)\n      if (!disabledUI?.[amountKey as keyof DisabledUIConfig]) {\n        setFieldValue(amountKey, '')\n      }\n\n      const [toChainId] = getFieldValues('toChain')\n      const toChain = getChainById(toChainId)\n      if (toChain) {\n        tryResetToAddress(toChain)\n      }\n      setChainOrder(chainId, formType)\n    },\n    [\n      chainKey,\n      swapOnly,\n      setFieldValue,\n      disabledUI,\n      formType,\n      getChainById,\n      tryResetToAddress,\n      setChainOrder,\n      getFieldValues,\n    ]\n  )\n\n  return {\n    chainOrder: chainOrder,\n    chains: chains,\n    getSelectedChains: getSelectedChains,\n    isLoading: isLoading,\n    setChainOrder: setChainOrder,\n    setCurrentChain: setCurrentChain,\n  }\n}\n"],"mappings":";;;;;;;;;;AAaA,MAAa,kBACX,aAQG;CACH,MAAM,EAAE,eAAe,gBAAgB;CACvC,MAAM,WAAW,cAAc,YAAY,QAAQ;CACnD,MAAM,EAAE,eAAe,mBAAmB,gBAAgB;CAC1D,MAAM,EAAE,gCAAgC,uBACtC,0BAA0B;CAC5B,MAAM,EAAE,QAAQ,WAAW,iBAAiB,UAC1C,UAIA,aAAa,UAAU,iCACnB,qBACA,KAAA,CACN;CAEA,MAAM,CAAC,YAAY,iBAAiB,cAAc,QAAQ;CAC1D,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,sBAAsB,kBAAkB;CAiDhD,OAAO;EACO;EACJ;EACR,mBAlDwB,kBAA8B;GACtD,IAAI,CAAC,QACH,OAAO,CAAC;GAKV,OAHuB,WACpB,KAAK,YAAY,OAAO,MAAM,UAAU,MAAM,OAAO,OAAO,CAAC,CAAC,CAC9D,OAAO,OACU;EACtB,GAAG,CAAC,QAAQ,UAAU,CA0Ce;EACxB;EACI;EACf,iBA3CsB,aACrB,YAA0B;GACzB,cAAc,UAAU,SAAS;IAAE,SAAS;IAAM,WAAW;GAAK,CAAC;GACnE,IAAI,UACF,cAAc,cAAc,YAAY,IAAI,GAAG,SAAS,EACtD,WAAW,KACb,CAAC;GAEH,MAAM,WAAW,cAAc,YAAY,QAAQ;GACnD,IAAI,CAAC,aAAa,WAChB,cAAc,UAAU,EAAE;GAE5B,MAAM,YAAY,cAAc,aAAa,QAAQ;GACrD,IAAI,CAAC,aAAa,YAChB,cAAc,WAAW,EAAE;GAG7B,MAAM,CAAC,aAAa,eAAe,SAAS;GAC5C,MAAM,UAAU,aAAa,SAAS;GACtC,IAAI,SACF,kBAAkB,OAAO;GAE3B,cAAc,SAAS,QAAQ;EACjC,GACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAS+B;CACjC;AACF"}

package/dist/esm/components/Chains/AllChainsAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"AllChainsAvatar.js","names":[],"sources":["../../../../src/components/Chains/AllChainsAvatar.tsx"],"sourcesContent":["import {\n  ChainId,\n  ChainType,\n  type EVMChain,\n  type ExtendedChain,\n} from '@lifi/sdk'\nimport { Avatar, Box } from '@mui/material'\nimport type React from 'react'\nimport { type JSX, memo, useMemo } from 'react'\n\ninterface AllChainsAvatarProps {\n  chains: ExtendedChain[] | EVMChain[]\n  size: 'small' | 'medium'\n}\n\nconst chainTypeIcons = [\n  {\n    name: 'Ethereum',\n    chainType: ChainType.EVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/ethereum.svg',\n    defaultChainId: ChainId.ETH,\n  },\n  {\n    name: 'Solana',\n    chainType: ChainType.SVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/solana.svg',\n    defaultChainId: ChainId.SOL,\n  },\n  {\n    name: 'Bitcoin',\n    chainType: ChainType.UTXO,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/bitcoin.svg',\n    defaultChainId: ChainId.BTC,\n  },\n  {\n    name: 'Sui',\n    chainType: ChainType.MVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/sui.svg',\n    defaultChainId: ChainId.SUI,\n  },\n  {\n    name: 'Tron',\n    chainType: ChainType.TVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/tron.svg',\n    defaultChainId: ChainId.TRN,\n  },\n]\n\nconst maxChainAvatarsCount = 4\n\nexport const AllChainsAvatar: React.NamedExoticComponent<AllChainsAvatarProps> =\n  memo(({ chains, size }: AllChainsAvatarProps): JSX.Element => {\n    const icons = useMemo(() => {\n      // Create maps for efficient lookups\n      const chainsPerChainType = new Map<ChainType, number>()\n      const chainsByChainType = new Map<\n        ChainType,\n        (ExtendedChain | EVMChain)[]\n      >()\n\n      chains.forEach((chain) => {\n        chainsPerChainType.set(\n          chain.chainType,\n          (chainsPerChainType.get(chain.chainType) || 0) + 1\n        )\n        const chainsOfType = chainsByChainType.get(chain.chainType) || []\n        chainsOfType.push(chain)\n        chainsByChainType.set(chain.chainType, chainsOfType)\n      })\n\n      // Get existing ecosystem icons\n      const existingChainTypeIcons = chainTypeIcons.filter(\n        (predefinedChain) => {\n          const numberOfChains =\n            chainsPerChainType.get(predefinedChain.chainType) ?? 0\n\n          // If there's only one chain of this type, check if it's not the default\n          if (numberOfChains === 1) {\n            const chainsOfType = chainsByChainType.get(\n              predefinedChain.chainType\n            )\n            const singleChain = chainsOfType?.[0]\n            // Exclude the predefined icon if the single chain is not the default\n            if (\n              singleChain &&\n              singleChain.id !== predefinedChain.defaultChainId\n            ) {\n              return false\n            }\n          }\n\n          return numberOfChains > 0\n        }\n      )\n\n      if (existingChainTypeIcons.length === maxChainAvatarsCount) {\n        return existingChainTypeIcons\n      }\n\n      const remainingSlots =\n        maxChainAvatarsCount - existingChainTypeIcons.length\n\n      // Create a Set for O(1) lookup of predefined icon names\n      const predefinedIconNames = new Set(\n        existingChainTypeIcons.map((icon) => icon.name)\n      )\n\n      const chainsWithLogos = chains.filter((chain) => {\n        // Filter out chain icons matching ecosystem icons\n        return !predefinedIconNames.has(chain.name) && Boolean(chain.logoURI)\n      })\n\n      const additionalIcons = chainsWithLogos\n        .slice(0, remainingSlots)\n        .map((chain) => ({\n          name: chain.name,\n          chainType: chain.chainType,\n          icon: chain.logoURI!,\n        }))\n\n      return [...existingChainTypeIcons, ...additionalIcons]\n    }, [chains])\n\n    const wrapperSize = size === 'small' ? '32px' : '40px'\n    const avatarSize = size === 'small' ? '12px' : '16px'\n    const avatarsCount = Math.min(icons.length, maxChainAvatarsCount)\n    const gridRows = avatarsCount > 2 ? 2 : 1\n    const gridColumns = avatarsCount > 1 ? 2 : 1\n\n    return (\n      <Box\n        sx={{\n          width: wrapperSize,\n          height: wrapperSize,\n          display: 'grid',\n          gridTemplateRows: `repeat(${gridRows}, 1fr)`,\n          gridTemplateColumns: `repeat(${gridColumns}, 1fr)`,\n          placeItems: 'center',\n        }}\n      >\n        {icons.slice(0, avatarsCount).map((chain, idx) => {\n          const isThirdAvatarInThreeAvatarLayout =\n            avatarsCount === 3 && idx === 2\n\n          return (\n            <Avatar\n              key={`${chain.chainType}-${idx}`}\n              src={chain.icon}\n              alt={chain.name}\n              sx={{\n                width: avatarSize,\n                height: avatarSize,\n                margin: 'auto',\n                ...(isThirdAvatarInThreeAvatarLayout && {\n                  gridColumn: '1 / span 2',\n                  gridRow: '2',\n                  justifySelf: 'center',\n                }),\n              }}\n            >\n              {chain.chainType[0]}\n            </Avatar>\n          )\n        })}\n      </Box>\n    )\n  })\n"],"mappings":";;;;;AAeA,MAAM,iBAAiB;CACrB;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;AACF;AAEA,MAAM,uBAAuB;AAE7B,MAAa,kBACX,MAAM,EAAE,QAAQ,WAA8C;CAC5D,MAAM,QAAQ,cAAc;EAE1B,MAAM,qCAAqB,IAAI,IAAuB;EACtD,MAAM,oCAAoB,IAAI,IAG5B;EAEF,OAAO,SAAS,UAAU;GACxB,mBAAmB,IACjB,MAAM,YACL,mBAAmB,IAAI,MAAM,SAAS,KAAK,KAAK,CACnD;GACA,MAAM,eAAe,kBAAkB,IAAI,MAAM,SAAS,KAAK,CAAC;GAChE,aAAa,KAAK,KAAK;GACvB,kBAAkB,IAAI,MAAM,WAAW,YAAY;EACrD,CAAC;EAGD,MAAM,yBAAyB,eAAe,QAC3C,oBAAoB;GACnB,MAAM,iBACJ,mBAAmB,IAAI,gBAAgB,SAAS,KAAK;GAGvD,IAAI,mBAAmB,GAAG;IAIxB,MAAM,cAHe,kBAAkB,IACrC,gBAAgB,SAEa,IAAI;IAEnC,IACE,eACA,YAAY,OAAO,gBAAgB,gBAEnC,OAAO;GAEX;GAEA,OAAO,iBAAiB;EAC1B,CACF;EAEA,IAAI,uBAAuB,WAAW,sBACpC,OAAO;EAGT,MAAM,iBACJ,uBAAuB,uBAAuB;EAGhD,MAAM,sBAAsB,IAAI,IAC9B,uBAAuB,KAAK,SAAS,KAAK,IAAI,CAChD;EAOA,MAAM,kBALkB,OAAO,QAAQ,UAAU;GAE/C,OAAO,CAAC,oBAAoB,IAAI,MAAM,IAAI,KAAK,QAAQ,MAAM,OAAO;EACtE,CAEsC,EACnC,MAAM,GAAG,cAAc,EACvB,KAAK,WAAW;GACf,MAAM,MAAM;GACZ,WAAW,MAAM;GACjB,MAAM,MAAM;EACd,EAAE;EAEJ,OAAO,CAAC,GAAG,wBAAwB,GAAG,eAAe;CACvD,GAAG,CAAC,MAAM,CAAC;CAEX,MAAM,cAAc,SAAS,UAAU,SAAS;CAChD,MAAM,aAAa,SAAS,UAAU,SAAS;CAC/C,MAAM,eAAe,KAAK,IAAI,MAAM,QAAQ,oBAAoB;CAChE,MAAM,WAAW,eAAe,IAAI,IAAI;CACxC,MAAM,cAAc,eAAe,IAAI,IAAI;CAE3C,OACE,oBAAC,KAAD;EACE,IAAI;GACF,OAAO;GACP,QAAQ;GACR,SAAS;GACT,kBAAkB,UAAU,SAAS;GACrC,qBAAqB,UAAU,YAAY;GAC3C,YAAY;EACd;YAEC,MAAM,MAAM,GAAG,YAAY,EAAE,KAAK,OAAO,QAAQ;GAChD,MAAM,mCACJ,iBAAiB,KAAK,QAAQ;GAEhC,OACE,oBAAC,QAAD;IAEE,KAAK,MAAM;IACX,KAAK,MAAM;IACX,IAAI;KACF,OAAO;KACP,QAAQ;KACR,QAAQ;KACR,GAAI,oCAAoC;MACtC,YAAY;MACZ,SAAS;MACT,aAAa;KACf;IACF;cAEC,MAAM,UAAU;GACX,GAfD,GAAG,MAAM,UAAU,GAAG,KAerB;EAEZ,CAAC;CACE,CAAA;AAET,CAAC"}
+{"version":3,"file":"AllChainsAvatar.js","names":[],"sources":["../../../../src/components/Chains/AllChainsAvatar.tsx"],"sourcesContent":["import {\n  ChainId,\n  ChainType,\n  type EVMChain,\n  type ExtendedChain,\n} from '@lifi/sdk'\nimport { Avatar, Box } from '@mui/material'\nimport type React from 'react'\nimport { type JSX, memo, useMemo } from 'react'\n\ninterface AllChainsAvatarProps {\n  chains: ExtendedChain[] | EVMChain[]\n  size: 'small' | 'medium'\n}\n\nconst chainTypeIcons = [\n  {\n    name: 'Ethereum',\n    chainType: ChainType.EVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/ethereum.svg',\n    defaultChainId: ChainId.ETH,\n  },\n  {\n    name: 'Solana',\n    chainType: ChainType.SVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/solana.svg',\n    defaultChainId: ChainId.SOL,\n  },\n  {\n    name: 'Bitcoin',\n    chainType: ChainType.UTXO,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/bitcoin.svg',\n    defaultChainId: ChainId.BTC,\n  },\n  {\n    name: 'Sui',\n    chainType: ChainType.MVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/sui.svg',\n    defaultChainId: ChainId.SUI,\n  },\n  {\n    name: 'Tron',\n    chainType: ChainType.TVM,\n    icon: 'https://lifinance.github.io/types/src/assets/icons/chains/tron.svg',\n    defaultChainId: ChainId.TRN,\n  },\n]\n\nconst maxChainAvatarsCount = 4\n\nexport const AllChainsAvatar: React.NamedExoticComponent<AllChainsAvatarProps> =\n  memo(({ chains, size }: AllChainsAvatarProps): JSX.Element => {\n    const icons = useMemo(() => {\n      // Create maps for efficient lookups\n      const chainsPerChainType = new Map<ChainType, number>()\n      const chainsByChainType = new Map<\n        ChainType,\n        (ExtendedChain | EVMChain)[]\n      >()\n\n      chains.forEach((chain) => {\n        chainsPerChainType.set(\n          chain.chainType,\n          (chainsPerChainType.get(chain.chainType) || 0) + 1\n        )\n        const chainsOfType = chainsByChainType.get(chain.chainType) || []\n        chainsOfType.push(chain)\n        chainsByChainType.set(chain.chainType, chainsOfType)\n      })\n\n      // Get existing ecosystem icons\n      const existingChainTypeIcons = chainTypeIcons.filter(\n        (predefinedChain) => {\n          const numberOfChains =\n            chainsPerChainType.get(predefinedChain.chainType) ?? 0\n\n          // If there's only one chain of this type, check if it's not the default\n          if (numberOfChains === 1) {\n            const chainsOfType = chainsByChainType.get(\n              predefinedChain.chainType\n            )\n            const singleChain = chainsOfType?.[0]\n            // Exclude the predefined icon if the single chain is not the default\n            if (\n              singleChain &&\n              singleChain.id !== predefinedChain.defaultChainId\n            ) {\n              return false\n            }\n          }\n\n          return numberOfChains > 0\n        }\n      )\n\n      if (existingChainTypeIcons.length === maxChainAvatarsCount) {\n        return existingChainTypeIcons\n      }\n\n      const remainingSlots =\n        maxChainAvatarsCount - existingChainTypeIcons.length\n\n      // Create a Set for O(1) lookup of predefined icon names\n      const predefinedIconNames = new Set(\n        existingChainTypeIcons.map((icon) => icon.name)\n      )\n\n      const chainsWithLogos = chains.filter((chain) => {\n        // Filter out chain icons matching ecosystem icons\n        return !predefinedIconNames.has(chain.name) && Boolean(chain.logoURI)\n      })\n\n      const additionalIcons = chainsWithLogos\n        .slice(0, remainingSlots)\n        .map((chain) => ({\n          name: chain.name,\n          chainType: chain.chainType,\n          icon: chain.logoURI!,\n        }))\n\n      return [...existingChainTypeIcons, ...additionalIcons]\n    }, [chains])\n\n    const wrapperSize = size === 'small' ? '32px' : '40px'\n    const avatarSize = size === 'small' ? '12px' : '16px'\n    const avatarsCount = Math.min(icons.length, maxChainAvatarsCount)\n    const gridRows = avatarsCount > 2 ? 2 : 1\n    const gridColumns = avatarsCount > 1 ? 2 : 1\n\n    return (\n      <Box\n        sx={{\n          width: wrapperSize,\n          height: wrapperSize,\n          display: 'grid',\n          gridTemplateRows: `repeat(${gridRows}, 1fr)`,\n          gridTemplateColumns: `repeat(${gridColumns}, 1fr)`,\n          placeItems: 'center',\n        }}\n      >\n        {icons.slice(0, avatarsCount).map((chain, idx) => {\n          const isThirdAvatarInThreeAvatarLayout =\n            avatarsCount === 3 && idx === 2\n\n          return (\n            <Avatar\n              key={`${chain.chainType}-${idx}`}\n              src={chain.icon}\n              alt={chain.name}\n              sx={{\n                width: avatarSize,\n                height: avatarSize,\n                margin: 'auto',\n                ...(isThirdAvatarInThreeAvatarLayout && {\n                  gridColumn: '1 / span 2',\n                  gridRow: '2',\n                  justifySelf: 'center',\n                }),\n              }}\n            >\n              {chain.chainType[0]}\n            </Avatar>\n          )\n        })}\n      </Box>\n    )\n  })\n"],"mappings":";;;;;AAeA,MAAM,iBAAiB;CACrB;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;CACA;EACE,MAAM;EACN,WAAW,UAAU;EACrB,MAAM;EACN,gBAAgB,QAAQ;CAC1B;AACF;AAEA,MAAM,uBAAuB;AAE7B,MAAa,kBACX,MAAM,EAAE,QAAQ,WAA8C;CAC5D,MAAM,QAAQ,cAAc;EAE1B,MAAM,qCAAqB,IAAI,IAAuB;EACtD,MAAM,oCAAoB,IAAI,IAG5B;EAEF,OAAO,SAAS,UAAU;GACxB,mBAAmB,IACjB,MAAM,YACL,mBAAmB,IAAI,MAAM,SAAS,KAAK,KAAK,CACnD;GACA,MAAM,eAAe,kBAAkB,IAAI,MAAM,SAAS,KAAK,CAAC;GAChE,aAAa,KAAK,KAAK;GACvB,kBAAkB,IAAI,MAAM,WAAW,YAAY;EACrD,CAAC;EAGD,MAAM,yBAAyB,eAAe,QAC3C,oBAAoB;GACnB,MAAM,iBACJ,mBAAmB,IAAI,gBAAgB,SAAS,KAAK;GAGvD,IAAI,mBAAmB,GAAG;IAIxB,MAAM,cAHe,kBAAkB,IACrC,gBAAgB,SAEa,CAAC,GAAG;IAEnC,IACE,eACA,YAAY,OAAO,gBAAgB,gBAEnC,OAAO;GAEX;GAEA,OAAO,iBAAiB;EAC1B,CACF;EAEA,IAAI,uBAAuB,WAAW,sBACpC,OAAO;EAGT,MAAM,iBACJ,uBAAuB,uBAAuB;EAGhD,MAAM,sBAAsB,IAAI,IAC9B,uBAAuB,KAAK,SAAS,KAAK,IAAI,CAChD;EAOA,MAAM,kBALkB,OAAO,QAAQ,UAAU;GAE/C,OAAO,CAAC,oBAAoB,IAAI,MAAM,IAAI,KAAK,QAAQ,MAAM,OAAO;EACtE,CAEsC,CAAC,CACpC,MAAM,GAAG,cAAc,CAAC,CACxB,KAAK,WAAW;GACf,MAAM,MAAM;GACZ,WAAW,MAAM;GACjB,MAAM,MAAM;EACd,EAAE;EAEJ,OAAO,CAAC,GAAG,wBAAwB,GAAG,eAAe;CACvD,GAAG,CAAC,MAAM,CAAC;CAEX,MAAM,cAAc,SAAS,UAAU,SAAS;CAChD,MAAM,aAAa,SAAS,UAAU,SAAS;CAC/C,MAAM,eAAe,KAAK,IAAI,MAAM,QAAQ,oBAAoB;CAChE,MAAM,WAAW,eAAe,IAAI,IAAI;CACxC,MAAM,cAAc,eAAe,IAAI,IAAI;CAE3C,OACE,oBAAC,KAAD;EACE,IAAI;GACF,OAAO;GACP,QAAQ;GACR,SAAS;GACT,kBAAkB,UAAU,SAAS;GACrC,qBAAqB,UAAU,YAAY;GAC3C,YAAY;EACd;YAEC,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC,KAAK,OAAO,QAAQ;GAChD,MAAM,mCACJ,iBAAiB,KAAK,QAAQ;GAEhC,OACE,oBAAC,QAAD;IAEE,KAAK,MAAM;IACX,KAAK,MAAM;IACX,IAAI;KACF,OAAO;KACP,QAAQ;KACR,QAAQ;KACR,GAAI,oCAAoC;MACtC,YAAY;MACZ,SAAS;MACT,aAAa;KACf;IACF;cAEC,MAAM,UAAU;GACX,GAfD,GAAG,MAAM,UAAU,GAAG,KAerB;EAEZ,CAAC;CACE,CAAA;AAET,CAAC"}

package/dist/esm/components/Chains/ChainList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainList.js","names":["List","ListItemButton","ListItemAvatar","ListItemText"],"sources":["../../../../src/components/Chains/ChainList.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { Skeleton } from '@mui/material'\nimport type { JSX, RefObject } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { FormType } from '../../stores/form/types.js'\nimport { SearchNotFound } from '../Search/SearchNotFound.js'\nimport {\n  List,\n  ListItemAvatar,\n  ListItemButton,\n  ListItemText,\n} from './ChainList.style.js'\nimport { VirtualizedChainList } from './VirtualizedChainList.js'\n\ninterface ChainListProps {\n  parentRef: RefObject<HTMLDivElement | null>\n  formType: FormType\n  chains: ExtendedChain[]\n  onSelect: (chain: ExtendedChain) => void\n  selectedChainId?: number\n  isLoading: boolean\n  hasSearchQuery: boolean\n  inExpansion: boolean\n}\n\nexport const ChainList = ({\n  parentRef,\n  formType,\n  chains,\n  hasSearchQuery,\n  onSelect,\n  selectedChainId,\n  isLoading,\n  inExpansion,\n}: ChainListProps): JSX.Element => {\n  const { t } = useTranslation()\n\n  const itemsSize = inExpansion ? 'small' : 'medium'\n\n  if (isLoading) {\n    return (\n      <List disablePadding sx={{ cursor: 'default' }}>\n        {Array.from({ length: 3 }).map((_, index) => (\n          <ListItemButton\n            key={index}\n            size={itemsSize}\n            sx={{ pointerEvents: 'none' }}\n          >\n            <ListItemAvatar size={itemsSize}>\n              <Skeleton\n                variant=\"circular\"\n                width={itemsSize === 'small' ? 32 : 40}\n                height={itemsSize === 'small' ? 32 : 40}\n                sx={{ marginRight: 2 }}\n              />\n            </ListItemAvatar>\n            <ListItemText\n              primary={\n                <Skeleton\n                  variant=\"text\"\n                  width={'100%'}\n                  height={itemsSize === 'small' ? 18 : 24}\n                />\n              }\n              size={itemsSize}\n            />\n          </ListItemButton>\n        ))}\n      </List>\n    )\n  }\n\n  if (!chains.length) {\n    return <SearchNotFound message={t('info.message.emptyChainList')} />\n  }\n\n  return (\n    <VirtualizedChainList\n      scrollElementRef={parentRef}\n      formType={formType}\n      chains={chains}\n      hasSearchQuery={hasSearchQuery}\n      onSelect={onSelect}\n      selectedChainId={selectedChainId}\n      itemsSize={itemsSize}\n      withPinnedChains={inExpansion}\n    />\n  )\n}\n"],"mappings":";;;;;;;AAyBA,MAAa,aAAa,EACxB,WACA,UACA,QACA,gBACA,UACA,iBACA,WACA,kBACiC;CACjC,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,YAAY,cAAc,UAAU;CAE1C,IAAI,WACF,OACE,oBAACA,QAAD;EAAM,gBAAA;EAAe,IAAI,EAAE,QAAQ,UAAU;YAC1C,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,GAAG,UACjC,qBAACC,kBAAD;GAEE,MAAM;GACN,IAAI,EAAE,eAAe,OAAO;aAH9B,CAKE,oBAACC,kBAAD;IAAgB,MAAM;cACpB,oBAAC,UAAD;KACE,SAAQ;KACR,OAAO,cAAc,UAAU,KAAK;KACpC,QAAQ,cAAc,UAAU,KAAK;KACrC,IAAI,EAAE,aAAa,EAAE;IACtB,CAAA;GACa,CAAA,GAChB,oBAACC,gBAAD;IACE,SACE,oBAAC,UAAD;KACE,SAAQ;KACR,OAAO;KACP,QAAQ,cAAc,UAAU,KAAK;IACtC,CAAA;IAEH,MAAM;GACP,CAAA,CACa;KAtBT,KAsBS,CACjB;CACG,CAAA;CAIV,IAAI,CAAC,OAAO,QACV,OAAO,oBAAC,gBAAD,EAAgB,SAAS,EAAE,6BAA6B,EAAI,CAAA;CAGrE,OACE,oBAAC,sBAAD;EACE,kBAAkB;EACR;EACF;EACQ;EACN;EACO;EACN;EACX,kBAAkB;CACnB,CAAA;AAEL"}
+{"version":3,"file":"ChainList.js","names":["List","ListItemButton","ListItemAvatar","ListItemText"],"sources":["../../../../src/components/Chains/ChainList.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { Skeleton } from '@mui/material'\nimport type { JSX, RefObject } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { FormType } from '../../stores/form/types.js'\nimport { SearchNotFound } from '../Search/SearchNotFound.js'\nimport {\n  List,\n  ListItemAvatar,\n  ListItemButton,\n  ListItemText,\n} from './ChainList.style.js'\nimport { VirtualizedChainList } from './VirtualizedChainList.js'\n\ninterface ChainListProps {\n  parentRef: RefObject<HTMLDivElement | null>\n  formType: FormType\n  chains: ExtendedChain[]\n  onSelect: (chain: ExtendedChain) => void\n  selectedChainId?: number\n  isLoading: boolean\n  hasSearchQuery: boolean\n  inExpansion: boolean\n}\n\nexport const ChainList = ({\n  parentRef,\n  formType,\n  chains,\n  hasSearchQuery,\n  onSelect,\n  selectedChainId,\n  isLoading,\n  inExpansion,\n}: ChainListProps): JSX.Element => {\n  const { t } = useTranslation()\n\n  const itemsSize = inExpansion ? 'small' : 'medium'\n\n  if (isLoading) {\n    return (\n      <List disablePadding sx={{ cursor: 'default' }}>\n        {Array.from({ length: 3 }).map((_, index) => (\n          <ListItemButton\n            key={index}\n            size={itemsSize}\n            sx={{ pointerEvents: 'none' }}\n          >\n            <ListItemAvatar size={itemsSize}>\n              <Skeleton\n                variant=\"circular\"\n                width={itemsSize === 'small' ? 32 : 40}\n                height={itemsSize === 'small' ? 32 : 40}\n                sx={{ marginRight: 2 }}\n              />\n            </ListItemAvatar>\n            <ListItemText\n              primary={\n                <Skeleton\n                  variant=\"text\"\n                  width={'100%'}\n                  height={itemsSize === 'small' ? 18 : 24}\n                />\n              }\n              size={itemsSize}\n            />\n          </ListItemButton>\n        ))}\n      </List>\n    )\n  }\n\n  if (!chains.length) {\n    return <SearchNotFound message={t('info.message.emptyChainList')} />\n  }\n\n  return (\n    <VirtualizedChainList\n      scrollElementRef={parentRef}\n      formType={formType}\n      chains={chains}\n      hasSearchQuery={hasSearchQuery}\n      onSelect={onSelect}\n      selectedChainId={selectedChainId}\n      itemsSize={itemsSize}\n      withPinnedChains={inExpansion}\n    />\n  )\n}\n"],"mappings":";;;;;;;AAyBA,MAAa,aAAa,EACxB,WACA,UACA,QACA,gBACA,UACA,iBACA,WACA,kBACiC;CACjC,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,YAAY,cAAc,UAAU;CAE1C,IAAI,WACF,OACE,oBAACA,QAAD;EAAM,gBAAA;EAAe,IAAI,EAAE,QAAQ,UAAU;YAC1C,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UACjC,qBAACC,kBAAD;GAEE,MAAM;GACN,IAAI,EAAE,eAAe,OAAO;aAH9B,CAKE,oBAACC,kBAAD;IAAgB,MAAM;cACpB,oBAAC,UAAD;KACE,SAAQ;KACR,OAAO,cAAc,UAAU,KAAK;KACpC,QAAQ,cAAc,UAAU,KAAK;KACrC,IAAI,EAAE,aAAa,EAAE;IACtB,CAAA;GACa,CAAA,GAChB,oBAACC,gBAAD;IACE,SACE,oBAAC,UAAD;KACE,SAAQ;KACR,OAAO;KACP,QAAQ,cAAc,UAAU,KAAK;IACtC,CAAA;IAEH,MAAM;GACP,CAAA,CACa;KAtBT,KAsBS,CACjB;CACG,CAAA;CAIV,IAAI,CAAC,OAAO,QACV,OAAO,oBAAC,gBAAD,EAAgB,SAAS,EAAE,6BAA6B,EAAI,CAAA;CAGrE,OACE,oBAAC,sBAAD;EACE,kBAAkB;EACR;EACF;EACQ;EACN;EACO;EACN;EACX,kBAAkB;CACnB,CAAA;AAEL"}

package/dist/esm/components/Chains/ChainList.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainList.style.js","names":["Avatar","MuiAvatar","ListItemAvatar","MuiListItemAvatar","ListItemText","MuiListItemText","ListItemButton","ListItemButtonBase","List","MuiList","ListItem","ListItemBase"],"sources":["../../../../src/components/Chains/ChainList.style.tsx"],"sourcesContent":["import {\n  ListItem as ListItemBase,\n  listItemButtonClasses,\n  listItemTextClasses,\n  Avatar as MuiAvatar,\n  List as MuiList,\n  ListItemAvatar as MuiListItemAvatar,\n  ListItemText as MuiListItemText,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { ListItemButton as ListItemButtonBase } from '../ListItemButton.js'\n\nexport const Avatar: React.FC<\n  React.ComponentProps<typeof MuiAvatar> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(MuiAvatar)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium' }) => ({\n  width: size === 'small' ? 32 : 40,\n  height: size === 'small' ? 32 : 40,\n}))\n\nexport const ListItemAvatar: React.FC<\n  React.ComponentProps<typeof MuiListItemAvatar> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(MuiListItemAvatar)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium' }) => ({\n  minWidth: size === 'small' ? 44 : 56,\n}))\n\nexport const ListItemText: React.FC<\n  React.ComponentProps<typeof MuiListItemText> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(MuiListItemText)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium' }) => ({\n  [`.${listItemTextClasses.primary}`]: {\n    fontWeight: 500,\n    fontSize: size === 'small' ? '1rem' : '1.125rem',\n    textOverflow: 'ellipsis',\n    overflow: 'hidden',\n    whiteSpace: 'nowrap',\n  },\n}))\n\nexport const ListItemButton: React.FC<\n  React.ComponentProps<typeof ListItemButtonBase> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(ListItemButtonBase)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium', theme }) => {\n  return {\n    borderRadius: theme.vars.shape.borderRadius,\n    paddingLeft: size === 'small' ? theme.spacing(1) : theme.spacing(1.5),\n    height: size === 'small' ? 44 : 56,\n    width: '100%',\n  }\n})\n\nexport const List: React.FC<React.ComponentProps<typeof MuiList>> = styled(\n  MuiList\n)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  padding: 0,\n  marginLeft: theme.spacing(1.5),\n  marginRight: theme.spacing(1.5),\n  marginBottom: theme.spacing(1.5),\n  cursor: 'pointer',\n}))\n\nexport const ListItem: React.FC<React.ComponentProps<typeof ListItemBase>> =\n  styled(ListItemBase)(({ theme }) => ({\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    [`& .${listItemButtonClasses.root}`]: {\n      paddingRight: theme.spacing(1),\n    },\n  }))\n"],"mappings":";;;AAaA,MAAaA,WAKT,OAAOC,MAAS,GAEhB,EAAE,OAAO,gBAAgB;CAC3B,OAAO,SAAS,UAAU,KAAK;CAC/B,QAAQ,SAAS,UAAU,KAAK;AAClC,EAAE;AAEF,MAAaC,mBAKT,OAAOC,cAAiB,GAExB,EAAE,OAAO,gBAAgB,EAC3B,UAAU,SAAS,UAAU,KAAK,GACpC,EAAE;AAEF,MAAaC,iBAKT,OAAOC,YAAe,GAEtB,EAAE,OAAO,gBAAgB,GAC1B,IAAI,oBAAoB,YAAY;CACnC,YAAY;CACZ,UAAU,SAAS,UAAU,SAAS;CACtC,cAAc;CACd,UAAU;CACV,YAAY;AACd,EACF,EAAE;AAEF,MAAaC,mBAKT,OAAOC,gBAAkB,GAEzB,EAAE,OAAO,UAAU,YAAY;CACjC,OAAO;EACL,cAAc,MAAM,KAAK,MAAM;EAC/B,aAAa,SAAS,UAAU,MAAM,QAAQ,CAAC,IAAI,MAAM,QAAQ,GAAG;EACpE,QAAQ,SAAS,UAAU,KAAK;EAChC,OAAO;CACT;AACF,CAAC;AAED,MAAaC,SAAuD,OAClEC,IACF,GAAG,EAAE,aAAa;CAChB,SAAS;CACT,eAAe;CACf,KAAK,MAAM,QAAQ,EAAG;CACtB,SAAS;CACT,YAAY,MAAM,QAAQ,GAAG;CAC7B,aAAa,MAAM,QAAQ,GAAG;CAC9B,cAAc,MAAM,QAAQ,GAAG;CAC/B,QAAQ;AACV,EAAE;AAEF,MAAaC,aACX,OAAOC,QAAY,GAAG,EAAE,aAAa;CACnC,UAAU;CACV,KAAK;CACL,MAAM;EACL,MAAM,sBAAsB,SAAS,EACpC,cAAc,MAAM,QAAQ,CAAC,EAC/B;AACF,EAAE"}
+{"version":3,"file":"ChainList.style.js","names":["Avatar","MuiAvatar","ListItemAvatar","MuiListItemAvatar","ListItemText","MuiListItemText","ListItemButton","ListItemButtonBase","List","MuiList","ListItem","ListItemBase"],"sources":["../../../../src/components/Chains/ChainList.style.tsx"],"sourcesContent":["import {\n  ListItem as ListItemBase,\n  listItemButtonClasses,\n  listItemTextClasses,\n  Avatar as MuiAvatar,\n  List as MuiList,\n  ListItemAvatar as MuiListItemAvatar,\n  ListItemText as MuiListItemText,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { ListItemButton as ListItemButtonBase } from '../ListItemButton.js'\n\nexport const Avatar: React.FC<\n  React.ComponentProps<typeof MuiAvatar> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(MuiAvatar)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium' }) => ({\n  width: size === 'small' ? 32 : 40,\n  height: size === 'small' ? 32 : 40,\n}))\n\nexport const ListItemAvatar: React.FC<\n  React.ComponentProps<typeof MuiListItemAvatar> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(MuiListItemAvatar)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium' }) => ({\n  minWidth: size === 'small' ? 44 : 56,\n}))\n\nexport const ListItemText: React.FC<\n  React.ComponentProps<typeof MuiListItemText> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(MuiListItemText)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium' }) => ({\n  [`.${listItemTextClasses.primary}`]: {\n    fontWeight: 500,\n    fontSize: size === 'small' ? '1rem' : '1.125rem',\n    textOverflow: 'ellipsis',\n    overflow: 'hidden',\n    whiteSpace: 'nowrap',\n  },\n}))\n\nexport const ListItemButton: React.FC<\n  React.ComponentProps<typeof ListItemButtonBase> &\n    Partial<{\n      size?: 'small' | 'medium'\n    }>\n> = styled(ListItemButtonBase)<{\n  size?: 'small' | 'medium'\n}>(({ size = 'medium', theme }) => {\n  return {\n    borderRadius: theme.vars.shape.borderRadius,\n    paddingLeft: size === 'small' ? theme.spacing(1) : theme.spacing(1.5),\n    height: size === 'small' ? 44 : 56,\n    width: '100%',\n  }\n})\n\nexport const List: React.FC<React.ComponentProps<typeof MuiList>> = styled(\n  MuiList\n)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  padding: 0,\n  marginLeft: theme.spacing(1.5),\n  marginRight: theme.spacing(1.5),\n  marginBottom: theme.spacing(1.5),\n  cursor: 'pointer',\n}))\n\nexport const ListItem: React.FC<React.ComponentProps<typeof ListItemBase>> =\n  styled(ListItemBase)(({ theme }) => ({\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    [`& .${listItemButtonClasses.root}`]: {\n      paddingRight: theme.spacing(1),\n    },\n  }))\n"],"mappings":";;;AAaA,MAAaA,WAKT,OAAOC,MAAS,CAAC,EAEjB,EAAE,OAAO,gBAAgB;CAC3B,OAAO,SAAS,UAAU,KAAK;CAC/B,QAAQ,SAAS,UAAU,KAAK;AAClC,EAAE;AAEF,MAAaC,mBAKT,OAAOC,cAAiB,CAAC,EAEzB,EAAE,OAAO,gBAAgB,EAC3B,UAAU,SAAS,UAAU,KAAK,GACpC,EAAE;AAEF,MAAaC,iBAKT,OAAOC,YAAe,CAAC,EAEvB,EAAE,OAAO,gBAAgB,GAC1B,IAAI,oBAAoB,YAAY;CACnC,YAAY;CACZ,UAAU,SAAS,UAAU,SAAS;CACtC,cAAc;CACd,UAAU;CACV,YAAY;AACd,EACF,EAAE;AAEF,MAAaC,mBAKT,OAAOC,gBAAkB,CAAC,EAE1B,EAAE,OAAO,UAAU,YAAY;CACjC,OAAO;EACL,cAAc,MAAM,KAAK,MAAM;EAC/B,aAAa,SAAS,UAAU,MAAM,QAAQ,CAAC,IAAI,MAAM,QAAQ,GAAG;EACpE,QAAQ,SAAS,UAAU,KAAK;EAChC,OAAO;CACT;AACF,CAAC;AAED,MAAaC,SAAuD,OAClEC,IACF,CAAC,EAAE,EAAE,aAAa;CAChB,SAAS;CACT,eAAe;CACf,KAAK,MAAM,QAAQ,EAAG;CACtB,SAAS;CACT,YAAY,MAAM,QAAQ,GAAG;CAC7B,aAAa,MAAM,QAAQ,GAAG;CAC9B,cAAc,MAAM,QAAQ,GAAG;CAC/B,QAAQ;AACV,EAAE;AAEF,MAAaC,aACX,OAAOC,QAAY,CAAC,EAAE,EAAE,aAAa;CACnC,UAAU;CACV,KAAK;CACL,MAAM;EACL,MAAM,sBAAsB,SAAS,EACpC,cAAc,MAAM,QAAQ,CAAC,EAC/B;AACF,EAAE"}

package/dist/esm/components/Chains/ChainsExpanded.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainsExpanded.style.js","names":[],"sources":["../../../../src/components/Chains/ChainsExpanded.style.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const chainExpansionWidth = '256px'\n\ninterface SelectChainExpansionContainerProps {\n  expansionHeight: string | number\n}\n\nexport const SelectChainExpansionContainer: React.FC<\n  React.ComponentProps<typeof Box> & SelectChainExpansionContainerProps\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'expansionHeight',\n})<SelectChainExpansionContainerProps>(({ theme, expansionHeight }) => ({\n  ...theme.container,\n  position: 'relative',\n  boxSizing: 'content-box',\n  width: chainExpansionWidth,\n  background: theme.vars.palette.background.default,\n  overflow: 'hidden',\n  flex: 1,\n  zIndex: 0,\n  height: expansionHeight,\n  ...theme.chainSidebarContainer,\n}))\n"],"mappings":";;AAGA,MAAa,sBAAsB;AAMnC,MAAa,gCAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,kBACxC,CAAC,GAAuC,EAAE,OAAO,uBAAuB;CACtE,GAAG,MAAM;CACT,UAAU;CACV,WAAW;CACX,OAAO;CACP,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,UAAU;CACV,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,GAAG,MAAM;AACX,EAAE"}
+{"version":3,"file":"ChainsExpanded.style.js","names":[],"sources":["../../../../src/components/Chains/ChainsExpanded.style.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const chainExpansionWidth = '256px'\n\ninterface SelectChainExpansionContainerProps {\n  expansionHeight: string | number\n}\n\nexport const SelectChainExpansionContainer: React.FC<\n  React.ComponentProps<typeof Box> & SelectChainExpansionContainerProps\n> = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'expansionHeight',\n})<SelectChainExpansionContainerProps>(({ theme, expansionHeight }) => ({\n  ...theme.container,\n  position: 'relative',\n  boxSizing: 'content-box',\n  width: chainExpansionWidth,\n  background: theme.vars.palette.background.default,\n  overflow: 'hidden',\n  flex: 1,\n  zIndex: 0,\n  height: expansionHeight,\n  ...theme.chainSidebarContainer,\n}))\n"],"mappings":";;AAGA,MAAa,sBAAsB;AAMnC,MAAa,gCAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,kBACxC,CAAC,CAAC,EAAsC,EAAE,OAAO,uBAAuB;CACtE,GAAG,MAAM;CACT,UAAU;CACV,WAAW;CACX,OAAO;CACP,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,UAAU;CACV,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,GAAG,MAAM;AACX,EAAE"}

package/dist/esm/components/Chains/VirtualizedChainList.js

@@ -34,7 +34,8 @@ const VirtualizedChainList = ({ formType, chains, hasSearchQuery, onSelect, sele
 	const showAllNetworksOption = showAllNetworks && !hasSearchQuery;
 	const getItemKey = useCallback((index) => {
 		if (showAllNetworksOption && index === 0) return "all-chains";
-		return `${sortedChains[index - (showAllNetworksOption ? 1 : 0)].id}-${index}`;
+		const chainIndex = index - (showAllNetworksOption ? 1 : 0);
+		return `${sortedChains[chainIndex].id}-${index}`;
 	}, [sortedChains, showAllNetworksOption]);
 	const onChainSelect = useCallback((chain) => {
 		setIsAllNetworks(false, formType);

package/dist/esm/components/Chains/VirtualizedChainList.js.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedChainList.js","names":[],"sources":["../../../../src/components/Chains/VirtualizedChainList.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { useVirtualizer } from '@tanstack/react-virtual'\nimport type { JSX, RefObject } from 'react'\nimport { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport { FormKeyHelper, type FormType } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { AllChainsAvatar } from './AllChainsAvatar.js'\nimport {\n  List,\n  ListItem,\n  ListItemAvatar,\n  ListItemButton,\n  ListItemText,\n} from './ChainList.style.js'\nimport { ChainListItem } from './ChainListItem.js'\n\ninterface VirtualizedChainListProps {\n  scrollElementRef: RefObject<HTMLDivElement | null>\n  formType: FormType\n  chains: ExtendedChain[]\n  onSelect: (chain: ExtendedChain) => void\n  selectedChainId?: number\n  itemsSize: 'small' | 'medium'\n  hasSearchQuery: boolean\n  withPinnedChains: boolean\n}\n\nexport const VirtualizedChainList = ({\n  formType,\n  chains,\n  hasSearchQuery,\n  onSelect,\n  selectedChainId,\n  itemsSize,\n  scrollElementRef,\n  withPinnedChains,\n}: VirtualizedChainListProps): JSX.Element => {\n  const { t } = useTranslation()\n  const selectedChainIdRef = useRef(selectedChainId) // Store the initial selected chain ID to scroll to it once chains are loaded\n  const hasScrolledRef = useRef(false)\n  const [\n    pinnedChains,\n    setPinnedChain,\n    isAllNetworks,\n    setIsAllNetworks,\n    showAllNetworks,\n  ] = useChainOrderStore((state) => [\n    state.pinnedChains,\n    state.setPinnedChain,\n    state[`${formType}IsAllNetworks`],\n    state.setIsAllNetworks,\n    state[`${formType}ShowAllNetworks`],\n  ])\n  const { setFieldValue } = useFieldActions()\n  const onPin = useCallback(\n    (chainId: number) => {\n      setPinnedChain(chainId)\n    },\n    [setPinnedChain]\n  )\n\n  const sortedChains = useMemo(() => {\n    if (!pinnedChains.length) {\n      return chains\n    }\n    // Pinning logic: move pinned chains to the top of the list\n    const pinned = pinnedChains\n      .map((id) => chains.find((c) => c.id === id))\n      .filter(Boolean) as ExtendedChain[]\n    const pinnedIds = new Set(pinned.map((c) => c.id))\n    const rest = chains.filter((c) => !pinnedIds.has(c.id))\n    return [...pinned, ...rest]\n  }, [chains, pinnedChains])\n\n  const showAllNetworksOption = showAllNetworks && !hasSearchQuery\n\n  const getItemKey = useCallback(\n    (index: number) => {\n      if (showAllNetworksOption && index === 0) {\n        return 'all-chains'\n      }\n      const chainIndex = index - (showAllNetworksOption ? 1 : 0)\n      return `${sortedChains[chainIndex].id}-${index}`\n    },\n    [sortedChains, showAllNetworksOption]\n  )\n\n  const onChainSelect = useCallback(\n    (chain: ExtendedChain) => {\n      setIsAllNetworks(false, formType)\n      onSelect(chain)\n    },\n    [onSelect, setIsAllNetworks, formType]\n  )\n\n  const { getVirtualItems, getTotalSize, measure, range, getOffsetForIndex } =\n    useVirtualizer({\n      count: sortedChains.length + (showAllNetworksOption ? 1 : 0), // +1 for the all networks item\n      overscan: 3,\n      paddingEnd: 0,\n      getScrollElement: () => scrollElementRef.current,\n      estimateSize: () => {\n        return itemsSize === 'small' ? 48 : 60\n      },\n      getItemKey,\n    })\n\n  // Using mountOnEnter of the ExpansionTransition component\n  // leads to a short delay for setting up scrollElementRef,\n  // which in turn leads to getVirtualItems() returning an empty array.\n  // Workaround: Re-measure when scroll element becomes available\n  useEffect(() => {\n    if (scrollElementRef.current) {\n      measure()\n    }\n  }, [measure, scrollElementRef.current])\n\n  const scrollToIndex = useCallback(\n    (index: number) => {\n      requestAnimationFrame(() => {\n        const offsetInfo = getOffsetForIndex(index, 'center')\n        if (!scrollElementRef.current || !offsetInfo) {\n          return\n        }\n        scrollElementRef.current.scrollTo({\n          top: offsetInfo[0],\n          left: 0,\n          behavior: 'smooth',\n        })\n      })\n    },\n    [getOffsetForIndex, scrollElementRef.current]\n  )\n\n  useEffect(() => {\n    // Mark as scrolled if \"All Networks\" is initially selected\n    if (isAllNetworks) {\n      hasScrolledRef.current = true\n      return\n    }\n\n    // Only scroll if sortedChains is not empty and we haven't scrolled yet\n    if (!hasScrolledRef.current && sortedChains.length > 0 && range) {\n      const selectedChainIndex = sortedChains.findIndex(\n        (chain) => chain.id === selectedChainIdRef.current\n      )\n      if (selectedChainIndex !== -1) {\n        // Only scroll if the selected chain is not in the visible range\n        // +1 and -1 to account for partially visible items\n        if (\n          range.startIndex + 1 > selectedChainIndex ||\n          range.endIndex - 1 < selectedChainIndex\n        ) {\n          scrollToIndex(selectedChainIndex)\n        }\n      }\n      hasScrolledRef.current = true // Mark as scrolled (when needed)\n    }\n  }, [sortedChains, scrollToIndex, range, isAllNetworks])\n\n  const selectAllNetworks = useCallback(() => {\n    setIsAllNetworks(true, formType)\n    // Reset the chain and token fields when selecting all networks\n    setFieldValue(FormKeyHelper.getChainKey(formType), '', { isTouched: true })\n    setFieldValue(FormKeyHelper.getTokenKey(formType), '', { isTouched: true })\n  }, [setIsAllNetworks, formType, setFieldValue])\n\n  return (\n    <List\n      className=\"long-list\"\n      style={{ height: getTotalSize() }}\n      disablePadding\n    >\n      {getVirtualItems().map((item) => {\n        if (showAllNetworksOption && item.index === 0) {\n          return (\n            <ListItem\n              key={item.key}\n              style={{\n                height: `${itemsSize}px`,\n                transform: `translateY(${item.start}px)`,\n                padding: 0,\n              }}\n            >\n              <ListItemButton\n                onClick={selectAllNetworks}\n                selected={isAllNetworks}\n                size={itemsSize}\n              >\n                <ListItemAvatar size={itemsSize}>\n                  <AllChainsAvatar chains={chains} size={itemsSize} />\n                </ListItemAvatar>\n                <ListItemText\n                  primary={t('main.allNetworks')}\n                  size={itemsSize}\n                />\n              </ListItemButton>\n            </ListItem>\n          )\n        }\n\n        const chain = sortedChains[item.index - (showAllNetworksOption ? 1 : 0)]\n        return (\n          <ChainListItem\n            key={item.key}\n            chain={chain}\n            onSelect={onChainSelect}\n            selected={!isAllNetworks && chain.id === selectedChainId}\n            itemsSize={itemsSize}\n            size={item.size}\n            start={item.start}\n            withPin={withPinnedChains}\n            isPinned={pinnedChains.includes(chain.id)}\n            onPin={onPin}\n          />\n        )\n      })}\n    </List>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"VirtualizedChainList.js","names":[],"sources":["../../../../src/components/Chains/VirtualizedChainList.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { useVirtualizer } from '@tanstack/react-virtual'\nimport type { JSX, RefObject } from 'react'\nimport { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport { FormKeyHelper, type FormType } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { AllChainsAvatar } from './AllChainsAvatar.js'\nimport {\n  List,\n  ListItem,\n  ListItemAvatar,\n  ListItemButton,\n  ListItemText,\n} from './ChainList.style.js'\nimport { ChainListItem } from './ChainListItem.js'\n\ninterface VirtualizedChainListProps {\n  scrollElementRef: RefObject<HTMLDivElement | null>\n  formType: FormType\n  chains: ExtendedChain[]\n  onSelect: (chain: ExtendedChain) => void\n  selectedChainId?: number\n  itemsSize: 'small' | 'medium'\n  hasSearchQuery: boolean\n  withPinnedChains: boolean\n}\n\nexport const VirtualizedChainList = ({\n  formType,\n  chains,\n  hasSearchQuery,\n  onSelect,\n  selectedChainId,\n  itemsSize,\n  scrollElementRef,\n  withPinnedChains,\n}: VirtualizedChainListProps): JSX.Element => {\n  const { t } = useTranslation()\n  const selectedChainIdRef = useRef(selectedChainId) // Store the initial selected chain ID to scroll to it once chains are loaded\n  const hasScrolledRef = useRef(false)\n  const [\n    pinnedChains,\n    setPinnedChain,\n    isAllNetworks,\n    setIsAllNetworks,\n    showAllNetworks,\n  ] = useChainOrderStore((state) => [\n    state.pinnedChains,\n    state.setPinnedChain,\n    state[`${formType}IsAllNetworks`],\n    state.setIsAllNetworks,\n    state[`${formType}ShowAllNetworks`],\n  ])\n  const { setFieldValue } = useFieldActions()\n  const onPin = useCallback(\n    (chainId: number) => {\n      setPinnedChain(chainId)\n    },\n    [setPinnedChain]\n  )\n\n  const sortedChains = useMemo(() => {\n    if (!pinnedChains.length) {\n      return chains\n    }\n    // Pinning logic: move pinned chains to the top of the list\n    const pinned = pinnedChains\n      .map((id) => chains.find((c) => c.id === id))\n      .filter(Boolean) as ExtendedChain[]\n    const pinnedIds = new Set(pinned.map((c) => c.id))\n    const rest = chains.filter((c) => !pinnedIds.has(c.id))\n    return [...pinned, ...rest]\n  }, [chains, pinnedChains])\n\n  const showAllNetworksOption = showAllNetworks && !hasSearchQuery\n\n  const getItemKey = useCallback(\n    (index: number) => {\n      if (showAllNetworksOption && index === 0) {\n        return 'all-chains'\n      }\n      const chainIndex = index - (showAllNetworksOption ? 1 : 0)\n      return `${sortedChains[chainIndex].id}-${index}`\n    },\n    [sortedChains, showAllNetworksOption]\n  )\n\n  const onChainSelect = useCallback(\n    (chain: ExtendedChain) => {\n      setIsAllNetworks(false, formType)\n      onSelect(chain)\n    },\n    [onSelect, setIsAllNetworks, formType]\n  )\n\n  const { getVirtualItems, getTotalSize, measure, range, getOffsetForIndex } =\n    useVirtualizer({\n      count: sortedChains.length + (showAllNetworksOption ? 1 : 0), // +1 for the all networks item\n      overscan: 3,\n      paddingEnd: 0,\n      getScrollElement: () => scrollElementRef.current,\n      estimateSize: () => {\n        return itemsSize === 'small' ? 48 : 60\n      },\n      getItemKey,\n    })\n\n  // Using mountOnEnter of the ExpansionTransition component\n  // leads to a short delay for setting up scrollElementRef,\n  // which in turn leads to getVirtualItems() returning an empty array.\n  // Workaround: Re-measure when scroll element becomes available\n  useEffect(() => {\n    if (scrollElementRef.current) {\n      measure()\n    }\n  }, [measure, scrollElementRef.current])\n\n  const scrollToIndex = useCallback(\n    (index: number) => {\n      requestAnimationFrame(() => {\n        const offsetInfo = getOffsetForIndex(index, 'center')\n        if (!scrollElementRef.current || !offsetInfo) {\n          return\n        }\n        scrollElementRef.current.scrollTo({\n          top: offsetInfo[0],\n          left: 0,\n          behavior: 'smooth',\n        })\n      })\n    },\n    [getOffsetForIndex, scrollElementRef.current]\n  )\n\n  useEffect(() => {\n    // Mark as scrolled if \"All Networks\" is initially selected\n    if (isAllNetworks) {\n      hasScrolledRef.current = true\n      return\n    }\n\n    // Only scroll if sortedChains is not empty and we haven't scrolled yet\n    if (!hasScrolledRef.current && sortedChains.length > 0 && range) {\n      const selectedChainIndex = sortedChains.findIndex(\n        (chain) => chain.id === selectedChainIdRef.current\n      )\n      if (selectedChainIndex !== -1) {\n        // Only scroll if the selected chain is not in the visible range\n        // +1 and -1 to account for partially visible items\n        if (\n          range.startIndex + 1 > selectedChainIndex ||\n          range.endIndex - 1 < selectedChainIndex\n        ) {\n          scrollToIndex(selectedChainIndex)\n        }\n      }\n      hasScrolledRef.current = true // Mark as scrolled (when needed)\n    }\n  }, [sortedChains, scrollToIndex, range, isAllNetworks])\n\n  const selectAllNetworks = useCallback(() => {\n    setIsAllNetworks(true, formType)\n    // Reset the chain and token fields when selecting all networks\n    setFieldValue(FormKeyHelper.getChainKey(formType), '', { isTouched: true })\n    setFieldValue(FormKeyHelper.getTokenKey(formType), '', { isTouched: true })\n  }, [setIsAllNetworks, formType, setFieldValue])\n\n  return (\n    <List\n      className=\"long-list\"\n      style={{ height: getTotalSize() }}\n      disablePadding\n    >\n      {getVirtualItems().map((item) => {\n        if (showAllNetworksOption && item.index === 0) {\n          return (\n            <ListItem\n              key={item.key}\n              style={{\n                height: `${itemsSize}px`,\n                transform: `translateY(${item.start}px)`,\n                padding: 0,\n              }}\n            >\n              <ListItemButton\n                onClick={selectAllNetworks}\n                selected={isAllNetworks}\n                size={itemsSize}\n              >\n                <ListItemAvatar size={itemsSize}>\n                  <AllChainsAvatar chains={chains} size={itemsSize} />\n                </ListItemAvatar>\n                <ListItemText\n                  primary={t('main.allNetworks')}\n                  size={itemsSize}\n                />\n              </ListItemButton>\n            </ListItem>\n          )\n        }\n\n        const chain = sortedChains[item.index - (showAllNetworksOption ? 1 : 0)]\n        return (\n          <ChainListItem\n            key={item.key}\n            chain={chain}\n            onSelect={onChainSelect}\n            selected={!isAllNetworks && chain.id === selectedChainId}\n            itemsSize={itemsSize}\n            size={item.size}\n            start={item.start}\n            withPin={withPinnedChains}\n            isPinned={pinnedChains.includes(chain.id)}\n            onPin={onPin}\n          />\n        )\n      })}\n    </List>\n  )\n}\n"],"mappings":"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"}

package/dist/esm/components/ContextMenu.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.style.js","names":[],"sources":["../../../src/components/ContextMenu.style.tsx"],"sourcesContent":["import { IconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const ContextMenuButton: React.FC<\n  React.ComponentProps<typeof IconButton>\n> = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  top: theme.spacing(1.75),\n  right: theme.spacing(2),\n  '&:hover': {\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n  },\n}))\n"],"mappings":";;AAGA,MAAa,oBAET,OAAO,UAAU,GAAG,EAAE,aAAa;CACrC,UAAU;CACV,KAAK,MAAM,QAAQ,IAAI;CACvB,OAAO,MAAM,QAAQ,CAAC;CACtB,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;AACF,EAAE"}
+{"version":3,"file":"ContextMenu.style.js","names":[],"sources":["../../../src/components/ContextMenu.style.tsx"],"sourcesContent":["import { IconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const ContextMenuButton: React.FC<\n  React.ComponentProps<typeof IconButton>\n> = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  top: theme.spacing(1.75),\n  right: theme.spacing(2),\n  '&:hover': {\n    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n  },\n}))\n"],"mappings":";;AAGA,MAAa,oBAET,OAAO,UAAU,CAAC,EAAE,EAAE,aAAa;CACrC,UAAU;CACV,KAAK,MAAM,QAAQ,IAAI;CACvB,OAAO,MAAM,QAAQ,CAAC;CACtB,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;AACF,EAAE"}

package/dist/esm/components/ContractComponent/NFT/NFT.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"NFT.style.js","names":[],"sources":["../../../../../src/components/ContractComponent/NFT/NFT.style.ts"],"sourcesContent":["import { Avatar, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const PreviewAvatar: React.FC<React.ComponentProps<typeof Avatar>> =\n  styled(Avatar)(({ theme }) => ({\n    background: theme.vars.palette.background.paper,\n    width: 96,\n    height: 96,\n    borderRadius: theme.vars.shape.borderRadius,\n  }))\n"],"mappings":";;AAGA,MAAa,gBACX,OAAO,MAAM,GAAG,EAAE,aAAa;CAC7B,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,OAAO;CACP,QAAQ;CACR,cAAc,MAAM,KAAK,MAAM;AACjC,EAAE"}
+{"version":3,"file":"NFT.style.js","names":[],"sources":["../../../../../src/components/ContractComponent/NFT/NFT.style.ts"],"sourcesContent":["import { Avatar, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const PreviewAvatar: React.FC<React.ComponentProps<typeof Avatar>> =\n  styled(Avatar)(({ theme }) => ({\n    background: theme.vars.palette.background.paper,\n    width: 96,\n    height: 96,\n    borderRadius: theme.vars.shape.borderRadius,\n  }))\n"],"mappings":";;AAGA,MAAa,gBACX,OAAO,MAAM,CAAC,EAAE,EAAE,aAAa;CAC7B,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,OAAO;CACP,QAAQ;CACR,cAAc,MAAM,KAAK,MAAM;AACjC,EAAE"}

package/dist/esm/components/Dialog/Dialog.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.style.js","names":["DialogTitle","MuiDialogTitle","DialogContent","MuiDialogContent","DialogActions","MuiDialogActions","DialogContentText","MuiDialogContentText"],"sources":["../../../../src/components/Dialog/Dialog.style.tsx"],"sourcesContent":["import {\n  Box,\n  DialogActions as MuiDialogActions,\n  DialogContent as MuiDialogContent,\n  DialogContentText as MuiDialogContentText,\n  DialogTitle as MuiDialogTitle,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const DialogContainer: React.FC<React.ComponentProps<typeof Box>> =\n  styled(Box)(({ theme }) => ({\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    gap: theme.spacing(1.5),\n    padding: theme.spacing(4),\n  }))\n\nexport const DialogTitle: React.FC<\n  React.ComponentProps<typeof MuiDialogTitle>\n> = styled(MuiDialogTitle)({\n  padding: 0,\n  fontWeight: 700,\n  fontSize: 18,\n  lineHeight: 1.3334,\n  textAlign: 'center',\n})\n\nexport const DialogContent: React.FC<\n  React.ComponentProps<typeof MuiDialogContent>\n> = styled(MuiDialogContent)(({ theme }) => ({\n  padding: 0,\n  marginBottom: theme.spacing(2),\n}))\n\nexport const DialogActions: React.FC<\n  React.ComponentProps<typeof MuiDialogActions>\n> = styled(MuiDialogActions)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'center',\n  gap: theme.spacing(1.5),\n  width: '100%',\n  padding: 0,\n  '& .MuiButton-root': {\n    flex: 1,\n    margin: 0,\n  },\n}))\n\nexport const DialogContentText: React.FC<\n  React.ComponentProps<typeof MuiDialogContentText>\n> = styled(MuiDialogContentText)(({ theme }) => ({\n  padding: 0,\n  fontSize: 14,\n  fontWeight: 500,\n  lineHeight: 1.3334,\n  color: theme.vars.palette.text.primary,\n}))\n"],"mappings":";;AAUA,MAAa,kBACX,OAAO,GAAG,GAAG,EAAE,aAAa;CAC1B,SAAS;CACT,eAAe;CACf,YAAY;CACZ,KAAK,MAAM,QAAQ,GAAG;CACtB,SAAS,MAAM,QAAQ,CAAC;AAC1B,EAAE;AAEJ,MAAaA,gBAET,OAAOC,WAAc,EAAE;CACzB,SAAS;CACT,YAAY;CACZ,UAAU;CACV,YAAY;CACZ,WAAW;AACb,CAAC;AAED,MAAaC,kBAET,OAAOC,aAAgB,GAAG,EAAE,aAAa;CAC3C,SAAS;CACT,cAAc,MAAM,QAAQ,CAAC;AAC/B,EAAE;AAEF,MAAaC,kBAET,OAAOC,aAAgB,GAAG,EAAE,aAAa;CAC3C,SAAS;CACT,gBAAgB;CAChB,KAAK,MAAM,QAAQ,GAAG;CACtB,OAAO;CACP,SAAS;CACT,qBAAqB;EACnB,MAAM;EACN,QAAQ;CACV;AACF,EAAE;AAEF,MAAaC,sBAET,OAAOC,iBAAoB,GAAG,EAAE,aAAa;CAC/C,SAAS;CACT,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;AACjC,EAAE"}
+{"version":3,"file":"Dialog.style.js","names":["DialogTitle","MuiDialogTitle","DialogContent","MuiDialogContent","DialogActions","MuiDialogActions","DialogContentText","MuiDialogContentText"],"sources":["../../../../src/components/Dialog/Dialog.style.tsx"],"sourcesContent":["import {\n  Box,\n  DialogActions as MuiDialogActions,\n  DialogContent as MuiDialogContent,\n  DialogContentText as MuiDialogContentText,\n  DialogTitle as MuiDialogTitle,\n  styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const DialogContainer: React.FC<React.ComponentProps<typeof Box>> =\n  styled(Box)(({ theme }) => ({\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    gap: theme.spacing(1.5),\n    padding: theme.spacing(4),\n  }))\n\nexport const DialogTitle: React.FC<\n  React.ComponentProps<typeof MuiDialogTitle>\n> = styled(MuiDialogTitle)({\n  padding: 0,\n  fontWeight: 700,\n  fontSize: 18,\n  lineHeight: 1.3334,\n  textAlign: 'center',\n})\n\nexport const DialogContent: React.FC<\n  React.ComponentProps<typeof MuiDialogContent>\n> = styled(MuiDialogContent)(({ theme }) => ({\n  padding: 0,\n  marginBottom: theme.spacing(2),\n}))\n\nexport const DialogActions: React.FC<\n  React.ComponentProps<typeof MuiDialogActions>\n> = styled(MuiDialogActions)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'center',\n  gap: theme.spacing(1.5),\n  width: '100%',\n  padding: 0,\n  '& .MuiButton-root': {\n    flex: 1,\n    margin: 0,\n  },\n}))\n\nexport const DialogContentText: React.FC<\n  React.ComponentProps<typeof MuiDialogContentText>\n> = styled(MuiDialogContentText)(({ theme }) => ({\n  padding: 0,\n  fontSize: 14,\n  fontWeight: 500,\n  lineHeight: 1.3334,\n  color: theme.vars.palette.text.primary,\n}))\n"],"mappings":";;AAUA,MAAa,kBACX,OAAO,GAAG,CAAC,EAAE,EAAE,aAAa;CAC1B,SAAS;CACT,eAAe;CACf,YAAY;CACZ,KAAK,MAAM,QAAQ,GAAG;CACtB,SAAS,MAAM,QAAQ,CAAC;AAC1B,EAAE;AAEJ,MAAaA,gBAET,OAAOC,WAAc,CAAC,CAAC;CACzB,SAAS;CACT,YAAY;CACZ,UAAU;CACV,YAAY;CACZ,WAAW;AACb,CAAC;AAED,MAAaC,kBAET,OAAOC,aAAgB,CAAC,EAAE,EAAE,aAAa;CAC3C,SAAS;CACT,cAAc,MAAM,QAAQ,CAAC;AAC/B,EAAE;AAEF,MAAaC,kBAET,OAAOC,aAAgB,CAAC,EAAE,EAAE,aAAa;CAC3C,SAAS;CACT,gBAAgB;CAChB,KAAK,MAAM,QAAQ,GAAG;CACtB,OAAO;CACP,SAAS;CACT,qBAAqB;EACnB,MAAM;EACN,QAAQ;CACV;AACF,EAAE;AAEF,MAAaC,sBAET,OAAOC,iBAAoB,CAAC,EAAE,EAAE,aAAa;CAC/C,SAAS;CACT,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;AACjC,EAAE"}