@lifi/widget 4.0.0-beta.0 → 4.0.0-beta.10

package/dist/esm/components/Timer/TimerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimerContent.js","sourceRoot":"","sources":["../../../../src/components/Timer/TimerContent.tsx"],"names":[],"mappings":";AAAA,OAAO,gBAAgB,MAAM,sCAAsC,CAAA;AACnE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAE5C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAErD,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAClE,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAA;IAC9B,OAAO,CACL,KAAC,OAAO,IAAC,KAAK,EAAE,CAAC,CAAC,uBAAuB,CAAC,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,YAChE,MAAC,GAAG,IACF,SAAS,EAAC,MAAM,EAChB,EAAE,EAAE;gBACF,OAAO,EAAE,MAAM;gBACf,UAAU,EAAE,QAAQ;gBACpB,MAAM,EAAE,EAAE;aACX,aAED,KAAC,cAAc,IAAC,EAAE,EAAC,MAAM,EAAC,EAAE,EAAE,EAAE,WAAW,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE,EAAE,YAC9D,KAAC,gBAAgB,IAAC,QAAQ,EAAC,SAAS,GAAG,GACxB,EACjB,KAAC,GAAG,IACF,SAAS,EAAC,MAAM,EAChB,EAAE,EAAE;wBACF,kBAAkB,EAAE,cAAc;wBAClC,MAAM,EAAE,MAAM;qBACf,YAEA,QAAQ,GACL,IACF,GACE,CACX,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"TimerContent.js","names":[],"sources":["../../../../src/components/Timer/TimerContent.tsx"],"sourcesContent":["import AccessTimeFilled from '@mui/icons-material/AccessTimeFilled'\nimport { Box, Tooltip } from '@mui/material'\nimport type { FC, PropsWithChildren } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { IconTypography } from '../IconTypography.js'\n\nexport const TimerContent: FC<PropsWithChildren> = ({ children }) => {\n  const { t } = useTranslation()\n  return (\n    <Tooltip title={t('tooltip.estimatedTime')} sx={{ cursor: 'help' }}>\n      <Box\n        component=\"span\"\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          height: 14,\n        }}\n      >\n        <IconTypography\n          sx={{ marginRight: 0.5, fontSize: 16, display: 'inline-flex' }}\n        >\n          <AccessTimeFilled fontSize=\"inherit\" />\n        </IconTypography>\n        <Box\n          component=\"span\"\n          sx={{\n            fontVariantNumeric: 'tabular-nums',\n            cursor: 'help',\n          }}\n        >\n          {children}\n        </Box>\n      </Box>\n    </Tooltip>\n  )\n}\n"],"mappings":";;;;;;AAMA,MAAa,gBAAuC,EAAE,eAAe;CACnE,MAAM,EAAE,MAAM,gBAAgB;AAC9B,QACE,oBAAC,SAAD;EAAS,OAAO,EAAE,wBAAwB;EAAE,IAAI,EAAE,QAAQ,QAAQ;YAChE,qBAAC,KAAD;GACE,WAAU;GACV,IAAI;IACF,SAAS;IACT,YAAY;IACZ,QAAQ;IACT;aANH,CAQE,oBAAC,gBAAD;IACE,IAAI;KAAE,aAAa;KAAK,UAAU;KAAI,SAAS;KAAe;cAE9D,oBAAC,kBAAD,EAAkB,UAAS,WAAY,CAAA;IACxB,CAAA,EACjB,oBAAC,KAAD;IACE,WAAU;IACV,IAAI;KACF,oBAAoB;KACpB,QAAQ;KACT;IAEA;IACG,CAAA,CACF;;EACE,CAAA"}

package/dist/esm/components/Token/Token.js

@@ -1,110 +1,208 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Grow, Skeleton, Tooltip } from '@mui/material';
-import { useTranslation } from 'react-i18next';
-import { useChain } from '../../hooks/useChain.js';
-import { useToken } from '../../hooks/useToken.js';
-import { formatTokenAmount, formatTokenPrice } from '../../utils/format.js';
-import { getPriceImpact } from '../../utils/getPriceImpact.js';
-import { AvatarBadgedSkeleton } from '../Avatar/Avatar.js';
-import { SmallAvatar } from '../Avatar/SmallAvatar.js';
-import { TokenAvatar } from '../Avatar/TokenAvatar.js';
-import { TextFitter } from '../TextFitter/TextFitter.js';
-import { TextSecondary, TextSecondaryContainer } from './Token.style.js';
-export const Token = ({ token, ...other }) => {
-    if (!token.priceUSD || !token.logoURI) {
-        return _jsx(TokenFallback, { token: token, ...other });
-    }
-    return _jsx(TokenBase, { token: token, ...other });
+import { formatTokenAmount, formatTokenPrice } from "../../utils/format.js";
+import { useChain } from "../../hooks/useChain.js";
+import { useToken } from "../../hooks/useToken.js";
+import { getPriceImpact } from "../../utils/getPriceImpact.js";
+import { SmallAvatar } from "../Avatar/SmallAvatar.js";
+import { AvatarBadgedSkeleton } from "../Avatar/Avatar.js";
+import { TokenAvatar } from "../Avatar/TokenAvatar.js";
+import { TextFitter } from "../TextFitter/TextFitter.js";
+import { TextSecondary, TextSecondaryContainer } from "./Token.style.js";
+import { Box, Grow, Skeleton, Tooltip } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+//#region src/components/Token/Token.tsx
+const Token = ({ token, ...other }) => {
+	if (!token.priceUSD || !token.logoURI) return /* @__PURE__ */ jsx(TokenFallback, {
+		token,
+		...other
+	});
+	return /* @__PURE__ */ jsx(TokenBase, {
+		token,
+		...other
+	});
 };
 const TokenFallback = ({ token, isLoading, ...other }) => {
-    const { token: chainToken, isLoading: isLoadingToken } = useToken(token.chainId, token.address);
-    return (_jsx(TokenBase, { token: { ...token, ...chainToken }, isLoading: isLoading || isLoadingToken, ...other }));
+	const { token: chainToken, isLoading: isLoadingToken } = useToken(token.chainId, token.address);
+	return /* @__PURE__ */ jsx(TokenBase, {
+		token: {
+			...token,
+			...chainToken
+		},
+		isLoading: isLoading || isLoadingToken,
+		...other
+	});
 };
 const TokenBase = ({ token, impactToken, enableImpactTokenTooltip, step, stepVisible, disableDescription, isLoading, ...other }) => {
-    const { t, i18n } = useTranslation();
-    const { chain } = useChain(token?.chainId);
-    if (isLoading) {
-        return (_jsx(TokenSkeleton, { token: token, step: step, disableDescription: disableDescription, ...other }));
-    }
-    const tokenAmount = formatTokenAmount(token.amount, token.decimals);
-    const tokenPrice = formatTokenPrice(token.amount, token.priceUSD, token.decimals);
-    let priceImpact;
-    let priceImpactPercent;
-    if (impactToken) {
-        priceImpact = getPriceImpact({
-            fromToken: impactToken,
-            fromAmount: impactToken.amount,
-            toToken: token,
-            toAmount: token.amount,
-        });
-        priceImpactPercent = priceImpact * 100;
-    }
-    const tokenOnChain = !disableDescription ? (_jsx(TextSecondary, { children: t('main.tokenOnChain', {
-            tokenSymbol: token.symbol,
-            chainName: chain?.name,
-        }) })) : null;
-    return (_jsxs(Box, { ...other, sx: [
-            {
-                flex: 1,
-                display: 'flex',
-                alignItems: 'center',
-            },
-            ...(Array.isArray(other.sx) ? other.sx : [other.sx]),
-        ], children: [_jsx(TokenAvatar, { token: token, chain: chain, isLoading: isLoading, sx: { marginRight: 2 } }), _jsxs(Box, { sx: {
-                    flex: 1,
-                }, children: [_jsx(Box, { sx: {
-                            mb: 0.5,
-                            height: 24,
-                            display: 'flex',
-                            alignItems: 'center',
-                        }, title: tokenAmount, children: _jsx(TextFitter, { height: 30, textStyle: {
-                                fontWeight: 700,
-                            }, children: t('format.tokenAmount', {
-                                value: tokenAmount,
-                            }) }) }), _jsxs(TextSecondaryContainer, { as: "span", children: [_jsx(TextSecondary, { children: t('format.currency', {
-                                    value: tokenPrice,
-                                }) }), impactToken ? (_jsx(TextSecondary, { px: 0.5, dot: true, children: "\u2022" })) : null, impactToken ? (enableImpactTokenTooltip ? (_jsx(Tooltip, { title: t('tooltip.priceImpact'), sx: { cursor: 'help' }, children: _jsx(TextSecondary, { children: t('format.percent', {
-                                        value: priceImpact,
-                                        usePlusSign: true,
-                                    }) }) })) : (_jsx(TextSecondary, { title: priceImpactPercent?.toLocaleString(i18n.language, {
-                                    maximumFractionDigits: 9,
-                                }), children: t('format.percent', { value: priceImpact, usePlusSign: true }) }))) : null, !disableDescription ? (_jsx(TextSecondary, { px: 0.5, dot: true, children: "\u2022" })) : null, !disableDescription && step ? (_jsx(TokenStep, { step: step, stepVisible: stepVisible, disableDescription: disableDescription, children: tokenOnChain })) : (tokenOnChain)] })] })] }));
+	const { t, i18n } = useTranslation();
+	const { chain } = useChain(token?.chainId);
+	if (isLoading) return /* @__PURE__ */ jsx(TokenSkeleton, {
+		token,
+		step,
+		disableDescription,
+		...other
+	});
+	const tokenAmount = formatTokenAmount(token.amount, token.decimals);
+	const tokenPrice = formatTokenPrice(token.amount, token.priceUSD, token.decimals);
+	let priceImpact;
+	let priceImpactPercent;
+	if (impactToken) {
+		priceImpact = getPriceImpact({
+			fromToken: impactToken,
+			fromAmount: impactToken.amount,
+			toToken: token,
+			toAmount: token.amount
+		});
+		priceImpactPercent = priceImpact * 100;
+	}
+	const tokenOnChain = !disableDescription ? /* @__PURE__ */ jsx(TextSecondary, { children: t("main.tokenOnChain", {
+		tokenSymbol: token.symbol,
+		chainName: chain?.name
+	}) }) : null;
+	return /* @__PURE__ */ jsxs(Box, {
+		...other,
+		sx: [{
+			flex: 1,
+			display: "flex",
+			alignItems: "center"
+		}, ...Array.isArray(other.sx) ? other.sx : [other.sx]],
+		children: [/* @__PURE__ */ jsx(TokenAvatar, {
+			token,
+			chain,
+			isLoading,
+			sx: { marginRight: 2 }
+		}), /* @__PURE__ */ jsxs(Box, {
+			sx: { flex: 1 },
+			children: [/* @__PURE__ */ jsx(Box, {
+				sx: {
+					mb: .5,
+					height: 24,
+					display: "flex",
+					alignItems: "center"
+				},
+				title: tokenAmount,
+				children: /* @__PURE__ */ jsx(TextFitter, {
+					height: 30,
+					textStyle: { fontWeight: 700 },
+					children: t("format.tokenAmount", { value: tokenAmount })
+				})
+			}), /* @__PURE__ */ jsxs(TextSecondaryContainer, { children: [
+				/* @__PURE__ */ jsx(TextSecondary, { children: t("format.currency", { value: tokenPrice }) }),
+				impactToken ? /* @__PURE__ */ jsx(TextSecondary, {
+					px: .5,
+					dot: true,
+					children: "•"
+				}) : null,
+				impactToken ? enableImpactTokenTooltip ? /* @__PURE__ */ jsx(Tooltip, {
+					title: t("tooltip.priceImpact"),
+					sx: { cursor: "help" },
+					children: /* @__PURE__ */ jsx(TextSecondary, { children: t("format.percent", {
+						value: priceImpact,
+						usePlusSign: true
+					}) })
+				}) : /* @__PURE__ */ jsx(TextSecondary, {
+					title: priceImpactPercent?.toLocaleString(i18n.language, { maximumFractionDigits: 9 }),
+					children: t("format.percent", {
+						value: priceImpact,
+						usePlusSign: true
+					})
+				}) : null,
+				!disableDescription ? /* @__PURE__ */ jsx(TextSecondary, {
+					px: .5,
+					dot: true,
+					children: "•"
+				}) : null,
+				!disableDescription && step ? /* @__PURE__ */ jsx(TokenStep, {
+					step,
+					stepVisible,
+					disableDescription,
+					children: tokenOnChain
+				}) : tokenOnChain
+			] })]
+		})]
+	});
 };
-const TokenStep = ({ step, stepVisible, disableDescription, children, }) => {
-    return (_jsxs(Box, { sx: {
-            flex: 1,
-            position: 'relative',
-            overflow: 'hidden',
-            height: 16,
-        }, children: [_jsx(Grow, { in: !stepVisible && !disableDescription, style: {
-                    position: 'absolute',
-                }, appear: false, timeout: 225, children: _jsx(Box, { sx: {
-                        display: 'flex',
-                        alignItems: 'center',
-                        height: 16,
-                    }, children: children }) }), _jsx(Grow, { in: stepVisible, style: {
-                    position: 'absolute',
-                }, appear: false, timeout: 225, children: _jsxs(Box, { sx: {
-                        display: 'flex',
-                        alignItems: 'center',
-                        height: 16,
-                    }, children: [_jsx(Box, { sx: {
-                                mr: 0.75,
-                                height: 16,
-                            }, children: _jsx(SmallAvatar, { src: step?.toolDetails.logoURI, alt: step?.toolDetails.name, children: step?.toolDetails.name[0] }) }), _jsx(TextSecondary, { children: step?.toolDetails.name })] }) })] }));
+const TokenStep = ({ step, stepVisible, disableDescription, children }) => {
+	return /* @__PURE__ */ jsxs(Box, {
+		sx: {
+			flex: 1,
+			position: "relative",
+			overflow: "hidden",
+			height: 16
+		},
+		children: [/* @__PURE__ */ jsx(Grow, {
+			in: !stepVisible && !disableDescription,
+			style: { position: "absolute" },
+			appear: false,
+			timeout: 225,
+			children: /* @__PURE__ */ jsx(Box, {
+				sx: {
+					display: "flex",
+					alignItems: "center",
+					height: 16
+				},
+				children
+			})
+		}), /* @__PURE__ */ jsx(Grow, {
+			in: stepVisible,
+			style: { position: "absolute" },
+			appear: false,
+			timeout: 225,
+			children: /* @__PURE__ */ jsxs(Box, {
+				sx: {
+					display: "flex",
+					alignItems: "center",
+					height: 16
+				},
+				children: [/* @__PURE__ */ jsx(Box, {
+					sx: {
+						mr: .75,
+						height: 16
+					},
+					children: /* @__PURE__ */ jsx(SmallAvatar, {
+						src: step?.toolDetails.logoURI,
+						alt: step?.toolDetails.name,
+						children: step?.toolDetails.name[0]
+					})
+				}), /* @__PURE__ */ jsx(TextSecondary, { children: step?.toolDetails.name })]
+			})
+		})]
+	});
 };
-export const TokenSkeleton = ({ step, disableDescription, ...other }) => {
-    return (_jsx(Box, { ...other, sx: [
-            {
-                flex: 1,
-            },
-            ...(Array.isArray(other.sx) ? other.sx : [other.sx]),
-        ], children: _jsxs(Box, { sx: {
-                display: 'flex',
-                flex: 1,
-                alignItems: 'center',
-            }, children: [_jsx(AvatarBadgedSkeleton, { sx: { marginRight: 2 } }), _jsxs(Box, { sx: {
-                        flex: 1,
-                    }, children: [_jsx(Skeleton, { width: 112, height: 24, variant: "text" }), _jsxs(TextSecondaryContainer, { as: "span", children: [_jsx(Skeleton, { width: 48, height: 12, variant: "rounded", sx: { marginTop: 0.5 } }), !step && !disableDescription ? (_jsx(Skeleton, { width: 96, height: 12, variant: "rounded", sx: { marginTop: 0.5, marginLeft: 1.5 } })) : null] })] })] }) }));
+const TokenSkeleton = ({ step, disableDescription, ...other }) => {
+	return /* @__PURE__ */ jsx(Box, {
+		...other,
+		sx: [{ flex: 1 }, ...Array.isArray(other.sx) ? other.sx : [other.sx]],
+		children: /* @__PURE__ */ jsxs(Box, {
+			sx: {
+				display: "flex",
+				flex: 1,
+				alignItems: "center"
+			},
+			children: [/* @__PURE__ */ jsx(AvatarBadgedSkeleton, { sx: { marginRight: 2 } }), /* @__PURE__ */ jsxs(Box, {
+				sx: { flex: 1 },
+				children: [/* @__PURE__ */ jsx(Skeleton, {
+					width: 112,
+					height: 28,
+					variant: "text"
+				}), /* @__PURE__ */ jsxs(TextSecondaryContainer, { children: [/* @__PURE__ */ jsx(Skeleton, {
+					width: 48,
+					height: 12,
+					variant: "rounded",
+					sx: { marginTop: .5 }
+				}), !step && !disableDescription ? /* @__PURE__ */ jsx(Skeleton, {
+					width: 96,
+					height: 12,
+					variant: "rounded",
+					sx: {
+						marginTop: .5,
+						marginLeft: 1.5
+					}
+				}) : null] })]
+			})]
+		})
+	});
 };
+//#endregion
+export { Token, TokenSkeleton };
+
 //# sourceMappingURL=Token.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Token.js","sourceRoot":"","sources":["../../../../src/components/Token/Token.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Token.js","names":[],"sources":["../../../../src/components/Token/Token.tsx"],"sourcesContent":["import type { LiFiStep, TokenAmount } from '@lifi/sdk'\nimport type { BoxProps } from '@mui/material'\nimport { Box, Grow, Skeleton, Tooltip } from '@mui/material'\nimport type { FC, PropsWithChildren, ReactElement } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useToken } from '../../hooks/useToken.js'\nimport { formatTokenAmount, formatTokenPrice } from '../../utils/format.js'\nimport { getPriceImpact } from '../../utils/getPriceImpact.js'\nimport { AvatarBadgedSkeleton } from '../Avatar/Avatar.js'\nimport { SmallAvatar } from '../Avatar/SmallAvatar.js'\nimport { TokenAvatar } from '../Avatar/TokenAvatar.js'\nimport { TextFitter } from '../TextFitter/TextFitter.js'\nimport { TextSecondary, TextSecondaryContainer } from './Token.style.js'\n\ninterface TokenProps {\n  token: TokenAmount\n  impactToken?: TokenAmount\n  enableImpactTokenTooltip?: boolean\n  step?: LiFiStep\n  stepVisible?: boolean\n  disableDescription?: boolean\n  isLoading?: boolean\n}\n\nexport const Token: FC<TokenProps & BoxProps> = ({ token, ...other }) => {\n  if (!token.priceUSD || !token.logoURI) {\n    return <TokenFallback token={token} {...other} />\n  }\n  return <TokenBase token={token} {...other} />\n}\n\nconst TokenFallback: FC<TokenProps & BoxProps> = ({\n  token,\n  isLoading,\n  ...other\n}) => {\n  const { token: chainToken, isLoading: isLoadingToken } = useToken(\n    token.chainId,\n    token.address\n  )\n\n  return (\n    <TokenBase\n      token={{ ...token, ...chainToken } as TokenAmount}\n      isLoading={isLoading || isLoadingToken}\n      {...other}\n    />\n  )\n}\n\nconst TokenBase: FC<TokenProps & BoxProps> = ({\n  token,\n  impactToken,\n  enableImpactTokenTooltip,\n  step,\n  stepVisible,\n  disableDescription,\n  isLoading,\n  ...other\n}) => {\n  const { t, i18n } = useTranslation()\n  const { chain } = useChain(token?.chainId)\n\n  if (isLoading) {\n    return (\n      <TokenSkeleton\n        token={token}\n        step={step}\n        disableDescription={disableDescription}\n        {...other}\n      />\n    )\n  }\n\n  const tokenAmount = formatTokenAmount(token.amount, token.decimals)\n  const tokenPrice = formatTokenPrice(\n    token.amount,\n    token.priceUSD,\n    token.decimals\n  )\n\n  let priceImpact: number | undefined\n  let priceImpactPercent: number | undefined\n  if (impactToken) {\n    priceImpact = getPriceImpact({\n      fromToken: impactToken,\n      fromAmount: impactToken.amount,\n      toToken: token,\n      toAmount: token.amount,\n    })\n    priceImpactPercent = priceImpact * 100\n  }\n\n  const tokenOnChain = !disableDescription ? (\n    <TextSecondary>\n      {t('main.tokenOnChain', {\n        tokenSymbol: token.symbol,\n        chainName: chain?.name,\n      })}\n    </TextSecondary>\n  ) : null\n\n  return (\n    <Box\n      {...other}\n      sx={[\n        {\n          flex: 1,\n          display: 'flex',\n          alignItems: 'center',\n        },\n        ...(Array.isArray(other.sx) ? other.sx : [other.sx]),\n      ]}\n    >\n      <TokenAvatar\n        token={token}\n        chain={chain}\n        isLoading={isLoading}\n        sx={{ marginRight: 2 }}\n      />\n      <Box\n        sx={{\n          flex: 1,\n        }}\n      >\n        <Box\n          sx={{\n            mb: 0.5,\n            height: 24,\n            display: 'flex',\n            alignItems: 'center',\n          }}\n          title={tokenAmount}\n        >\n          <TextFitter\n            height={30}\n            textStyle={{\n              fontWeight: 700,\n            }}\n          >\n            {t('format.tokenAmount', {\n              value: tokenAmount,\n            })}\n          </TextFitter>\n        </Box>\n        <TextSecondaryContainer>\n          <TextSecondary>\n            {t('format.currency', {\n              value: tokenPrice,\n            })}\n          </TextSecondary>\n          {impactToken ? (\n            <TextSecondary px={0.5} dot>\n              &#x2022;\n            </TextSecondary>\n          ) : null}\n          {impactToken ? (\n            enableImpactTokenTooltip ? (\n              <Tooltip title={t('tooltip.priceImpact')} sx={{ cursor: 'help' }}>\n                <TextSecondary>\n                  {t('format.percent', {\n                    value: priceImpact,\n                    usePlusSign: true,\n                  })}\n                </TextSecondary>\n              </Tooltip>\n            ) : (\n              <TextSecondary\n                title={priceImpactPercent?.toLocaleString(i18n.language, {\n                  maximumFractionDigits: 9,\n                })}\n              >\n                {t('format.percent', { value: priceImpact, usePlusSign: true })}\n              </TextSecondary>\n            )\n          ) : null}\n          {!disableDescription ? (\n            <TextSecondary px={0.5} dot>\n              &#x2022;\n            </TextSecondary>\n          ) : null}\n          {!disableDescription && step ? (\n            <TokenStep\n              step={step}\n              stepVisible={stepVisible}\n              disableDescription={disableDescription}\n            >\n              {tokenOnChain}\n            </TokenStep>\n          ) : (\n            tokenOnChain\n          )}\n        </TextSecondaryContainer>\n      </Box>\n    </Box>\n  )\n}\n\nconst TokenStep: FC<PropsWithChildren<Partial<TokenProps>>> = ({\n  step,\n  stepVisible,\n  disableDescription,\n  children,\n}) => {\n  return (\n    <Box\n      sx={{\n        flex: 1,\n        position: 'relative',\n        overflow: 'hidden',\n        height: 16,\n      }}\n    >\n      <Grow\n        in={!stepVisible && !disableDescription}\n        style={{\n          position: 'absolute',\n        }}\n        appear={false}\n        timeout={225}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            height: 16,\n          }}\n        >\n          {children as ReactElement}\n        </Box>\n      </Grow>\n      <Grow\n        in={stepVisible}\n        style={{\n          position: 'absolute',\n        }}\n        appear={false}\n        timeout={225}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            height: 16,\n          }}\n        >\n          <Box\n            sx={{\n              mr: 0.75,\n              height: 16,\n            }}\n          >\n            <SmallAvatar\n              src={step?.toolDetails.logoURI}\n              alt={step?.toolDetails.name}\n            >\n              {step?.toolDetails.name[0]}\n            </SmallAvatar>\n          </Box>\n          <TextSecondary>{step?.toolDetails.name}</TextSecondary>\n        </Box>\n      </Grow>\n    </Box>\n  )\n}\n\nexport const TokenSkeleton: FC<Partial<TokenProps> & BoxProps> = ({\n  step,\n  disableDescription,\n  ...other\n}) => {\n  return (\n    <Box\n      {...other}\n      sx={[\n        {\n          flex: 1,\n        },\n        ...(Array.isArray(other.sx) ? other.sx : [other.sx]),\n      ]}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          flex: 1,\n          alignItems: 'center',\n        }}\n      >\n        <AvatarBadgedSkeleton sx={{ marginRight: 2 }} />\n        <Box\n          sx={{\n            flex: 1,\n          }}\n        >\n          <Skeleton width={112} height={28} variant=\"text\" />\n          <TextSecondaryContainer>\n            <Skeleton\n              width={48}\n              height={12}\n              variant=\"rounded\"\n              sx={{ marginTop: 0.5 }}\n            />\n            {!step && !disableDescription ? (\n              <Skeleton\n                width={96}\n                height={12}\n                variant=\"rounded\"\n                sx={{ marginTop: 0.5, marginLeft: 1.5 }}\n              />\n            ) : null}\n          </TextSecondaryContainer>\n        </Box>\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":"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"}

package/dist/esm/components/Token/Token.style.js

@@ -1,34 +1,31 @@
-import { Box, styled, Typography } from '@mui/material';
-export const TextSecondaryContainer = styled(Box)(() => ({
-    display: 'flex',
-    alignItems: 'center',
-    flexWrap: 'wrap',
-    flex: 1,
+import { Box, Typography, styled } from "@mui/material";
+//#region src/components/Token/Token.style.tsx
+const TextSecondaryContainer = styled(Box)(() => ({
+	display: "flex",
+	alignItems: "center",
+	flexWrap: "wrap",
+	flex: 1,
+	height: 16
 }));
-export const TextSecondary = styled(Typography, {
-    shouldForwardProp: (prop) => !['dot'].includes(prop),
-})(({ theme }) => ({
-    fontSize: 12,
-    lineHeight: 1,
-    fontWeight: 500,
-    color: theme.vars.palette.text.secondary,
-    whiteSpace: 'nowrap',
-    variants: [
-        {
-            props: ({ dot }) => dot,
-            style: {
-                color: `rgba(${theme.vars.palette.text.secondaryChannel} / 0.56)`,
-            },
-        },
-    ],
+const TextSecondary = styled(Typography, { shouldForwardProp: (prop) => !["dot"].includes(prop) })(({ theme }) => ({
+	fontSize: 12,
+	lineHeight: 1,
+	fontWeight: 500,
+	color: theme.vars.palette.text.secondary,
+	whiteSpace: "nowrap",
+	variants: [{
+		props: ({ dot }) => dot,
+		style: { color: `rgba(${theme.vars.palette.text.secondaryChannel} / 0.56)` }
+	}]
 }));
-export const TokenDivider = styled(Box)(({ theme }) => ({
-    height: 16,
-    borderLeftWidth: 2,
-    borderLeftStyle: 'solid',
-    borderColor: theme.vars.palette.grey[300],
-    ...theme.applyStyles('dark', {
-        borderColor: theme.vars.palette.grey[800],
-    }),
+styled(Box)(({ theme }) => ({
+	height: 16,
+	borderLeftWidth: 2,
+	borderLeftStyle: "solid",
+	borderColor: theme.vars.palette.grey[300],
+	...theme.applyStyles("dark", { borderColor: theme.vars.palette.grey[800] })
 }));
+//#endregion
+export { TextSecondary, TextSecondaryContainer };
+
 //# sourceMappingURL=Token.style.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Token.style.js","sourceRoot":"","sources":["../../../../src/components/Token/Token.style.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAEvD,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC;IACvD,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,QAAQ,EAAE,MAAM;IAChB,IAAI,EAAE,CAAC;CACR,CAAC,CAAC,CAAA;AAEH,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,UAAU,EAAE;IAC9C,iBAAiB,EAAE,CAAC,IAAY,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;CAC7D,CAAC,CAAoB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACpC,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,CAAC;IACb,UAAU,EAAE,GAAG;IACf,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS;IACxC,UAAU,EAAE,QAAQ;IACpB,QAAQ,EAAE;QACR;YACE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,GAAG;YACvB,KAAK,EAAE;gBACL,KAAK,EAAE,QAAQ,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,gBAAgB,UAAU;aAClE;SACF;KACF;CACF,CAAC,CAAC,CAAA;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACtD,MAAM,EAAE,EAAE;IACV,eAAe,EAAE,CAAC;IAClB,eAAe,EAAE,OAAO;IACxB,WAAW,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;IACzC,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,EAAE;QAC3B,WAAW,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;KAC1C,CAAC;CACH,CAAC,CAAC,CAAA"}
+{"version":3,"file":"Token.style.js","names":[],"sources":["../../../../src/components/Token/Token.style.tsx"],"sourcesContent":["import { Box, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const TextSecondaryContainer: React.FC<\n  React.ComponentProps<typeof Box> & { dot?: boolean }\n> = styled(Box)(() => ({\n  display: 'flex',\n  alignItems: 'center',\n  flexWrap: 'wrap',\n  flex: 1,\n  height: 16,\n}))\n\nexport const TextSecondary: React.FC<\n  React.ComponentProps<typeof Typography> & { dot?: boolean }\n> = styled(Typography, {\n  shouldForwardProp: (prop: string) => !['dot'].includes(prop),\n})<{ dot?: boolean }>(({ theme }) => ({\n  fontSize: 12,\n  lineHeight: 1,\n  fontWeight: 500,\n  color: theme.vars.palette.text.secondary,\n  whiteSpace: 'nowrap',\n  variants: [\n    {\n      props: ({ dot }) => dot,\n      style: {\n        color: `rgba(${theme.vars.palette.text.secondaryChannel} / 0.56)`,\n      },\n    },\n  ],\n}))\n\nexport const TokenDivider: React.FC<React.ComponentProps<typeof Box>> = styled(\n  Box\n)(({ theme }) => ({\n  height: 16,\n  borderLeftWidth: 2,\n  borderLeftStyle: 'solid',\n  borderColor: theme.vars.palette.grey[300],\n  ...theme.applyStyles('dark', {\n    borderColor: theme.vars.palette.grey[800],\n  }),\n}))\n"],"mappings":";;AAGA,MAAa,yBAET,OAAO,IAAI,QAAQ;CACrB,SAAS;CACT,YAAY;CACZ,UAAU;CACV,MAAM;CACN,QAAQ;CACT,EAAE;AAEH,MAAa,gBAET,OAAO,YAAY,EACrB,oBAAoB,SAAiB,CAAC,CAAC,MAAM,CAAC,SAAS,KAAK,EAC7D,CAAC,EAAqB,EAAE,aAAa;CACpC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,YAAY;CACZ,UAAU,CACR;EACE,QAAQ,EAAE,UAAU;EACpB,OAAO,EACL,OAAO,QAAQ,MAAM,KAAK,QAAQ,KAAK,iBAAiB,WACzD;EACF,CACF;CACF,EAAE;AAEqE,OACtE,IACD,EAAE,EAAE,aAAa;CAChB,QAAQ;CACR,iBAAiB;CACjB,iBAAiB;CACjB,aAAa,MAAM,KAAK,QAAQ,KAAK;CACrC,GAAG,MAAM,YAAY,QAAQ,EAC3B,aAAa,MAAM,KAAK,QAAQ,KAAK,MACtC,CAAC;CACH,EAAE"}

package/dist/esm/components/TokenList/PinTokenButton.js

@@ -1,29 +1,36 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import PushPinIcon from '@mui/icons-material/PushPin';
-import PushPinOutlinedIcon from '@mui/icons-material/PushPinOutlined';
-import { IconButton } from '@mui/material';
-import { usePinnedTokensStore } from '../../stores/pinnedTokens/PinnedTokensStore.js';
-export const PinTokenButton = ({ chainId, tokenAddress, }) => {
-    const [pinnedTokens, pinToken, unpinToken] = usePinnedTokensStore((state) => [
-        state.pinnedTokens,
-        state.pinToken,
-        state.unpinToken,
-    ]);
-    const isPinned = pinnedTokens[chainId]?.includes(tokenAddress.toLowerCase()) ?? false;
-    const handleClick = (e) => {
-        e.stopPropagation();
-        e.currentTarget.blur();
-        if (isPinned) {
-            unpinToken(chainId, tokenAddress);
-        }
-        else {
-            pinToken(chainId, tokenAddress);
-        }
-    };
-    const PinIcon = isPinned ? PushPinIcon : PushPinOutlinedIcon;
-    return (_jsx(IconButton, { sx: { width: 20, height: 20 }, size: "small", onClick: handleClick, children: _jsx(PinIcon, { sx: {
-                fontSize: 12,
-                color: isPinned ? 'text.primary' : 'text.secondary',
-            } }) }));
+import { usePinnedTokensStore } from "../../stores/pinnedTokens/PinnedTokensStore.js";
+import { IconButton } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
+import PushPinIcon from "@mui/icons-material/PushPin";
+import PushPinOutlinedIcon from "@mui/icons-material/PushPinOutlined";
+//#region src/components/TokenList/PinTokenButton.tsx
+const PinTokenButton = ({ chainId, tokenAddress }) => {
+	const [pinnedTokens, pinToken, unpinToken] = usePinnedTokensStore((state) => [
+		state.pinnedTokens,
+		state.pinToken,
+		state.unpinToken
+	]);
+	const isPinned = pinnedTokens[chainId]?.includes(tokenAddress.toLowerCase()) ?? false;
+	const handleClick = (e) => {
+		e.stopPropagation();
+		e.currentTarget.blur();
+		if (isPinned) unpinToken(chainId, tokenAddress);
+		else pinToken(chainId, tokenAddress);
+	};
+	return /* @__PURE__ */ jsx(IconButton, {
+		sx: {
+			width: 20,
+			height: 20
+		},
+		size: "small",
+		onClick: handleClick,
+		children: /* @__PURE__ */ jsx(isPinned ? PushPinIcon : PushPinOutlinedIcon, { sx: {
+			fontSize: 12,
+			color: isPinned ? "text.primary" : "text.secondary"
+		} })
+	});
 };
+//#endregion
+export { PinTokenButton };
+
 //# sourceMappingURL=PinTokenButton.js.map

package/dist/esm/components/TokenList/PinTokenButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"PinTokenButton.js","sourceRoot":"","sources":["../../../../src/components/TokenList/PinTokenButton.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,MAAM,6BAA6B,CAAA;AACrD,OAAO,mBAAmB,MAAM,qCAAqC,CAAA;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,gDAAgD,CAAA;AAOrF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,OAAO,EACP,YAAY,GACQ,EAAE,EAAE;IACxB,MAAM,CAAC,YAAY,EAAE,QAAQ,EAAE,UAAU,CAAC,GAAG,oBAAoB,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC;QAC3E,KAAK,CAAC,YAAY;QAClB,KAAK,CAAC,QAAQ;QACd,KAAK,CAAC,UAAU;KACjB,CAAC,CAAA;IAEF,MAAM,QAAQ,GACZ,YAAY,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,YAAY,CAAC,WAAW,EAAE,CAAC,IAAI,KAAK,CAAA;IAEtE,MAAM,WAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;QAC1C,CAAC,CAAC,eAAe,EAAE,CAClB;QAAC,CAAC,CAAC,aAA6B,CAAC,IAAI,EAAE,CAAA;QACxC,IAAI,QAAQ,EAAE,CAAC;YACb,UAAU,CAAC,OAAO,EAAE,YAAY,CAAC,CAAA;QACnC,CAAC;aAAM,CAAC;YACN,QAAQ,CAAC,OAAO,EAAE,YAAY,CAAC,CAAA;QACjC,CAAC;IACH,CAAC,CAAA;IAED,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,mBAAmB,CAAA;IAE5D,OAAO,CACL,KAAC,UAAU,IACT,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAC7B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,WAAW,YAEpB,KAAC,OAAO,IACN,EAAE,EAAE;gBACF,QAAQ,EAAE,EAAE;gBACZ,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,gBAAgB;aACpD,GACD,GACS,CACd,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"PinTokenButton.js","names":[],"sources":["../../../../src/components/TokenList/PinTokenButton.tsx"],"sourcesContent":["import PushPinIcon from '@mui/icons-material/PushPin'\nimport PushPinOutlinedIcon from '@mui/icons-material/PushPinOutlined'\nimport { IconButton } from '@mui/material'\nimport type { JSX } from 'react'\nimport { usePinnedTokensStore } from '../../stores/pinnedTokens/PinnedTokensStore.js'\n\ninterface PinTokenButtonProps {\n  chainId: number\n  tokenAddress: string\n}\n\nexport const PinTokenButton = ({\n  chainId,\n  tokenAddress,\n}: PinTokenButtonProps): JSX.Element => {\n  const [pinnedTokens, pinToken, unpinToken] = usePinnedTokensStore((state) => [\n    state.pinnedTokens,\n    state.pinToken,\n    state.unpinToken,\n  ])\n\n  const isPinned =\n    pinnedTokens[chainId]?.includes(tokenAddress.toLowerCase()) ?? false\n\n  const handleClick = (e: React.MouseEvent) => {\n    e.stopPropagation()\n    ;(e.currentTarget as HTMLElement).blur()\n    if (isPinned) {\n      unpinToken(chainId, tokenAddress)\n    } else {\n      pinToken(chainId, tokenAddress)\n    }\n  }\n\n  const PinIcon = isPinned ? PushPinIcon : PushPinOutlinedIcon\n\n  return (\n    <IconButton\n      sx={{ width: 20, height: 20 }}\n      size=\"small\"\n      onClick={handleClick}\n    >\n      <PinIcon\n        sx={{\n          fontSize: 12,\n          color: isPinned ? 'text.primary' : 'text.secondary',\n        }}\n      />\n    </IconButton>\n  )\n}\n"],"mappings":";;;;;;AAWA,MAAa,kBAAkB,EAC7B,SACA,mBACsC;CACtC,MAAM,CAAC,cAAc,UAAU,cAAc,sBAAsB,UAAU;EAC3E,MAAM;EACN,MAAM;EACN,MAAM;EACP,CAAC;CAEF,MAAM,WACJ,aAAa,UAAU,SAAS,aAAa,aAAa,CAAC,IAAI;CAEjE,MAAM,eAAe,MAAwB;AAC3C,IAAE,iBAAiB;AACjB,IAAE,cAA8B,MAAM;AACxC,MAAI,SACF,YAAW,SAAS,aAAa;MAEjC,UAAS,SAAS,aAAa;;AAMnC,QACE,oBAAC,YAAD;EACE,IAAI;GAAE,OAAO;GAAI,QAAQ;GAAI;EAC7B,MAAK;EACL,SAAS;YAET,oBARY,WAAW,cAAc,qBAQrC,EACE,IAAI;GACF,UAAU;GACV,OAAO,WAAW,iBAAiB;GACpC,EACD,CAAA;EACS,CAAA"}

package/dist/esm/components/TokenList/TokenDetailsSheet.js

@@ -1,24 +1,37 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
-import { BottomSheet } from '../BottomSheet/BottomSheet.js';
-import { TokenDetailsSheetContent } from './TokenDetailsSheetContent.js';
-export const TokenDetailsSheet = forwardRef((_, ref) => {
-    const bottomSheetRef = useRef(null);
-    const [tokenAddress, setTokenAddress] = useState(undefined);
-    const [chainId, setChainId] = useState(undefined);
-    const [withoutContractAddress, setWithoutContractAddress] = useState(false);
-    useImperativeHandle(ref, () => ({
-        isOpen: () => bottomSheetRef.current?.isOpen(),
-        open: (address, noContractAddress, chainId) => {
-            setTokenAddress(address);
-            setWithoutContractAddress(noContractAddress);
-            setChainId(chainId);
-            bottomSheetRef.current?.open();
-        },
-        close: () => {
-            bottomSheetRef.current?.close();
-        },
-    }), []);
-    return (_jsx(BottomSheet, { ref: bottomSheetRef, keepMounted: true, children: _jsx(TokenDetailsSheetContent, { ref: ref, tokenAddress: tokenAddress, withoutContractAddress: withoutContractAddress, chainId: chainId }) }));
+import { BottomSheet } from "../BottomSheet/BottomSheet.js";
+import { TokenDetailsSheetContent } from "./TokenDetailsSheetContent.js";
+import { forwardRef, useImperativeHandle, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/TokenList/TokenDetailsSheet.tsx
+const TokenDetailsSheet = forwardRef((_, ref) => {
+	const bottomSheetRef = useRef(null);
+	const [tokenAddress, setTokenAddress] = useState(void 0);
+	const [chainId, setChainId] = useState(void 0);
+	const [withoutContractAddress, setWithoutContractAddress] = useState(false);
+	useImperativeHandle(ref, () => ({
+		isOpen: () => bottomSheetRef.current?.isOpen(),
+		open: (address, noContractAddress, chainId) => {
+			setTokenAddress(address);
+			setWithoutContractAddress(noContractAddress);
+			setChainId(chainId);
+			bottomSheetRef.current?.open();
+		},
+		close: () => {
+			bottomSheetRef.current?.close();
+		}
+	}), []);
+	return /* @__PURE__ */ jsx(BottomSheet, {
+		ref: bottomSheetRef,
+		keepMounted: true,
+		children: /* @__PURE__ */ jsx(TokenDetailsSheetContent, {
+			ref,
+			tokenAddress,
+			withoutContractAddress,
+			chainId
+		})
+	});
 });
+//#endregion
+export { TokenDetailsSheet };
+
 //# sourceMappingURL=TokenDetailsSheet.js.map

package/dist/esm/components/TokenList/TokenDetailsSheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenDetailsSheet.js","sourceRoot":"","sources":["../../../../src/components/TokenList/TokenDetailsSheet.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzE,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAE3D,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAA;AAGxE,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CAAwB,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;IAC5E,MAAM,cAAc,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAA;IACpD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAC9C,SAAS,CACV,CAAA;IACD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAqB,SAAS,CAAC,CAAA;IACrE,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE3E,mBAAmB,CACjB,GAAG,EACH,GAAG,EAAE,CAAC,CAAC;QACL,MAAM,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE;QAC9C,IAAI,EAAE,CAAC,OAAe,EAAE,iBAA0B,EAAE,OAAe,EAAE,EAAE;YACrE,eAAe,CAAC,OAAO,CAAC,CAAA;YACxB,yBAAyB,CAAC,iBAAiB,CAAC,CAAA;YAC5C,UAAU,CAAC,OAAO,CAAC,CAAA;YACnB,cAAc,CAAC,OAAO,EAAE,IAAI,EAAE,CAAA;QAChC,CAAC;QACD,KAAK,EAAE,GAAG,EAAE;YACV,cAAc,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;QACjC,CAAC;KACF,CAAC,EACF,EAAE,CACH,CAAA;IAED,OAAO,CACL,KAAC,WAAW,IAAC,GAAG,EAAE,cAAc,EAAE,WAAW,kBAC3C,KAAC,wBAAwB,IACvB,GAAG,EAAE,GAAG,EACR,YAAY,EAAE,YAAY,EAC1B,sBAAsB,EAAE,sBAAsB,EAC9C,OAAO,EAAE,OAAO,GAChB,GACU,CACf,CAAA;AACH,CAAC,CAAC,CAAA"}
+{"version":3,"file":"TokenDetailsSheet.js","names":[],"sources":["../../../../src/components/TokenList/TokenDetailsSheet.tsx"],"sourcesContent":["import type React from 'react'\nimport { forwardRef, useImperativeHandle, useRef, useState } from 'react'\nimport { BottomSheet } from '../BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../BottomSheet/types.js'\nimport { TokenDetailsSheetContent } from './TokenDetailsSheetContent.js'\nimport type { TokenDetailsSheetBase } from './types.js'\n\nexport const TokenDetailsSheet: React.ForwardRefExoticComponent<\n  React.RefAttributes<TokenDetailsSheetBase>\n> = forwardRef<TokenDetailsSheetBase>((_, ref) => {\n  const bottomSheetRef = useRef<BottomSheetBase>(null)\n  const [tokenAddress, setTokenAddress] = useState<string | undefined>(\n    undefined\n  )\n  const [chainId, setChainId] = useState<number | undefined>(undefined)\n  const [withoutContractAddress, setWithoutContractAddress] = useState(false)\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      isOpen: () => bottomSheetRef.current?.isOpen(),\n      open: (address: string, noContractAddress: boolean, chainId: number) => {\n        setTokenAddress(address)\n        setWithoutContractAddress(noContractAddress)\n        setChainId(chainId)\n        bottomSheetRef.current?.open()\n      },\n      close: () => {\n        bottomSheetRef.current?.close()\n      },\n    }),\n    []\n  )\n\n  return (\n    <BottomSheet ref={bottomSheetRef} keepMounted>\n      <TokenDetailsSheetContent\n        ref={ref}\n        tokenAddress={tokenAddress}\n        withoutContractAddress={withoutContractAddress}\n        chainId={chainId}\n      />\n    </BottomSheet>\n  )\n})\n"],"mappings":";;;;;AAOA,MAAa,oBAET,YAAmC,GAAG,QAAQ;CAChD,MAAM,iBAAiB,OAAwB,KAAK;CACpD,MAAM,CAAC,cAAc,mBAAmB,SACtC,KAAA,EACD;CACD,MAAM,CAAC,SAAS,cAAc,SAA6B,KAAA,EAAU;CACrE,MAAM,CAAC,wBAAwB,6BAA6B,SAAS,MAAM;AAE3E,qBACE,YACO;EACL,cAAc,eAAe,SAAS,QAAQ;EAC9C,OAAO,SAAiB,mBAA4B,YAAoB;AACtE,mBAAgB,QAAQ;AACxB,6BAA0B,kBAAkB;AAC5C,cAAW,QAAQ;AACnB,kBAAe,SAAS,MAAM;;EAEhC,aAAa;AACX,kBAAe,SAAS,OAAO;;EAElC,GACD,EAAE,CACH;AAED,QACE,oBAAC,aAAD;EAAa,KAAK;EAAgB,aAAA;YAChC,oBAAC,0BAAD;GACO;GACS;GACU;GACf;GACT,CAAA;EACU,CAAA;EAEhB"}