npm - @lifi/widget - Versions diffs - 4.0.0 → 4.1.0 - Mend

@lifi/widget 4.0.0 → 4.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (324) hide show

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

	@@ -1 +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"}
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,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 CHANGED Viewed

	@@ -1 +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"}
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,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 CHANGED Viewed

	@@ -1 +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"}
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,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 CHANGED Viewed

	@@ -1 +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"}
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,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 CHANGED Viewed

	@@ -1 +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"}
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,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 CHANGED Viewed

	@@ -1 +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"}
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,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.map CHANGED Viewed

	@@ -1 +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":";;;;;;;;;;;AA6BA,MAAa,wBAAwB,EACnC,UACA,QACA,gBACA,UACA,iBACA,WACA,kBACA,uBAC4C;CAC5C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,qBAAqB,OAAO,eAAe;CACjD,MAAM,iBAAiB,OAAO,KAAK;CACnC,MAAM,CACJ,cACA,gBACA,eACA,kBACA,mBACE,oBAAoB,UAAU;EAChC,MAAM;EACN,MAAM;EACN,MAAM,GAAG,SAAS;EAClB,MAAM;EACN,MAAM,GAAG,SAAS;CACpB,CAAC;CACD,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,QAAQ,aACX,YAAoB;EACnB,eAAe,OAAO;CACxB,GACA,CAAC,cAAc,CACjB;CAEA,MAAM,eAAe,cAAc;EACjC,IAAI,CAAC,aAAa,QAChB,OAAO;EAGT,MAAM,SAAS,aACZ,KAAK,OAAO,OAAO,MAAM,MAAM,EAAE,OAAO,EAAE,CAAC,EAC3C,OAAO,OAAO;EACjB,MAAM,YAAY,IAAI,IAAI,OAAO,KAAK,MAAM,EAAE,EAAE,CAAC;EACjD,MAAM,OAAO,OAAO,QAAQ,MAAM,CAAC,UAAU,IAAI,EAAE,EAAE,CAAC;EACtD,OAAO,CAAC,GAAG,QAAQ,GAAG,IAAI;CAC5B,GAAG,CAAC,QAAQ,YAAY,CAAC;CAEzB,MAAM,wBAAwB,mBAAmB,CAAC;CAElD,MAAM,aAAa,aAChB,UAAkB;EACjB,IAAI,yBAAyB,UAAU,GACrC,OAAO;EAGT,OAAO,GAAG,aADS,SAAS,wBAAwB,IAAI,IACrB,GAAG,GAAG;CAC3C,GACA,CAAC,cAAc,qBAAqB,CACtC;CAEA,MAAM,gBAAgB,aACnB,UAAyB;EACxB,iBAAiB,OAAO,QAAQ;EAChC,SAAS,KAAK;CAChB,GACA;EAAC;EAAU;EAAkB;CAAQ,CACvC;CAEA,MAAM,EAAE,iBAAiB,cAAc,SAAS,OAAO,sBACrD,eAAe;EACb,OAAO,aAAa,UAAU,wBAAwB,IAAI;EAC1D,UAAU;EACV,YAAY;EACZ,wBAAwB,iBAAiB;EACzC,oBAAoB;GAClB,OAAO,cAAc,UAAU,KAAK;EACtC;EACA;CACF,CAAC;CAMH,gBAAgB;EACd,IAAI,iBAAiB,SACnB,QAAQ;CAEZ,GAAG,CAAC,SAAS,iBAAiB,OAAO,CAAC;CAEtC,MAAM,gBAAgB,aACnB,UAAkB;EACjB,4BAA4B;GAC1B,MAAM,aAAa,kBAAkB,OAAO,QAAQ;GACpD,IAAI,CAAC,iBAAiB,WAAW,CAAC,YAChC;GAEF,iBAAiB,QAAQ,SAAS;IAChC,KAAK,WAAW;IAChB,MAAM;IACN,UAAU;GACZ,CAAC;EACH,CAAC;CACH,GACA,CAAC,mBAAmB,iBAAiB,OAAO,CAC9C;CAEA,gBAAgB;EAEd,IAAI,eAAe;GACjB,eAAe,UAAU;GACzB;EACF;EAGA,IAAI,CAAC,eAAe,WAAW,aAAa,SAAS,KAAK,OAAO;GAC/D,MAAM,qBAAqB,aAAa,WACrC,UAAU,MAAM,OAAO,mBAAmB,OAC7C;GACA,IAAI,uBAAuB;QAIvB,MAAM,aAAa,IAAI,sBACvB,MAAM,WAAW,IAAI,oBAErB,cAAc,kBAAkB;GAAA;GAGpC,eAAe,UAAU;EAC3B;CACF,GAAG;EAAC;EAAc;EAAe;EAAO;CAAa,CAAC;CAEtD,MAAM,oBAAoB,kBAAkB;EAC1C,iBAAiB,MAAM,QAAQ;EAE/B,cAAc,cAAc,YAAY,QAAQ,GAAG,IAAI,EAAE,WAAW,KAAK,CAAC;EAC1E,cAAc,cAAc,YAAY,QAAQ,GAAG,IAAI,EAAE,WAAW,KAAK,CAAC;CAC5E,GAAG;EAAC;EAAkB;EAAU;CAAa,CAAC;CAE9C,OACE,oBAAC,MAAD;EACE,WAAU;EACV,OAAO,EAAE,QAAQ,aAAa,EAAE;EAChC,gBAAA;YAEC,gBAAgB,EAAE,KAAK,SAAS;GAC/B,IAAI,yBAAyB,KAAK,UAAU,GAC1C,OACE,oBAAC,UAAD;IAEE,OAAO;KACL,QAAQ,GAAG,UAAU;KACrB,WAAW,cAAc,KAAK,MAAM;KACpC,SAAS;IACX;cAEA,qBAAC,gBAAD;KACE,SAAS;KACT,UAAU;KACV,MAAM;eAHR,CAKE,oBAAC,gBAAD;MAAgB,MAAM;gBACpB,oBAAC,iBAAD;OAAyB;OAAQ,MAAM;MAAY,CAAA;KACrC,CAAA,GAChB,oBAAC,cAAD;MACE,SAAS,EAAE,kBAAkB;MAC7B,MAAM;KACP,CAAA,CACa;;GACR,GApBH,KAAK,GAoBF;GAId,MAAM,QAAQ,aAAa,KAAK,SAAS,wBAAwB,IAAI;GACrE,OACE,oBAAC,eAAD;IAES;IACP,UAAU;IACV,UAAU,CAAC,iBAAiB,MAAM,OAAO;IAC9B;IACX,MAAM,KAAK;IACX,OAAO,KAAK;IACZ,SAAS;IACT,UAAU,aAAa,SAAS,MAAM,EAAE;IACjC;GACR,GAVM,KAAK,GAUX;EAEL,CAAC;CACG,CAAA;AAEV"}
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":";;;;;;;;;;;AA6BA,MAAa,wBAAwB,EACnC,UACA,QACA,gBACA,UACA,iBACA,WACA,kBACA,uBAC4C;CAC5C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,qBAAqB,OAAO,eAAe;CACjD,MAAM,iBAAiB,OAAO,KAAK;CACnC,MAAM,CACJ,cACA,gBACA,eACA,kBACA,mBACE,oBAAoB,UAAU;EAChC,MAAM;EACN,MAAM;EACN,MAAM,GAAG,SAAS;EAClB,MAAM;EACN,MAAM,GAAG,SAAS;CACpB,CAAC;CACD,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,QAAQ,aACX,YAAoB;EACnB,eAAe,OAAO;CACxB,GACA,CAAC,cAAc,CACjB;CAEA,MAAM,eAAe,cAAc;EACjC,IAAI,CAAC,aAAa,QAChB,OAAO;EAGT,MAAM,SAAS,aACZ,KAAK,OAAO,OAAO,MAAM,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC,CAC5C,OAAO,OAAO;EACjB,MAAM,YAAY,IAAI,IAAI,OAAO,KAAK,MAAM,EAAE,EAAE,CAAC;EACjD,MAAM,OAAO,OAAO,QAAQ,MAAM,CAAC,UAAU,IAAI,EAAE,EAAE,CAAC;EACtD,OAAO,CAAC,GAAG,QAAQ,GAAG,IAAI;CAC5B,GAAG,CAAC,QAAQ,YAAY,CAAC;CAEzB,MAAM,wBAAwB,mBAAmB,CAAC;CAElD,MAAM,aAAa,aAChB,UAAkB;EACjB,IAAI,yBAAyB,UAAU,GACrC,OAAO;EAGT,OAAO,GAAG,aADS,SAAS,wBAAwB,IAAI,GACtB,CAAC,GAAG,GAAG;CAC3C,GACA,CAAC,cAAc,qBAAqB,CACtC;CAEA,MAAM,gBAAgB,aACnB,UAAyB;EACxB,iBAAiB,OAAO,QAAQ;EAChC,SAAS,KAAK;CAChB,GACA;EAAC;EAAU;EAAkB;CAAQ,CACvC;CAEA,MAAM,EAAE,iBAAiB,cAAc,SAAS,OAAO,sBACrD,eAAe;EACb,OAAO,aAAa,UAAU,wBAAwB,IAAI;EAC1D,UAAU;EACV,YAAY;EACZ,wBAAwB,iBAAiB;EACzC,oBAAoB;GAClB,OAAO,cAAc,UAAU,KAAK;EACtC;EACA;CACF,CAAC;CAMH,gBAAgB;EACd,IAAI,iBAAiB,SACnB,QAAQ;CAEZ,GAAG,CAAC,SAAS,iBAAiB,OAAO,CAAC;CAEtC,MAAM,gBAAgB,aACnB,UAAkB;EACjB,4BAA4B;GAC1B,MAAM,aAAa,kBAAkB,OAAO,QAAQ;GACpD,IAAI,CAAC,iBAAiB,WAAW,CAAC,YAChC;GAEF,iBAAiB,QAAQ,SAAS;IAChC,KAAK,WAAW;IAChB,MAAM;IACN,UAAU;GACZ,CAAC;EACH,CAAC;CACH,GACA,CAAC,mBAAmB,iBAAiB,OAAO,CAC9C;CAEA,gBAAgB;EAEd,IAAI,eAAe;GACjB,eAAe,UAAU;GACzB;EACF;EAGA,IAAI,CAAC,eAAe,WAAW,aAAa,SAAS,KAAK,OAAO;GAC/D,MAAM,qBAAqB,aAAa,WACrC,UAAU,MAAM,OAAO,mBAAmB,OAC7C;GACA,IAAI,uBAAuB;QAIvB,MAAM,aAAa,IAAI,sBACvB,MAAM,WAAW,IAAI,oBAErB,cAAc,kBAAkB;GAAA;GAGpC,eAAe,UAAU;EAC3B;CACF,GAAG;EAAC;EAAc;EAAe;EAAO;CAAa,CAAC;CAEtD,MAAM,oBAAoB,kBAAkB;EAC1C,iBAAiB,MAAM,QAAQ;EAE/B,cAAc,cAAc,YAAY,QAAQ,GAAG,IAAI,EAAE,WAAW,KAAK,CAAC;EAC1E,cAAc,cAAc,YAAY,QAAQ,GAAG,IAAI,EAAE,WAAW,KAAK,CAAC;CAC5E,GAAG;EAAC;EAAkB;EAAU;CAAa,CAAC;CAE9C,OACE,oBAAC,MAAD;EACE,WAAU;EACV,OAAO,EAAE,QAAQ,aAAa,EAAE;EAChC,gBAAA;YAEC,gBAAgB,CAAC,CAAC,KAAK,SAAS;GAC/B,IAAI,yBAAyB,KAAK,UAAU,GAC1C,OACE,oBAAC,UAAD;IAEE,OAAO;KACL,QAAQ,GAAG,UAAU;KACrB,WAAW,cAAc,KAAK,MAAM;KACpC,SAAS;IACX;cAEA,qBAAC,gBAAD;KACE,SAAS;KACT,UAAU;KACV,MAAM;eAHR,CAKE,oBAAC,gBAAD;MAAgB,MAAM;gBACpB,oBAAC,iBAAD;OAAyB;OAAQ,MAAM;MAAY,CAAA;KACrC,CAAA,GAChB,oBAAC,cAAD;MACE,SAAS,EAAE,kBAAkB;MAC7B,MAAM;KACP,CAAA,CACa;;GACR,GApBH,KAAK,GAoBF;GAId,MAAM,QAAQ,aAAa,KAAK,SAAS,wBAAwB,IAAI;GACrE,OACE,oBAAC,eAAD;IAES;IACP,UAAU;IACV,UAAU,CAAC,iBAAiB,MAAM,OAAO;IAC9B;IACX,MAAM,KAAK;IACX,OAAO,KAAK;IACZ,SAAS;IACT,UAAU,aAAa,SAAS,MAAM,EAAE;IACjC;GACR,GAVM,KAAK,GAUX;EAEL,CAAC;CACG,CAAA;AAEV"}

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

	@@ -1 +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"}
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,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 CHANGED Viewed

	@@ -1 +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"}
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,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 CHANGED Viewed

	@@ -1 +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"}
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,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"}

package/dist/esm/components/EmptyListIndicator/EmptyListIndicator.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyListIndicator.style.js","names":[],"sources":["../../../../src/components/EmptyListIndicator/EmptyListIndicator.style.tsx"],"sourcesContent":["import { Container, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const EmptyListContainer: React.FC<\n React.ComponentProps<typeof Container>\n> = styled(Container)(({ theme }) => ({\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n paddingTop: theme.spacing(12),\n paddingBottom: theme.spacing(12),\n}))\n\nexport const EmptyListIcon: React.FC<React.ComponentProps<typeof Typography>> =\n styled(Typography)({\n fontSize: 48,\n '& > svg': {\n fontSize: 'inherit',\n },\n })\n\nexport const EmptyListTitle: React.FC<React.ComponentProps<typeof Typography>> =\n styled(Typography)(({ theme }) => ({\n fontSize: 18,\n fontWeight: 700,\n marginTop: theme.spacing(2),\n }))\n\nexport const EmptyListMessage: React.FC<\n React.ComponentProps<typeof Typography>\n> = styled(Typography)(({ theme }) => ({\n fontSize: 14,\n color: theme.vars.palette.text.secondary,\n textAlign: 'center',\n marginTop: theme.spacing(2),\n}))\n"],"mappings":";;AAGA,MAAa,qBAET,OAAO,SAAS,~~GAAG~~,EAAE,aAAa;CACpC,SAAS;CACT,MAAM;CACN,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,YAAY,MAAM,QAAQ,EAAE;CAC5B,eAAe,MAAM,QAAQ,EAAE;AACjC,EAAE;AAEF,MAAa,gBACX,OAAO,UAAU,~~EAAE~~;CACjB,UAAU;CACV,WAAW,EACT,UAAU,UACZ;AACF,CAAC;AAEH,MAAa,iBACX,OAAO,UAAU,~~GAAG~~,EAAE,aAAa;CACjC,UAAU;CACV,YAAY;CACZ,WAAW,MAAM,QAAQ,CAAC;AAC5B,EAAE;AAEJ,MAAa,mBAET,OAAO,UAAU,~~GAAG~~,EAAE,aAAa;CACrC,UAAU;CACV,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,WAAW;CACX,WAAW,MAAM,QAAQ,CAAC;AAC5B,EAAE"}
1	+ {"version":3,"file":"EmptyListIndicator.style.js","names":[],"sources":["../../../../src/components/EmptyListIndicator/EmptyListIndicator.style.tsx"],"sourcesContent":["import { Container, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const EmptyListContainer: React.FC<\n React.ComponentProps<typeof Container>\n> = styled(Container)(({ theme }) => ({\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n paddingTop: theme.spacing(12),\n paddingBottom: theme.spacing(12),\n}))\n\nexport const EmptyListIcon: React.FC<React.ComponentProps<typeof Typography>> =\n styled(Typography)({\n fontSize: 48,\n '& > svg': {\n fontSize: 'inherit',\n },\n })\n\nexport const EmptyListTitle: React.FC<React.ComponentProps<typeof Typography>> =\n styled(Typography)(({ theme }) => ({\n fontSize: 18,\n fontWeight: 700,\n marginTop: theme.spacing(2),\n }))\n\nexport const EmptyListMessage: React.FC<\n React.ComponentProps<typeof Typography>\n> = styled(Typography)(({ theme }) => ({\n fontSize: 14,\n color: theme.vars.palette.text.secondary,\n textAlign: 'center',\n marginTop: theme.spacing(2),\n}))\n"],"mappings":";;AAGA,MAAa,qBAET,OAAO,SAAS,CAAC,EAAE,EAAE,aAAa;CACpC,SAAS;CACT,MAAM;CACN,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,YAAY,MAAM,QAAQ,EAAE;CAC5B,eAAe,MAAM,QAAQ,EAAE;AACjC,EAAE;AAEF,MAAa,gBACX,OAAO,UAAU,CAAC,CAAC;CACjB,UAAU;CACV,WAAW,EACT,UAAU,UACZ;AACF,CAAC;AAEH,MAAa,iBACX,OAAO,UAAU,CAAC,EAAE,EAAE,aAAa;CACjC,UAAU;CACV,YAAY;CACZ,WAAW,MAAM,QAAQ,CAAC;AAC5B,EAAE;AAEJ,MAAa,mBAET,OAAO,UAAU,CAAC,EAAE,EAAE,aAAa;CACrC,UAAU;CACV,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,WAAW;CACX,WAAW,MAAM,QAAQ,CAAC;AAC5B,EAAE"}

package/dist/esm/components/ExecutionStatusCard/StatusIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StatusIcon.js","names":[],"sources":["../../../../src/components/ExecutionStatusCard/StatusIcon.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport type { Transition, Variants } from 'motion/react'\nimport { AnimatePresence } from 'motion/react'\nimport * as m from 'motion/react-m'\nimport type { JSX } from 'react'\nimport type { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { IconCircle } from '../IconCircle/IconCircle.js'\nimport { TimerRing } from '../Timer/StepStatusTimer.js'\nimport type { ExecutionIconKey } from './iconKey.js'\nimport { resolveExecutionIconKey } from './iconKey.js'\nimport { StatusIconContainer } from './StatusIcon.style.js'\n\nconst ICON_EXIT = { duration: 0.08, ease: [0.22, 1, 0.36, 1] as const }\n\nconst iconEnterConfig: Record<\n ExecutionIconKey,\n { initialScale: number; transition: Transition }\n> = {\n success: {\n initialScale: 0.6,\n transition: { type: 'spring', visualDuration: 0.3, bounce: 0.18 },\n },\n warning: {\n initialScale: 0.75,\n transition: { type: 'spring', visualDuration: 0.27, bounce: 0.1 },\n },\n error: {\n initialScale: 0.75,\n transition: { duration: 0.18, ease: [0.22, 1, 0.36, 1] },\n },\n info: {\n initialScale: 0.8,\n transition: { duration: 0.2, ease: [0.22, 1, 0.36, 1] },\n },\n timer: {\n initialScale: 0.85,\n transition: { duration: 0.22, ease: [0.22, 1, 0.36, 1] },\n },\n}\n\nconst iconVariants: Variants = {\n hidden: (key: ExecutionIconKey) => ({\n opacity: 0,\n scale: iconEnterConfig[key].initialScale,\n }),\n visible: (key: ExecutionIconKey) => ({\n opacity: 1,\n scale: 1,\n transition: iconEnterConfig[key].transition,\n }),\n exit: {\n opacity: 0,\n scale: 0.8,\n filter: 'blur(4px)',\n transition: { duration: ICON_EXIT.duration, ease: ICON_EXIT.ease },\n },\n}\n\ninterface StatusIconProps {\n route: RouteExtended\n status: RouteExecutionStatus\n}\n\n/*\n The animated status icon. Each state animates in its own way; they all\n * animate out the same way.\n */\nexport function StatusIcon({ route, status }: StatusIconProps): JSX.Element {\n const iconKey = resolveExecutionIconKey(route, status)\n const step = route.steps.at(-1)\n\n return (\n <StatusIconContainer>\n <AnimatePresence mode=\"popLayout\" initial={false}>\n <m.div\n key={iconKey}\n custom={iconKey}\n variants={iconVariants}\n initial=\"hidden\"\n animate=\"visible\"\n exit=\"exit\"\n style={{\n position: 'absolute',\n inset: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n {iconKey === 'timer' ? (\n <TimerRing step={step} />\n ) : (\n <IconCircle status={iconKey} />\n )}\n </m.div>\n </AnimatePresence>\n </StatusIconContainer>\n )\n}\n"],"mappings":";;;;;;;;AAYA,MAAM,YAAY;CAAE,UAAU;CAAM,MAAM;EAAC;EAAM;EAAG;EAAM;CAAC;AAAW;AAEtE,MAAM,kBAGF;CACF,SAAS;EACP,cAAc;EACd,YAAY;GAAE,MAAM;GAAU,gBAAgB;GAAK,QAAQ;EAAK;CAClE;CACA,SAAS;EACP,cAAc;EACd,YAAY;GAAE,MAAM;GAAU,gBAAgB;GAAM,QAAQ;EAAI;CAClE;CACA,OAAO;EACL,cAAc;EACd,YAAY;GAAE,UAAU;GAAM,MAAM;IAAC;IAAM;IAAG;IAAM;GAAC;EAAE;CACzD;CACA,MAAM;EACJ,cAAc;EACd,YAAY;GAAE,UAAU;GAAK,MAAM;IAAC;IAAM;IAAG;IAAM;GAAC;EAAE;CACxD;CACA,OAAO;EACL,cAAc;EACd,YAAY;GAAE,UAAU;GAAM,MAAM;IAAC;IAAM;IAAG;IAAM;GAAC;EAAE;CACzD;AACF;AAEA,MAAM,eAAyB;CAC7B,SAAS,SAA2B;EAClC,SAAS;EACT,OAAO,gBAAgB,~~KAAK~~;CAC9B;CACA,UAAU,SAA2B;EACnC,SAAS;EACT,OAAO;EACP,YAAY,gBAAgB,~~KAAK~~;CACnC;CACA,MAAM;EACJ,SAAS;EACT,OAAO;EACP,QAAQ;EACR,YAAY;GAAE,UAAU,UAAU;GAAU,MAAM,UAAU;EAAK;CACnE;AACF;;;;;AAWA,SAAgB,WAAW,EAAE,OAAO,UAAwC;CAC1E,MAAM,UAAU,wBAAwB,OAAO,MAAM;CACrD,MAAM,OAAO,MAAM,MAAM,GAAG,EAAE;CAE9B,OACE,oBAAC,qBAAD,EAAA,UACE,oBAAC,iBAAD;EAAiB,MAAK;EAAY,SAAS;YACzC,oBAAC,EAAE,KAAH;GAEE,QAAQ;GACR,UAAU;GACV,SAAQ;GACR,SAAQ;GACR,MAAK;GACL,OAAO;IACL,UAAU;IACV,OAAO;IACP,SAAS;IACT,YAAY;IACZ,gBAAgB;GAClB;aAEC,YAAY,UACX,oBAAC,WAAD,EAAiB,KAAO,CAAA,IAExB,oBAAC,YAAD,EAAY,QAAQ,QAAU,CAAA;EAE3B,GAnBA,OAmBA;CACQ,CAAA,EACE,CAAA;AAEzB"}
1	+ {"version":3,"file":"StatusIcon.js","names":[],"sources":["../../../../src/components/ExecutionStatusCard/StatusIcon.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport type { Transition, Variants } from 'motion/react'\nimport { AnimatePresence } from 'motion/react'\nimport * as m from 'motion/react-m'\nimport type { JSX } from 'react'\nimport type { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { IconCircle } from '../IconCircle/IconCircle.js'\nimport { TimerRing } from '../Timer/StepStatusTimer.js'\nimport type { ExecutionIconKey } from './iconKey.js'\nimport { resolveExecutionIconKey } from './iconKey.js'\nimport { StatusIconContainer } from './StatusIcon.style.js'\n\nconst ICON_EXIT = { duration: 0.08, ease: [0.22, 1, 0.36, 1] as const }\n\nconst iconEnterConfig: Record<\n ExecutionIconKey,\n { initialScale: number; transition: Transition }\n> = {\n success: {\n initialScale: 0.6,\n transition: { type: 'spring', visualDuration: 0.3, bounce: 0.18 },\n },\n warning: {\n initialScale: 0.75,\n transition: { type: 'spring', visualDuration: 0.27, bounce: 0.1 },\n },\n error: {\n initialScale: 0.75,\n transition: { duration: 0.18, ease: [0.22, 1, 0.36, 1] },\n },\n info: {\n initialScale: 0.8,\n transition: { duration: 0.2, ease: [0.22, 1, 0.36, 1] },\n },\n timer: {\n initialScale: 0.85,\n transition: { duration: 0.22, ease: [0.22, 1, 0.36, 1] },\n },\n}\n\nconst iconVariants: Variants = {\n hidden: (key: ExecutionIconKey) => ({\n opacity: 0,\n scale: iconEnterConfig[key].initialScale,\n }),\n visible: (key: ExecutionIconKey) => ({\n opacity: 1,\n scale: 1,\n transition: iconEnterConfig[key].transition,\n }),\n exit: {\n opacity: 0,\n scale: 0.8,\n filter: 'blur(4px)',\n transition: { duration: ICON_EXIT.duration, ease: ICON_EXIT.ease },\n },\n}\n\ninterface StatusIconProps {\n route: RouteExtended\n status: RouteExecutionStatus\n}\n\n/*\n The animated status icon. Each state animates in its own way; they all\n * animate out the same way.\n */\nexport function StatusIcon({ route, status }: StatusIconProps): JSX.Element {\n const iconKey = resolveExecutionIconKey(route, status)\n const step = route.steps.at(-1)\n\n return (\n <StatusIconContainer>\n <AnimatePresence mode=\"popLayout\" initial={false}>\n <m.div\n key={iconKey}\n custom={iconKey}\n variants={iconVariants}\n initial=\"hidden\"\n animate=\"visible\"\n exit=\"exit\"\n style={{\n position: 'absolute',\n inset: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n {iconKey === 'timer' ? (\n <TimerRing step={step} />\n ) : (\n <IconCircle status={iconKey} />\n )}\n </m.div>\n </AnimatePresence>\n </StatusIconContainer>\n )\n}\n"],"mappings":";;;;;;;;AAYA,MAAM,YAAY;CAAE,UAAU;CAAM,MAAM;EAAC;EAAM;EAAG;EAAM;CAAC;AAAW;AAEtE,MAAM,kBAGF;CACF,SAAS;EACP,cAAc;EACd,YAAY;GAAE,MAAM;GAAU,gBAAgB;GAAK,QAAQ;EAAK;CAClE;CACA,SAAS;EACP,cAAc;EACd,YAAY;GAAE,MAAM;GAAU,gBAAgB;GAAM,QAAQ;EAAI;CAClE;CACA,OAAO;EACL,cAAc;EACd,YAAY;GAAE,UAAU;GAAM,MAAM;IAAC;IAAM;IAAG;IAAM;GAAC;EAAE;CACzD;CACA,MAAM;EACJ,cAAc;EACd,YAAY;GAAE,UAAU;GAAK,MAAM;IAAC;IAAM;IAAG;IAAM;GAAC;EAAE;CACxD;CACA,OAAO;EACL,cAAc;EACd,YAAY;GAAE,UAAU;GAAM,MAAM;IAAC;IAAM;IAAG;IAAM;GAAC;EAAE;CACzD;AACF;AAEA,MAAM,eAAyB;CAC7B,SAAS,SAA2B;EAClC,SAAS;EACT,OAAO,gBAAgB,IAAI,CAAC;CAC9B;CACA,UAAU,SAA2B;EACnC,SAAS;EACT,OAAO;EACP,YAAY,gBAAgB,IAAI,CAAC;CACnC;CACA,MAAM;EACJ,SAAS;EACT,OAAO;EACP,QAAQ;EACR,YAAY;GAAE,UAAU,UAAU;GAAU,MAAM,UAAU;EAAK;CACnE;AACF;;;;;AAWA,SAAgB,WAAW,EAAE,OAAO,UAAwC;CAC1E,MAAM,UAAU,wBAAwB,OAAO,MAAM;CACrD,MAAM,OAAO,MAAM,MAAM,GAAG,EAAE;CAE9B,OACE,oBAAC,qBAAD,EAAA,UACE,oBAAC,iBAAD;EAAiB,MAAK;EAAY,SAAS;YACzC,oBAAC,EAAE,KAAH;GAEE,QAAQ;GACR,UAAU;GACV,SAAQ;GACR,SAAQ;GACR,MAAK;GACL,OAAO;IACL,UAAU;IACV,OAAO;IACP,SAAS;IACT,YAAY;IACZ,gBAAgB;GAClB;aAEC,YAAY,UACX,oBAAC,WAAD,EAAiB,KAAO,CAAA,IAExB,oBAAC,YAAD,EAAY,QAAQ,QAAU,CAAA;EAE3B,GAnBA,OAmBA;CACQ,CAAA,EACE,CAAA;AAEzB"}

package/dist/esm/components/ExecutionStatusCard/StatusIcon.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StatusIcon.style.js","names":[],"sources":["../../../../src/components/ExecutionStatusCard/StatusIcon.style.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material'\nimport type React from 'react'\nimport { iconCircleSize } from '../IconCircle/IconCircle.style.js'\n\nexport const StatusIconContainer: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)({\n position: 'relative',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n width: iconCircleSize,\n height: iconCircleSize,\n })\n"],"mappings":";;AAIA,MAAa,sBACX,OAAO,GAAG,~~EAAE~~;CACV,UAAU;CACV,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,OAAA;CACA,QAAA;AACF,CAAC"}
1	+ {"version":3,"file":"StatusIcon.style.js","names":[],"sources":["../../../../src/components/ExecutionStatusCard/StatusIcon.style.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material'\nimport type React from 'react'\nimport { iconCircleSize } from '../IconCircle/IconCircle.style.js'\n\nexport const StatusIconContainer: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)({\n position: 'relative',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n width: iconCircleSize,\n height: iconCircleSize,\n })\n"],"mappings":";;AAIA,MAAa,sBACX,OAAO,GAAG,CAAC,CAAC;CACV,UAAU;CACV,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,OAAA;CACA,QAAA;AACF,CAAC"}

package/dist/esm/components/ExecutionStatusCard/iconKey.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"iconKey.js","names":[],"sources":["../../../../src/components/ExecutionStatusCard/iconKey.ts"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { hasEnumFlag } from '../../utils/enum.js'\n\n/** Visual state of the execution status indicator. /\nexport type ExecutionIconKey =\n \| 'success'\n \| 'warning'\n \| 'error'\n \| 'info'\n \| 'timer'\n\n/* Maps route execution state to an {@link ExecutionIconKey}. Pure function. */\nexport function resolveExecutionIconKey(\n route: RouteExtended,\n status: RouteExecutionStatus\n): ExecutionIconKey {\n if (hasEnumFlag(status, RouteExecutionStatus.Done)) {\n return hasEnumFlag(status, RouteExecutionStatus.Partial) \|\|\n hasEnumFlag(status, RouteExecutionStatus.Refunded)\n ? 'warning'\n : 'success'\n }\n if (hasEnumFlag(status, RouteExecutionStatus.Failed)) {\n return 'error'\n }\n const activeStep =\n route.steps.find(\n (step) =>\n step.execution?.status === 'PENDING' \|\|\n step.execution?.status === 'ACTION_REQUIRED'\n ) ?? route.steps.at(-1)\n if (activeStep?.execution?.status === 'ACTION_REQUIRED') {\n return 'info'\n }\n return 'timer'\n}\n"],"mappings":";;;AAaA,SAAgB,wBACd,OACA,QACkB;CAClB,IAAI,YAAY,QAAA,CAAiC,GAC/C,OAAO,YAAY,QAAA,EAAoC,KACrD,YAAY,QAAA,EAAqC,IAC/C,YACA;CAEN,IAAI,YAAY,QAAA,CAAmC,GACjD,OAAO;CAQT,KALE,MAAM,MAAM,MACT,SACC,KAAK,WAAW,WAAW,aAC3B,KAAK,WAAW,WAAW,iBAC/B,KAAK,MAAM,MAAM,GAAG,EAAE,~~IACR~~,WAAW,WAAW,mBACpC,OAAO;CAET,OAAO;AACT"}
1	+ {"version":3,"file":"iconKey.js","names":[],"sources":["../../../../src/components/ExecutionStatusCard/iconKey.ts"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { hasEnumFlag } from '../../utils/enum.js'\n\n/** Visual state of the execution status indicator. /\nexport type ExecutionIconKey =\n \| 'success'\n \| 'warning'\n \| 'error'\n \| 'info'\n \| 'timer'\n\n/* Maps route execution state to an {@link ExecutionIconKey}. Pure function. */\nexport function resolveExecutionIconKey(\n route: RouteExtended,\n status: RouteExecutionStatus\n): ExecutionIconKey {\n if (hasEnumFlag(status, RouteExecutionStatus.Done)) {\n return hasEnumFlag(status, RouteExecutionStatus.Partial) \|\|\n hasEnumFlag(status, RouteExecutionStatus.Refunded)\n ? 'warning'\n : 'success'\n }\n if (hasEnumFlag(status, RouteExecutionStatus.Failed)) {\n return 'error'\n }\n const activeStep =\n route.steps.find(\n (step) =>\n step.execution?.status === 'PENDING' \|\|\n step.execution?.status === 'ACTION_REQUIRED'\n ) ?? route.steps.at(-1)\n if (activeStep?.execution?.status === 'ACTION_REQUIRED') {\n return 'info'\n }\n return 'timer'\n}\n"],"mappings":";;;AAaA,SAAgB,wBACd,OACA,QACkB;CAClB,IAAI,YAAY,QAAA,CAAiC,GAC/C,OAAO,YAAY,QAAA,EAAoC,KACrD,YAAY,QAAA,EAAqC,IAC/C,YACA;CAEN,IAAI,YAAY,QAAA,CAAmC,GACjD,OAAO;CAQT,KALE,MAAM,MAAM,MACT,SACC,KAAK,WAAW,WAAW,aAC3B,KAAK,WAAW,WAAW,iBAC/B,KAAK,MAAM,MAAM,GAAG,EAAE,EAAA,EACR,WAAW,WAAW,mBACpC,OAAO;CAET,OAAO;AACT"}

package/dist/esm/components/Expansion/Expansion.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Expansion.style.js","names":[],"sources":["../../../../src/components/Expansion/Expansion.style.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const animationDuration = 225\n\nexport const defaultStyle = {\n opacity: 0,\n whiteSpace: 'nowrap',\n transform: 'translateX(-100%)',\n display: 'inline-block',\n position: 'absolute' as const,\n top: 0,\n left: 0,\n transition: `opacity ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1), transform ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,\n}\n\nexport const transitionStyles = {\n entering: {\n opacity: 1,\n transform: 'translateX(0)',\n },\n entered: {\n opacity: 1,\n transform: 'translateX(0)',\n },\n exiting: {\n opacity: 0,\n transform: 'translateX(-100%)',\n },\n exited: {\n opacity: 0,\n transform: 'translateX(-100%)',\n },\n}\n\nexport const ExpansionContainer: React.FC<\n React.ComponentProps<typeof Box> & { width: string \| number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'width',\n})<{ width: string \| number }>(({ width }) => ({\n position: 'relative',\n display: 'flex',\n transition: `width ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,\n width: width,\n marginLeft: width ? '24px' : 0,\n}))\n"],"mappings":";AAKA,MAAa,eAAe;CAC1B,SAAS;CACT,YAAY;CACZ,WAAW;CACX,SAAS;CACT,UAAU;CACV,KAAK;CACL,MAAM;CACN,YAAY;AACd;AAEA,MAAa,mBAAmB;CAC9B,UAAU;EACR,SAAS;EACT,WAAW;CACb;CACA,SAAS;EACP,SAAS;EACT,WAAW;CACb;CACA,SAAS;EACP,SAAS;EACT,WAAW;CACb;CACA,QAAQ;EACN,SAAS;EACT,WAAW;CACb;AACF;AAEA,MAAa,qBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,QACxC,CAAC,~~GAA+B~~,EAAE,aAAa;CAC7C,UAAU;CACV,SAAS;CACT,YAAY;CACL;CACP,YAAY,QAAQ,SAAS;AAC/B,EAAE"}
1	+ {"version":3,"file":"Expansion.style.js","names":[],"sources":["../../../../src/components/Expansion/Expansion.style.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const animationDuration = 225\n\nexport const defaultStyle = {\n opacity: 0,\n whiteSpace: 'nowrap',\n transform: 'translateX(-100%)',\n display: 'inline-block',\n position: 'absolute' as const,\n top: 0,\n left: 0,\n transition: `opacity ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1), transform ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,\n}\n\nexport const transitionStyles = {\n entering: {\n opacity: 1,\n transform: 'translateX(0)',\n },\n entered: {\n opacity: 1,\n transform: 'translateX(0)',\n },\n exiting: {\n opacity: 0,\n transform: 'translateX(-100%)',\n },\n exited: {\n opacity: 0,\n transform: 'translateX(-100%)',\n },\n}\n\nexport const ExpansionContainer: React.FC<\n React.ComponentProps<typeof Box> & { width: string \| number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'width',\n})<{ width: string \| number }>(({ width }) => ({\n position: 'relative',\n display: 'flex',\n transition: `width ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,\n width: width,\n marginLeft: width ? '24px' : 0,\n}))\n"],"mappings":";AAKA,MAAa,eAAe;CAC1B,SAAS;CACT,YAAY;CACZ,WAAW;CACX,SAAS;CACT,UAAU;CACV,KAAK;CACL,MAAM;CACN,YAAY;AACd;AAEA,MAAa,mBAAmB;CAC9B,UAAU;EACR,SAAS;EACT,WAAW;CACb;CACA,SAAS;EACP,SAAS;EACT,WAAW;CACb;CACA,SAAS;EACP,SAAS;EACT,WAAW;CACb;CACA,QAAQ;EACN,SAAS;EACT,WAAW;CACb;AACF;AAEA,MAAa,qBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,QACxC,CAAC,CAAC,EAA8B,EAAE,aAAa;CAC7C,UAAU;CACV,SAAS;CACT,YAAY;CACL;CACP,YAAY,QAAQ,SAAS;AAC/B,EAAE"}

package/dist/esm/components/Header/ActivitiesButton.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActivitiesButton.style.js","names":["MuiIconButton","MuiCircularProgress"],"sources":["../../../../src/components/Header/ActivitiesButton.style.tsx"],"sourcesContent":["import {\n Badge,\n Box,\n CircularProgress as MuiCircularProgress,\n IconButton as MuiIconButton,\n styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const ErrorBadge: React.FC<React.ComponentProps<typeof Badge>> = styled(\n Badge\n)(({ theme }) => ({\n '& .MuiBadge-badge': {\n padding: 0,\n minWidth: 16,\n width: 16,\n height: 16,\n borderRadius: '50%',\n backgroundColor: theme.vars.palette.background.paper,\n boxShadow: `0 0 0 2px ${theme.vars.palette.background.paper}`,\n top: -2,\n left: 10,\n },\n}))\n\nexport const IconContainer: React.FC<React.ComponentProps<typeof Box>> = styled(\n Box\n)(() => ({\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n}))\n\nexport const ActivitiesIconButton: React.FC<\n React.ComponentProps<typeof MuiIconButton> & { active?: boolean }\n> = styled(MuiIconButton, {\n shouldForwardProp: (prop) => prop !== 'active',\n})<{ active?: boolean }>({\n variants: [\n {\n props: { active: true },\n style: ({ theme }) => ({\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 8%, transparent)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 12%, transparent)`,\n },\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 12%, transparent)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 16%, transparent)`,\n },\n }),\n }),\n },\n ],\n})\n\nexport const ProgressTrack: React.FC<\n React.ComponentProps<typeof MuiCircularProgress>\n> = styled(MuiCircularProgress)(({ theme }) => ({\n position: 'absolute',\n color: theme.vars.palette.grey[300],\n ...theme.applyStyles('dark', {\n color: theme.vars.palette.grey[800],\n }),\n}))\n"],"mappings":";;AASA,MAAa,aAA2D,OACtE,KACF,~~GAAG~~,EAAE,aAAa,EAChB,qBAAqB;CACnB,SAAS;CACT,UAAU;CACV,OAAO;CACP,QAAQ;CACR,cAAc;CACd,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,WAAW,aAAa,MAAM,KAAK,QAAQ,WAAW;CACtD,KAAK;CACL,MAAM;AACR,EACF,EAAE;AAEF,MAAa,gBAA4D,OACvE,GACF,~~SAAS~~;CACP,UAAU;CACV,SAAS;CACT,YAAY;CACZ,gBAAgB;AAClB,EAAE;AAEF,MAAa,uBAET,OAAOA,YAAe,EACxB,oBAAoB,SAAS,SAAS,SACxC,CAAC,~~EAAwB~~,EACvB,UAAU,CACR;CACE,OAAO,EAAE,QAAQ,KAAK;CACtB,QAAQ,EAAE,aAAa;EACrB,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK;EACpE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK,oBACtE;EACA,GAAG,MAAM,YAAY,QAAQ;GAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK;GACpE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK,oBACtE;EACF,CAAC;CACH;AACF,CACF,EACF,CAAC;AAED,MAAa,gBAET,OAAOC,gBAAmB,~~GAAG~~,EAAE,aAAa;CAC9C,UAAU;CACV,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,GAAG,MAAM,YAAY,QAAQ,EAC3B,OAAO,MAAM,KAAK,QAAQ,KAAK,KACjC,CAAC;AACH,EAAE"}
1	+ {"version":3,"file":"ActivitiesButton.style.js","names":["MuiIconButton","MuiCircularProgress"],"sources":["../../../../src/components/Header/ActivitiesButton.style.tsx"],"sourcesContent":["import {\n Badge,\n Box,\n CircularProgress as MuiCircularProgress,\n IconButton as MuiIconButton,\n styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const ErrorBadge: React.FC<React.ComponentProps<typeof Badge>> = styled(\n Badge\n)(({ theme }) => ({\n '& .MuiBadge-badge': {\n padding: 0,\n minWidth: 16,\n width: 16,\n height: 16,\n borderRadius: '50%',\n backgroundColor: theme.vars.palette.background.paper,\n boxShadow: `0 0 0 2px ${theme.vars.palette.background.paper}`,\n top: -2,\n left: 10,\n },\n}))\n\nexport const IconContainer: React.FC<React.ComponentProps<typeof Box>> = styled(\n Box\n)(() => ({\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n}))\n\nexport const ActivitiesIconButton: React.FC<\n React.ComponentProps<typeof MuiIconButton> & { active?: boolean }\n> = styled(MuiIconButton, {\n shouldForwardProp: (prop) => prop !== 'active',\n})<{ active?: boolean }>({\n variants: [\n {\n props: { active: true },\n style: ({ theme }) => ({\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 8%, transparent)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 12%, transparent)`,\n },\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 12%, transparent)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.info.main} 16%, transparent)`,\n },\n }),\n }),\n },\n ],\n})\n\nexport const ProgressTrack: React.FC<\n React.ComponentProps<typeof MuiCircularProgress>\n> = styled(MuiCircularProgress)(({ theme }) => ({\n position: 'absolute',\n color: theme.vars.palette.grey[300],\n ...theme.applyStyles('dark', {\n color: theme.vars.palette.grey[800],\n }),\n}))\n"],"mappings":";;AASA,MAAa,aAA2D,OACtE,KACF,CAAC,EAAE,EAAE,aAAa,EAChB,qBAAqB;CACnB,SAAS;CACT,UAAU;CACV,OAAO;CACP,QAAQ;CACR,cAAc;CACd,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,WAAW,aAAa,MAAM,KAAK,QAAQ,WAAW;CACtD,KAAK;CACL,MAAM;AACR,EACF,EAAE;AAEF,MAAa,gBAA4D,OACvE,GACF,CAAC,QAAQ;CACP,UAAU;CACV,SAAS;CACT,YAAY;CACZ,gBAAgB;AAClB,EAAE;AAEF,MAAa,uBAET,OAAOA,YAAe,EACxB,oBAAoB,SAAS,SAAS,SACxC,CAAC,CAAC,CAAuB,EACvB,UAAU,CACR;CACE,OAAO,EAAE,QAAQ,KAAK;CACtB,QAAQ,EAAE,aAAa;EACrB,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK;EACpE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK,oBACtE;EACA,GAAG,MAAM,YAAY,QAAQ;GAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK;GACpE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK,oBACtE;EACF,CAAC;CACH;AACF,CACF,EACF,CAAC;AAED,MAAa,gBAET,OAAOC,gBAAmB,CAAC,EAAE,EAAE,aAAa;CAC9C,UAAU;CACV,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,GAAG,MAAM,YAAY,QAAQ,EAC3B,OAAO,MAAM,KAAK,QAAQ,KAAK,KACjC,CAAC;AACH,EAAE"}

package/dist/esm/components/Header/CloseDrawerButton.js CHANGED Viewed

@@ -13,6 +13,7 @@ const CloseDrawerButton = ({ header }) => {
 		title: t("button.close"),
 		children: /* @__PURE__ */ jsx(IconButton, {
 			size: "medium",
+			"data-testid": "widget-close-drawer-button",
 			onClick: closeDrawer,
 			children: /* @__PURE__ */ jsx(CloseRounded, {})
 		})

package/dist/esm/components/Header/CloseDrawerButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CloseDrawerButton.js","names":[],"sources":["../../../../src/components/Header/CloseDrawerButton.tsx"],"sourcesContent":["import CloseRounded from '@mui/icons-material/CloseRounded'\nimport { IconButton, Tooltip } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useDrawer } from '../../AppDrawerContext.js'\nimport { useExternalWalletProvider } from '../../providers/WalletProvider/useExternalWalletProvider.js'\n\ninterface CloseDrawerButtonProps {\n header?: 'navigation' \| 'wallet'\n}\n\nexport const CloseDrawerButton = ({\n header,\n}: CloseDrawerButtonProps): JSX.Element \| null => {\n const { t } = useTranslation()\n const { closeDrawer } = useDrawer()\n const { useExternalWalletProvidersOnly } = useExternalWalletProvider()\n\n const showInNavigationHeader =\n header === 'navigation' && useExternalWalletProvidersOnly\n\n const showInWalletHeader = header === 'wallet'\n\n return showInNavigationHeader \|\| showInWalletHeader ? (\n <Tooltip title={t('button.close')}>\n <IconButton size=\"medium\" onClick={closeDrawer}>\n <CloseRounded />\n </IconButton>\n </Tooltip>\n ) : null\n}\n"],"mappings":";;;;;;;AAWA,MAAa,qBAAqB,EAChC,aACgD;CAChD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,gBAAgB,UAAU;CAClC,MAAM,EAAE,mCAAmC,0BAA0B;CAOrE,OAJE,WAAW,gBAAgB,kCAEF,WAAW,WAGpC,oBAAC,SAAD;EAAS,OAAO,EAAE,cAAc;YAC9B,oBAAC,YAAD;~~GAAY~~,MAAK;~~GAAS~~,SAAS;~~aACjC~~,oBAAC,cAAD,CAAe,CAAA;EACL,CAAA;CACL,CAAA,IACP;AACN"}
1	+ {"version":3,"file":"CloseDrawerButton.js","names":[],"sources":["../../../../src/components/Header/CloseDrawerButton.tsx"],"sourcesContent":["import CloseRounded from '@mui/icons-material/CloseRounded'\nimport { IconButton, Tooltip } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useDrawer } from '../../AppDrawerContext.js'\nimport { useExternalWalletProvider } from '../../providers/WalletProvider/useExternalWalletProvider.js'\n\ninterface CloseDrawerButtonProps {\n header?: 'navigation' \| 'wallet'\n}\n\nexport const CloseDrawerButton = ({\n header,\n}: CloseDrawerButtonProps): JSX.Element \| null => {\n const { t } = useTranslation()\n const { closeDrawer } = useDrawer()\n const { useExternalWalletProvidersOnly } = useExternalWalletProvider()\n\n const showInNavigationHeader =\n header === 'navigation' && useExternalWalletProvidersOnly\n\n const showInWalletHeader = header === 'wallet'\n\n return showInNavigationHeader \|\| showInWalletHeader ? (\n <Tooltip title={t('button.close')}>\n <IconButton\n size=\"medium\"\n data-testid=\"widget-close-drawer-button\"\n onClick={closeDrawer}\n >\n <CloseRounded />\n </IconButton>\n </Tooltip>\n ) : null\n}\n"],"mappings":";;;;;;;AAWA,MAAa,qBAAqB,EAChC,aACgD;CAChD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,gBAAgB,UAAU;CAClC,MAAM,EAAE,mCAAmC,0BAA0B;CAOrE,OAJE,WAAW,gBAAgB,kCAEF,WAAW,WAGpC,oBAAC,SAAD;EAAS,OAAO,EAAE,cAAc;YAC9B,oBAAC,YAAD;GACE,MAAK;GACL,eAAY;GACZ,SAAS;aAET,oBAAC,cAAD,CAAe,CAAA;EACL,CAAA;CACL,CAAA,IACP;AACN"}

package/dist/esm/components/Header/Header.js CHANGED Viewed

@@ -5,27 +5,24 @@ import { useDefaultElementId } from "../../hooks/useDefaultElementId.js";
 import { Container } from "./Header.style.js";
 import { NavigationHeader } from "./NavigationHeader.js";
 import { WalletHeader } from "./WalletHeader.js";
-import { useLayoutEffect, useRef } from "react";
+import { useCallback } from "react";
 import { useLocation } from "@tanstack/react-router";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Header/Header.tsx
 const HeaderContainer = ({ children }) => {
 	const { pathname } = useLocation();
 	const elementId = useDefaultElementId();
-	const headerRef = useRef(null);
 	const { setHeaderHeight } = useSetHeaderHeight();
-	useLayoutEffect(() => {
+	const headerRef = useCallback((node) => {
+		if (!node) return;
 		const handleHeaderResize = () => {
-			const height = headerRef.current?.getBoundingClientRect().height;
+			const height = node.getBoundingClientRect().height;
 			if (height) setHeaderHeight(height);
 		};
-		let resizeObserver;
-		if (headerRef.current) {
-			resizeObserver = new ResizeObserver(handleHeaderResize);
-			resizeObserver.observe(headerRef.current);
-		}
+		const resizeObserver = new ResizeObserver(handleHeaderResize);
+		resizeObserver.observe(node);
 		return () => {
-			if (resizeObserver) resizeObserver.disconnect();
+			resizeObserver.disconnect();
 		};
 	}, [setHeaderHeight]);
 	return /* @__PURE__ */ jsx(Container, {

package/dist/esm/components/Header/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","names":[],"sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import { useLocation } from '@tanstack/react-router'\nimport type { FC, PropsWithChildren } from 'react'\nimport { ~~useLayoutEffect,~~ ~~useRef~~ } from 'react'\nimport { useDefaultElementId } from '../../hooks/useDefaultElementId.js'\nimport { useSetHeaderHeight } from '../../stores/header/useHeaderStore.js'\nimport { createElementId, ElementId } from '../../utils/elements.js'\nimport { stickyHeaderRoutes } from '../../utils/navigationRoutes.js'\nimport { Container } from './Header.style.js'\nimport { NavigationHeader } from './NavigationHeader.js'\nimport { WalletHeader } from './WalletHeader.js'\n\nconst HeaderContainer: FC<PropsWithChildren> = ({ children }) => {\n const { pathname } = useLocation()\n const elementId = useDefaultElementId()\n const ~~headerRef~~ = ~~useRef<HTMLDivElement>~~(~~null~~)\n ~~const~~ { ~~setHeaderHeight~~ } = ~~useSetHeaderHeight()~~\n\n ~~useLayoutEffect~~(() => {\n const handleHeaderResize = () => {\n const height = ~~headerRef~~.~~current?.~~getBoundingClientRect().height\n\n if (height) {\n setHeaderHeight(height)\n }\n }\n\n ~~let~~ resizeObserver: ~~ResizeObserver\n\n if (headerRef.current) {\n resizeObserver~~ = new ResizeObserver(handleHeaderResize)\n resizeObserver.observe(~~headerRef.current~~)\n }\n\n return () => {\n ~~if (resizeObserver) {\n~~ resizeObserver.disconnect()\n }\n }\n }, [setHeaderHeight])\n\n return (\n <Container\n id={createElementId(ElementId.Header, elementId ?? '')}\n sticky={stickyHeaderRoutes.some((route) => pathname.includes(route))}\n ref={headerRef}\n >\n {children}\n </Container>\n )\n}\n\nexport const Header: FC = () => {\n return (\n <HeaderContainer>\n <WalletHeader />\n <NavigationHeader />\n </HeaderContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;AAWA,MAAM,mBAA0C,EAAE,eAAe;CAC/D,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,YAAY,oBAAoB;CACtC,MAAM,~~YAAY~~,~~OAAuB~~,~~IAAI~~;~~CAC7C~~,MAAM,~~EAAE~~,~~oBAAoB~~,~~mBAAmB~~;~~CAE~~/C,~~sBAAsB~~;~~EACpB~~,MAAM,2BAA2B;GAC/B,MAAM,SAAS,~~UAAU~~,~~SAAS,~~sBAAsB,~~EAAE~~;~~GAE1D~~,IAAI,QACF,gBAAgB,MAAM;EAE1B;EAEA,~~IAAI;EAEJ~~,~~IAAI,UAAU,SAAS;GACrB,~~iBAAiB,IAAI,eAAe,kBAAkB;~~GACtD~~,eAAe,QAAQ,~~UAAU,OAAO~~;~~EAC1C;EAEA~~,aAAa;GACX,~~IAAI,gBACF,~~eAAe,WAAW;~~EAE9B~~;CACF,~~GAAG~~,CAAC,eAAe,~~CAAC~~;~~CAEpB~~,OACE,oBAAC,WAAD;EACE,IAAI,gBAAA,iBAAkC,aAAa,EAAE;EACrD,QAAQ,mBAAmB,MAAM,UAAU,SAAS,SAAS,KAAK,CAAC;EACnE,KAAK;EAEJ;CACQ,CAAA;AAEf;AAEA,MAAa,eAAmB;CAC9B,OACE,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,cAAD,CAAe,CAAA,GACf,oBAAC,kBAAD,CAAmB,CAAA,CACJ,EAAA,CAAA;AAErB"}
1	+ {"version":3,"file":"Header.js","names":[],"sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import { useLocation } from '@tanstack/react-router'\nimport type { FC, PropsWithChildren } from 'react'\nimport { useCallback } from 'react'\nimport { useDefaultElementId } from '../../hooks/useDefaultElementId.js'\nimport { useSetHeaderHeight } from '../../stores/header/useHeaderStore.js'\nimport { createElementId, ElementId } from '../../utils/elements.js'\nimport { stickyHeaderRoutes } from '../../utils/navigationRoutes.js'\nimport { Container } from './Header.style.js'\nimport { NavigationHeader } from './NavigationHeader.js'\nimport { WalletHeader } from './WalletHeader.js'\n\nconst HeaderContainer: FC<PropsWithChildren> = ({ children }) => {\n const { pathname } = useLocation()\n const elementId = useDefaultElementId()\n const { setHeaderHeight } = useSetHeaderHeight()\n\n // React 19 ref cleanup callback: set up the ResizeObserver when the node\n // mounts and tear it down when it unmounts.\n const headerRef = useCallback(\n (node: HTMLDivElement \| null) => {\n if (!node) {\n return\n }\n\n const handleHeaderResize = () => {\n const height = node.getBoundingClientRect().height\n\n if (height) {\n setHeaderHeight(height)\n }\n }\n\n const resizeObserver = new ResizeObserver(handleHeaderResize)\n resizeObserver.observe(node)\n\n return () => {\n resizeObserver.disconnect()\n }\n },\n [setHeaderHeight]\n )\n\n return (\n <Container\n id={createElementId(ElementId.Header, elementId ?? '')}\n sticky={stickyHeaderRoutes.some((route) => pathname.includes(route))}\n ref={headerRef}\n >\n {children}\n </Container>\n )\n}\n\nexport const Header: FC = () => {\n return (\n <HeaderContainer>\n <WalletHeader />\n <NavigationHeader />\n </HeaderContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;AAWA,MAAM,mBAA0C,EAAE,eAAe;CAC/D,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,YAAY,oBAAoB;CACtC,MAAM,EAAE,oBAAoB,mBAAmB;CAI/C,MAAM,YAAY,aACf,SAAgC;EAC/B,IAAI,CAAC,MACH;EAGF,MAAM,2BAA2B;GAC/B,MAAM,SAAS,KAAK,sBAAsB,CAAC,CAAC;GAE5C,IAAI,QACF,gBAAgB,MAAM;EAE1B;EAEA,MAAM,iBAAiB,IAAI,eAAe,kBAAkB;EAC5D,eAAe,QAAQ,IAAI;EAE3B,aAAa;GACX,eAAe,WAAW;EAC5B;CACF,GACA,CAAC,eAAe,CAClB;CAEA,OACE,oBAAC,WAAD;EACE,IAAI,gBAAA,iBAAkC,aAAa,EAAE;EACrD,QAAQ,mBAAmB,MAAM,UAAU,SAAS,SAAS,KAAK,CAAC;EACnE,KAAK;EAEJ;CACQ,CAAA;AAEf;AAEA,MAAa,eAAmB;CAC9B,OACE,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,cAAD,CAAe,CAAA,GACf,oBAAC,kBAAD,CAAmB,CAAA,CACJ,EAAA,CAAA;AAErB"}

package/dist/esm/components/Header/Header.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.style.js","names":["Container"],"sources":["../../../../src/components/Header/Header.style.ts"],"sourcesContent":["import {\n AppBar,\n Avatar,\n Box,\n Button,\n buttonClasses,\n styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { getAvatarMask } from '../Avatar/utils.js'\n\nexport const HeaderAppBar: React.FC<\n React.ComponentProps<typeof AppBar> & { sticky?: boolean }\n> = styled(AppBar)(({ theme }) => ({\n backgroundColor: 'transparent',\n ...theme.applyStyles('dark', {\n backgroundColor: 'transparent',\n }),\n color: theme.vars.palette.text.primary,\n flexDirection: 'row',\n alignItems: 'center',\n position: 'relative',\n}))\n\nexport const Container: React.FC<\n React.ComponentProps<typeof Box> & { sticky?: boolean }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'sticky',\n})<{ sticky?: boolean }>(({ theme, sticky }) => {\n return {\n display: 'flex',\n flexDirection: 'column',\n backgroundColor: theme.vars.palette.background.default,\n position: sticky ? 'sticky' : 'relative',\n top: 0,\n zIndex: 1200,\n gap: theme.spacing(0.5),\n padding: theme.spacing(1.5, 3, 0, 3),\n overflow: 'auto',\n borderRadius: theme.container?.borderRadius ?? 0,\n ...theme.header,\n ...(theme.header?.position === 'fixed'\n ? {\n minWidth: theme.breakpoints.values.xs,\n maxWidth: theme.breakpoints.values.sm,\n width: '100%',\n }\n : {}),\n }\n})\n\nexport const WalletButton: React.FC<\n React.ComponentProps<typeof Button> & { withOffset?: boolean }\n> = styled(Button, {\n shouldForwardProp: (prop) => prop !== 'withOffset',\n})<{ withOffset?: boolean }>(({ withOffset, theme }) => ({\n color: theme.vars.palette.text.primary,\n padding: theme.spacing(1, 1.5),\n maxHeight: 40,\n fontSize: '0.875rem',\n fontWeight: 600,\n borderRadius: `calc(${theme.vars.shape.borderRadius} * 2)`,\n backgroundColor: 'transparent',\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n },\n ...theme.applyStyles('dark', {\n backgroundColor: 'transparent',\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n },\n }),\n [`.${buttonClasses.endIcon} > :nth-of-type(1)`]: {\n fontSize: '24px',\n },\n [`.${buttonClasses.startIcon} > :nth-of-type(1)`]: {\n fontSize: '24px',\n },\n ...(theme.navigation.edge && {\n marginRight: withOffset ? theme.spacing(-1.25) : 0,\n }),\n}))\n\nexport const DrawerWalletContainer: React.FC<\n React.ComponentProps<typeof Box> & { avatarSize?: number; badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n width: '100%',\n display: 'flex',\n justifyContent: 'space-between',\n\n ...(theme.navigation.edge && {\n '& button:first-of-type': {\n marginLeft: theme.spacing(-1),\n },\n '& button:last-of-type': {\n marginRight: theme.spacing(-1.25),\n },\n }),\n}))\n\nexport const HeaderControlsContainer: React.FC<\n React.ComponentProps<typeof Box> & { avatarSize?: number; badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(0.5),\n ...(theme.navigation.edge && {\n '& button:last-of-type': {\n marginRight: theme.spacing(-1.25),\n },\n }),\n}))\n\nexport const WalletAvatar: React.FC<\n React.ComponentProps<typeof Avatar> & {\n avatarSize?: number\n badgeSize?: number\n }\n> = styled(Avatar, {\n shouldForwardProp: (prop) => prop !== 'avatarSize' && prop !== 'badgeSize',\n})<{ avatarSize?: number; badgeSize?: number }>(\n ({ avatarSize = 24, badgeSize = 12 }) => ({\n mask: getAvatarMask(badgeSize),\n width: avatarSize,\n height: avatarSize,\n })\n)\n"],"mappings":";;;AAWA,MAAa,eAET,OAAO,MAAM,~~GAAG~~,EAAE,aAAa;CACjC,iBAAiB;CACjB,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,cACnB,CAAC;CACD,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,eAAe;CACf,YAAY;CACZ,UAAU;AACZ,EAAE;AAEF,MAAaA,cAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,SACxC,CAAC,~~GAAyB~~,EAAE,OAAO,aAAa;CAC9C,OAAO;EACL,SAAS;EACT,eAAe;EACf,iBAAiB,MAAM,KAAK,QAAQ,WAAW;EAC/C,UAAU,SAAS,WAAW;EAC9B,KAAK;EACL,QAAQ;EACR,KAAK,MAAM,QAAQ,EAAG;EACtB,SAAS,MAAM,QAAQ,KAAK,GAAG,GAAG,CAAC;EACnC,UAAU;EACV,cAAc,MAAM,WAAW,gBAAgB;EAC/C,GAAG,MAAM;EACT,GAAI,MAAM,QAAQ,aAAa,UAC3B;GACE,UAAU,MAAM,YAAY,OAAO;GACnC,UAAU,MAAM,YAAY,OAAO;GACnC,OAAO;EACT,IACA,CAAC;CACP;AACF,CAAC;AAED,MAAa,eAET,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,aACxC,CAAC,~~GAA6B~~,EAAE,YAAY,aAAa;CACvD,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,SAAS,MAAM,QAAQ,GAAG,GAAG;CAC7B,WAAW;CACX,UAAU;CACV,YAAY;CACZ,cAAc,QAAQ,MAAM,KAAK,MAAM,aAAa;CACpD,iBAAiB;CACjB,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACA,GAAG,MAAM,YAAY,QAAQ;EAC3B,iBAAiB;EACjB,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACF,CAAC;EACA,IAAI,cAAc,QAAQ,uBAAuB,EAChD,UAAU,OACZ;EACC,IAAI,cAAc,UAAU,uBAAuB,EAClD,UAAU,OACZ;CACA,GAAI,MAAM,WAAW,QAAQ,EAC3B,aAAa,aAAa,MAAM,QAAQ,KAAK,IAAI,EACnD;AACF,EAAE;AAEF,MAAa,wBAET,OAAO,GAAG,~~GAAG~~,EAAE,aAAa;CAC9B,OAAO;CACP,SAAS;CACT,gBAAgB;CAEhB,GAAI,MAAM,WAAW,QAAQ;EAC3B,0BAA0B,EACxB,YAAY,MAAM,QAAQ,EAAE,EAC9B;EACA,yBAAyB,EACvB,aAAa,MAAM,QAAQ,KAAK,EAClC;CACF;AACF,EAAE;AAEF,MAAa,0BAET,OAAO,GAAG,~~GAAG~~,EAAE,aAAa;CAC9B,SAAS;CACT,KAAK,MAAM,QAAQ,EAAG;CACtB,GAAI,MAAM,WAAW,QAAQ,EAC3B,yBAAyB,EACvB,aAAa,MAAM,QAAQ,KAAK,EAClC,EACF;AACF,EAAE;AAEF,MAAa,eAKT,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,gBAAgB,SAAS,YACjE,CAAC,~~GACE~~,EAAE,aAAa,IAAI,YAAY,UAAU;CACxC,MAAM,cAAc,SAAS;CAC7B,OAAO;CACP,QAAQ;AACV,EACF"}
1	+ {"version":3,"file":"Header.style.js","names":["Container"],"sources":["../../../../src/components/Header/Header.style.ts"],"sourcesContent":["import {\n AppBar,\n Avatar,\n Box,\n Button,\n buttonClasses,\n styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { getAvatarMask } from '../Avatar/utils.js'\n\nexport const HeaderAppBar: React.FC<\n React.ComponentProps<typeof AppBar> & { sticky?: boolean }\n> = styled(AppBar)(({ theme }) => ({\n backgroundColor: 'transparent',\n ...theme.applyStyles('dark', {\n backgroundColor: 'transparent',\n }),\n color: theme.vars.palette.text.primary,\n flexDirection: 'row',\n alignItems: 'center',\n position: 'relative',\n}))\n\nexport const Container: React.FC<\n React.ComponentProps<typeof Box> & { sticky?: boolean }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'sticky',\n})<{ sticky?: boolean }>(({ theme, sticky }) => {\n return {\n display: 'flex',\n flexDirection: 'column',\n backgroundColor: theme.vars.palette.background.default,\n position: sticky ? 'sticky' : 'relative',\n top: 0,\n zIndex: 1200,\n gap: theme.spacing(0.5),\n padding: theme.spacing(1.5, 3, 0, 3),\n overflow: 'auto',\n borderRadius: theme.container?.borderRadius ?? 0,\n ...theme.header,\n ...(theme.header?.position === 'fixed'\n ? {\n minWidth: theme.breakpoints.values.xs,\n maxWidth: theme.breakpoints.values.sm,\n width: '100%',\n }\n : {}),\n }\n})\n\nexport const WalletButton: React.FC<\n React.ComponentProps<typeof Button> & { withOffset?: boolean }\n> = styled(Button, {\n shouldForwardProp: (prop) => prop !== 'withOffset',\n})<{ withOffset?: boolean }>(({ withOffset, theme }) => ({\n color: theme.vars.palette.text.primary,\n padding: theme.spacing(1, 1.5),\n maxHeight: 40,\n fontSize: '0.875rem',\n fontWeight: 600,\n borderRadius: `calc(${theme.vars.shape.borderRadius} * 2)`,\n backgroundColor: 'transparent',\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n },\n ...theme.applyStyles('dark', {\n backgroundColor: 'transparent',\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n },\n }),\n [`.${buttonClasses.endIcon} > :nth-of-type(1)`]: {\n fontSize: '24px',\n },\n [`.${buttonClasses.startIcon} > :nth-of-type(1)`]: {\n fontSize: '24px',\n },\n ...(theme.navigation.edge && {\n marginRight: withOffset ? theme.spacing(-1.25) : 0,\n }),\n}))\n\nexport const DrawerWalletContainer: React.FC<\n React.ComponentProps<typeof Box> & { avatarSize?: number; badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n width: '100%',\n display: 'flex',\n justifyContent: 'space-between',\n\n ...(theme.navigation.edge && {\n '& button:first-of-type': {\n marginLeft: theme.spacing(-1),\n },\n '& button:last-of-type': {\n marginRight: theme.spacing(-1.25),\n },\n }),\n}))\n\nexport const HeaderControlsContainer: React.FC<\n React.ComponentProps<typeof Box> & { avatarSize?: number; badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(0.5),\n ...(theme.navigation.edge && {\n '& button:last-of-type': {\n marginRight: theme.spacing(-1.25),\n },\n }),\n}))\n\nexport const WalletAvatar: React.FC<\n React.ComponentProps<typeof Avatar> & {\n avatarSize?: number\n badgeSize?: number\n }\n> = styled(Avatar, {\n shouldForwardProp: (prop) => prop !== 'avatarSize' && prop !== 'badgeSize',\n})<{ avatarSize?: number; badgeSize?: number }>(\n ({ avatarSize = 24, badgeSize = 12 }) => ({\n mask: getAvatarMask(badgeSize),\n width: avatarSize,\n height: avatarSize,\n })\n)\n"],"mappings":";;;AAWA,MAAa,eAET,OAAO,MAAM,CAAC,EAAE,EAAE,aAAa;CACjC,iBAAiB;CACjB,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,cACnB,CAAC;CACD,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,eAAe;CACf,YAAY;CACZ,UAAU;AACZ,EAAE;AAEF,MAAaA,cAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,SACxC,CAAC,CAAC,EAAwB,EAAE,OAAO,aAAa;CAC9C,OAAO;EACL,SAAS;EACT,eAAe;EACf,iBAAiB,MAAM,KAAK,QAAQ,WAAW;EAC/C,UAAU,SAAS,WAAW;EAC9B,KAAK;EACL,QAAQ;EACR,KAAK,MAAM,QAAQ,EAAG;EACtB,SAAS,MAAM,QAAQ,KAAK,GAAG,GAAG,CAAC;EACnC,UAAU;EACV,cAAc,MAAM,WAAW,gBAAgB;EAC/C,GAAG,MAAM;EACT,GAAI,MAAM,QAAQ,aAAa,UAC3B;GACE,UAAU,MAAM,YAAY,OAAO;GACnC,UAAU,MAAM,YAAY,OAAO;GACnC,OAAO;EACT,IACA,CAAC;CACP;AACF,CAAC;AAED,MAAa,eAET,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,aACxC,CAAC,CAAC,EAA4B,EAAE,YAAY,aAAa;CACvD,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,SAAS,MAAM,QAAQ,GAAG,GAAG;CAC7B,WAAW;CACX,UAAU;CACV,YAAY;CACZ,cAAc,QAAQ,MAAM,KAAK,MAAM,aAAa;CACpD,iBAAiB;CACjB,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACA,GAAG,MAAM,YAAY,QAAQ;EAC3B,iBAAiB;EACjB,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,mBAChF;CACF,CAAC;EACA,IAAI,cAAc,QAAQ,uBAAuB,EAChD,UAAU,OACZ;EACC,IAAI,cAAc,UAAU,uBAAuB,EAClD,UAAU,OACZ;CACA,GAAI,MAAM,WAAW,QAAQ,EAC3B,aAAa,aAAa,MAAM,QAAQ,KAAK,IAAI,EACnD;AACF,EAAE;AAEF,MAAa,wBAET,OAAO,GAAG,CAAC,EAAE,EAAE,aAAa;CAC9B,OAAO;CACP,SAAS;CACT,gBAAgB;CAEhB,GAAI,MAAM,WAAW,QAAQ;EAC3B,0BAA0B,EACxB,YAAY,MAAM,QAAQ,EAAE,EAC9B;EACA,yBAAyB,EACvB,aAAa,MAAM,QAAQ,KAAK,EAClC;CACF;AACF,EAAE;AAEF,MAAa,0BAET,OAAO,GAAG,CAAC,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,KAAK,MAAM,QAAQ,EAAG;CACtB,GAAI,MAAM,WAAW,QAAQ,EAC3B,yBAAyB,EACvB,aAAa,MAAM,QAAQ,KAAK,EAClC,EACF;AACF,EAAE;AAEF,MAAa,eAKT,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,gBAAgB,SAAS,YACjE,CAAC,CAAC,EACC,EAAE,aAAa,IAAI,YAAY,UAAU;CACxC,MAAM,cAAc,SAAS;CAC7B,OAAO;CACP,QAAQ;AACV,EACF"}

package/dist/esm/components/Header/HeaderNavigationTabs.js ADDED Viewed

@@ -0,0 +1,26 @@
+import { useNavigationTabsStore } from "../../stores/navigationTabs/useNavigationTabsStore.js";
+import { useNavigationTabLabel } from "../../stores/navigationTabs/useNavigationTabLabel.js";
+import { HeaderTabs } from "./HeaderTabs.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Header/HeaderNavigationTabs.tsx
+const HeaderNavigationTabs = () => {
+	const [tabs, activeTab, setActiveTab] = useNavigationTabsStore((store) => [
+		store.tabs,
+		store.activeTab,
+		store.setActiveTab
+	]);
+	const getLabel = useNavigationTabLabel();
+	if (!tabs.length || !activeTab) return null;
+	return /* @__PURE__ */ jsx(HeaderTabs, {
+		tabs: tabs.map((key) => ({
+			key,
+			label: getLabel(key)
+		})),
+		value: activeTab,
+		onChange: (key) => setActiveTab(key)
+	});
+};
+//#endregion
+export { HeaderNavigationTabs };
+//# sourceMappingURL=HeaderNavigationTabs.js.map

package/dist/esm/components/Header/HeaderNavigationTabs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderNavigationTabs.js","names":[],"sources":["../../../../src/components/Header/HeaderNavigationTabs.tsx"],"sourcesContent":["import type { JSX } from 'react'\nimport { useNavigationTabLabel } from '../../stores/navigationTabs/useNavigationTabLabel.js'\nimport { useNavigationTabsStore } from '../../stores/navigationTabs/useNavigationTabsStore.js'\nimport { HeaderTabs } from './HeaderTabs.js'\n\nexport const HeaderNavigationTabs = (): JSX.Element | null => {\n const [tabs, activeTab, setActiveTab] = useNavigationTabsStore((store) => [\n store.tabs,\n store.activeTab,\n store.setActiveTab,\n ])\n const getLabel = useNavigationTabLabel()\n\n if (!tabs.length || !activeTab) {\n return null\n }\n\n return (\n <HeaderTabs\n tabs={tabs.map((key) => ({ key, label: getLabel(key) }))}\n value={activeTab}\n onChange={(key) => setActiveTab(key)}\n />\n )\n}\n"],"mappings":";;;;;AAKA,MAAa,6BAAiD;CAC5D,MAAM,CAAC,MAAM,WAAW,gBAAgB,wBAAwB,UAAU;EACxE,MAAM;EACN,MAAM;EACN,MAAM;CACR,CAAC;CACD,MAAM,WAAW,sBAAsB;CAEvC,IAAI,CAAC,KAAK,UAAU,CAAC,WACnB,OAAO;CAGT,OACE,oBAAC,YAAD;EACE,MAAM,KAAK,KAAK,SAAS;GAAE;GAAK,OAAO,SAAS,GAAG;EAAE,EAAE;EACvD,OAAO;EACP,WAAW,QAAQ,aAAa,GAAG;CACpC,CAAA;AAEL"}

package/dist/esm/components/Header/HeaderTabs.js ADDED Viewed

@@ -0,0 +1,33 @@
+import { useFieldActions } from "../../stores/form/useFieldActions.js";
+import { NavigationTab, NavigationTabs } from "../Tabs/NavigationTabs.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Header/HeaderTabs.tsx
+/**
+* Presentational header tabs bar shared by split mode and configured
+* navigation tabs.
+* Clears the form fields on switch; the caller supplies the labelled tabs, the
+* active key, and what selecting a key means for its store.
+*/
+const HeaderTabs = ({ tabs, value, onChange }) => {
+	const { setFieldValue } = useFieldActions();
+	const handleChange = (_, key) => {
+		setFieldValue("fromAmount", "");
+		setFieldValue("fromToken", "");
+		setFieldValue("toToken", "");
+		onChange(key);
+	};
+	return /* @__PURE__ */ jsx(NavigationTabs, {
+		value,
+		onChange: handleChange,
+		"aria-label": "tabs",
+		children: tabs.map((tab) => /* @__PURE__ */ jsx(NavigationTab, {
+			value: tab.key,
+			label: tab.label,
+			disableRipple: true
+		}, tab.key))
+	});
+};
+//#endregion
+export { HeaderTabs };
+//# sourceMappingURL=HeaderTabs.js.map

package/dist/esm/components/Header/HeaderTabs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderTabs.js","names":[],"sources":["../../../../src/components/Header/HeaderTabs.tsx"],"sourcesContent":["import type { JSX } from 'react'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { NavigationTab, NavigationTabs } from '../Tabs/NavigationTabs.js'\n\ninterface HeaderTab<K extends string> {\n key: K\n label: string\n}\n\ninterface HeaderTabsProps<K extends string> {\n tabs: HeaderTab<K>[]\n value: K\n onChange: (key: K) => void\n}\n\n/**\n * Presentational header tabs bar shared by split mode and configured\n * navigation tabs.\n * Clears the form fields on switch; the caller supplies the labelled tabs, the\n * active key, and what selecting a key means for its store.\n */\nexport const HeaderTabs = <K extends string>({\n tabs,\n value,\n onChange,\n}: HeaderTabsProps<K>): JSX.Element => {\n const { setFieldValue } = useFieldActions()\n\n const handleChange = (_: React.SyntheticEvent, key: K) => {\n setFieldValue('fromAmount', '')\n setFieldValue('fromToken', '')\n setFieldValue('toToken', '')\n onChange(key)\n }\n\n return (\n <NavigationTabs value={value} onChange={handleChange} aria-label=\"tabs\">\n {tabs.map((tab) => (\n <NavigationTab\n key={tab.key}\n value={tab.key}\n label={tab.label}\n disableRipple\n />\n ))}\n </NavigationTabs>\n )\n}\n"],"mappings":";;;;;;;;;;AAqBA,MAAa,cAAgC,EAC3C,MACA,OACA,eACqC;CACrC,MAAM,EAAE,kBAAkB,gBAAgB;CAE1C,MAAM,gBAAgB,GAAyB,QAAW;EACxD,cAAc,cAAc,EAAE;EAC9B,cAAc,aAAa,EAAE;EAC7B,cAAc,WAAW,EAAE;EAC3B,SAAS,GAAG;CACd;CAEA,OACE,oBAAC,gBAAD;EAAuB;EAAO,UAAU;EAAc,cAAW;YAC9D,KAAK,KAAK,QACT,oBAAC,eAAD;GAEE,OAAO,IAAI;GACX,OAAO,IAAI;GACX,eAAA;EACD,GAJM,IAAI,GAIV,CACF;CACa,CAAA;AAEpB"}

package/dist/esm/components/Header/NavigationHeader.js CHANGED Viewed

@@ -1,26 +1,28 @@
 import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
 import { useHeaderStore } from "../../stores/header/useHeaderStore.js";
 import { backButtonRoutes, navigationRoutes, navigationRoutesValues } from "../../utils/navigationRoutes.js";
+import { useNavigationTabsStore } from "../../stores/navigationTabs/useNavigationTabsStore.js";
 import { HeaderAppBar, HeaderControlsContainer } from "./Header.style.js";
 import { ActivitiesButton } from "./ActivitiesButton.js";
 import { BackButton } from "./BackButton.js";
 import { CloseDrawerButton } from "./CloseDrawerButton.js";
+import { HeaderNavigationTabs } from "./HeaderNavigationTabs.js";
 import { SettingsButton } from "./SettingsButton.js";
-import { SplitNavigationTabs } from "./SplitNavigationTabs.js";
 import { useLocation } from "@tanstack/react-router";
 import { Box, Typography } from "@mui/material";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useAccount } from "@lifi/wallet-management";
 //#region src/components/Header/NavigationHeader.tsx
 const NavigationHeader = () => {
-	const { mode, hiddenUI, variant, defaultUI, modeOptions } = useWidgetConfig();
+	const { hiddenUI, variant, defaultUI } = useWidgetConfig();
+	const navigationTabsCount = useNavigationTabsStore((state) => state.tabs.length);
 	const { account } = useAccount();
 	const [element, title] = useHeaderStore((state) => [state.element, state.title]);
 	const { pathname } = useLocation();
 	const cleanedPathname = pathname.endsWith("/") ? pathname.slice(0, -1) : pathname;
 	const path = cleanedPathname.substring(cleanedPathname.lastIndexOf("/") + 1);
 	const hasPath = navigationRoutesValues.includes(path);
-	const showSplitOptions = mode === "split" && !hasPath && typeof modeOptions?.split !== "string";
+	const showHeaderTabs = !hasPath && navigationTabsCount > 0;
 	return /* @__PURE__ */ jsxs(HeaderAppBar, {
 		elevation: 0,
 		sx: {
@@ -29,12 +31,12 @@ const NavigationHeader = () => {
 		},
 		children: [
 			backButtonRoutes.includes(path) ? /* @__PURE__ */ jsx(BackButton, {}) : null,
-			showSplitOptions ? /* @__PURE__ */ jsx(Box, {
+			showHeaderTabs ? /* @__PURE__ */ jsx(Box, {
 				sx: {
 					flex: 1,
 					marginRight: 1
 				},
-				children: /* @__PURE__ */ jsx(SplitNavigationTabs, {})
+				children: /* @__PURE__ */ jsx(HeaderNavigationTabs, {})
 			}) : /* @__PURE__ */ jsx(Typography, {
 				align: hasPath ? "center" : "left",
 				noWrap: defaultUI?.navigationHeaderTitleNoWrap ?? true,

package/dist/esm/components/Header/NavigationHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationHeader.js","names":[],"sources":["../../../../src/components/Header/NavigationHeader.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { Box, Typography } from '@mui/material'\nimport { useLocation } from '@tanstack/react-router'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useHeaderStore } from '../../stores/header/useHeaderStore.js'\nimport {\n backButtonRoutes,\n navigationRoutes,\n navigationRoutesValues,\n} from '../../utils/navigationRoutes.js'\nimport { ActivitiesButton } from './ActivitiesButton.js'\nimport { BackButton } from './BackButton.js'\nimport { CloseDrawerButton } from './CloseDrawerButton.js'\nimport { HeaderAppBar, HeaderControlsContainer } from './Header.style.js'\nimport { ~~SettingsButton~~ } from './~~SettingsButton~~.js'\nimport { ~~SplitNavigationTabs~~ } from './~~SplitNavigationTabs~~.js'\n\nexport const NavigationHeader: React.FC = () => {\n const { ~~mode,~~ hiddenUI, variant, defaultUI, ~~modeOptions~~ } = useWidgetConfig()\n const { account } = useAccount()\n const [element, title] = useHeaderStore((state) => [\n state.element,\n state.title,\n ])\n const { pathname } = useLocation()\n const cleanedPathname = pathname.endsWith('/')\n ? pathname.slice(0, -1)\n : pathname\n const path = cleanedPathname.substring(cleanedPathname.lastIndexOf('/') + 1)\n const hasPath = navigationRoutesValues.includes(path)\n\n // ~~Show~~ ~~tabs~~ ~~when~~ ~~split~~ is ~~undefined~~ (~~default~~ ~~tabs)~~ or ~~an object with defaultTab~~\n // ~~Hide~~ tabs ~~when~~ ~~split~~ is a ~~string~~ ~~('bridge'~~ or ~~'swap' - single mode)\~~n const ~~showSplitOptions~~ ~~=\n mode~~ ~~=== 'split' &&~~ !hasPath && ~~typeof~~ ~~modeOptions?.split~~ ~~!== 'string'~~\n\n return (\n <HeaderAppBar elevation={0} sx={{ paddingTop: 1, paddingBottom: 0.5 }}>\n {backButtonRoutes.includes(path) ? <BackButton /> : null}\n {~~showSplitOptions~~ ? (\n <Box sx={{ flex: 1, marginRight: 1 }}>\n <~~SplitNavigationTabs~~ />\n </Box>\n ) : (\n <Typography\n align={hasPath ? 'center' : 'left'}\n noWrap={defaultUI?.navigationHeaderTitleNoWrap ?? true}\n sx={{\n fontSize: hasPath ? 18 : 24,\n fontWeight: '700',\n flex: 1,\n }}\n >\n {title}\n </Typography>\n )}\n {pathname === navigationRoutes.home ? (\n <HeaderControlsContainer>\n {account.isConnected && !hiddenUI?.history && <ActivitiesButton />}\n <SettingsButton />\n {variant === 'drawer' && !hiddenUI?.drawerCloseButton ? (\n <CloseDrawerButton header=\"navigation\" />\n ) : null}\n </HeaderControlsContainer>\n ) : (\n element \|\| (\n <Box\n sx={{\n width: 28,\n height: 40,\n }}\n />\n )\n )}\n </HeaderAppBar>\n )\n}\n"],"mappings":"~~;;;;;;;;;;;;;;AAiBA~~,MAAa,yBAAmC;CAC9C,MAAM,EAAE,~~MAAM,~~UAAU,SAAS,~~WAAW~~,gBAAgB,~~gBAAgB~~;~~CAC5E~~,MAAM,EAAE,YAAY,WAAW;CAC/B,MAAM,CAAC,SAAS,SAAS,gBAAgB,UAAU,CACjD,MAAM,SACN,MAAM,KACR,CAAC;CACD,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,kBAAkB,SAAS,SAAS,GAAG,IACzC,SAAS,MAAM,GAAG,EAAE,IACpB;CACJ,MAAM,OAAO,gBAAgB,UAAU,gBAAgB,YAAY,GAAG,IAAI,CAAC;CAC3E,MAAM,UAAU,uBAAuB,SAAS,IAAI;CAIpD,MAAM,~~mBACJ~~,~~SAAS,WAAW,~~CAAC,WAAW,~~OAAO,aAAa,UAAU~~;~~CAEhE~~,OACE,qBAAC,cAAD;EAAc,WAAW;EAAG,IAAI;GAAE,YAAY;GAAG,eAAe;EAAI;YAApE;GACG,iBAAiB,SAAS,IAAI,IAAI,oBAAC,YAAD,CAAa,CAAA,IAAI;GACnD,~~mBACC~~,oBAAC,KAAD;IAAK,IAAI;KAAE,MAAM;KAAG,aAAa;IAAE;cACjC,oBAAC,~~qBAAD~~,~~CAAsB~~,CAAA;~~GACnB~~,CAAA,IAEL,oBAAC,YAAD;IACE,OAAO,UAAU,WAAW;IAC5B,QAAQ,WAAW,+BAA+B;IAClD,IAAI;KACF,UAAU,UAAU,KAAK;KACzB,YAAY;KACZ,MAAM;IACR;cAEC;GACS,CAAA;GAEb,aAAa,iBAAiB,OAC7B,qBAAC,yBAAD,EAAA,UAAA;IACG,QAAQ,eAAe,CAAC,UAAU,WAAW,oBAAC,kBAAD,CAAmB,CAAA;IACjE,oBAAC,gBAAD,CAAiB,CAAA;IAChB,YAAY,YAAY,CAAC,UAAU,oBAClC,oBAAC,mBAAD,EAAmB,QAAO,aAAc,CAAA,IACtC;GACmB,EAAA,CAAA,IAEzB,WACE,oBAAC,KAAD,EACE,IAAI;IACF,OAAO;IACP,QAAQ;GACV,EACD,CAAA;EAGO;;AAElB"}
1	+ {"version":3,"file":"NavigationHeader.js","names":[],"sources":["../../../../src/components/Header/NavigationHeader.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { Box, Typography } from '@mui/material'\nimport { useLocation } from '@tanstack/react-router'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useHeaderStore } from '../../stores/header/useHeaderStore.js'\nimport { useNavigationTabsStore } from '../../stores/navigationTabs/useNavigationTabsStore.js'\nimport {\n backButtonRoutes,\n navigationRoutes,\n navigationRoutesValues,\n} from '../../utils/navigationRoutes.js'\nimport { ActivitiesButton } from './ActivitiesButton.js'\nimport { BackButton } from './BackButton.js'\nimport { CloseDrawerButton } from './CloseDrawerButton.js'\nimport { HeaderAppBar, HeaderControlsContainer } from './Header.style.js'\nimport { HeaderNavigationTabs } from './HeaderNavigationTabs.js'\nimport { SettingsButton } from './SettingsButton.js'\n\nexport const NavigationHeader: React.FC = () => {\n const { hiddenUI, variant, defaultUI } = useWidgetConfig()\n const navigationTabsCount = useNavigationTabsStore(\n (state) => state.tabs.length\n )\n const { account } = useAccount()\n const [element, title] = useHeaderStore((state) => [\n state.element,\n state.title,\n ])\n const { pathname } = useLocation()\n const cleanedPathname = pathname.endsWith('/')\n ? pathname.slice(0, -1)\n : pathname\n const path = cleanedPathname.substring(cleanedPathname.lastIndexOf('/') + 1)\n const hasPath = navigationRoutesValues.includes(path)\n\n // The store resolves which tabs to show (split Swap/Bridge or configured\n // navigation tabs); the header just reflects whether there are any.\n const showHeaderTabs = !hasPath && navigationTabsCount > 0\n\n return (\n <HeaderAppBar elevation={0} sx={{ paddingTop: 1, paddingBottom: 0.5 }}>\n {backButtonRoutes.includes(path) ? <BackButton /> : null}\n {showHeaderTabs ? (\n <Box sx={{ flex: 1, marginRight: 1 }}>\n <HeaderNavigationTabs />\n </Box>\n ) : (\n <Typography\n align={hasPath ? 'center' : 'left'}\n noWrap={defaultUI?.navigationHeaderTitleNoWrap ?? true}\n sx={{\n fontSize: hasPath ? 18 : 24,\n fontWeight: '700',\n flex: 1,\n }}\n >\n {title}\n </Typography>\n )}\n {pathname === navigationRoutes.home ? (\n <HeaderControlsContainer>\n {account.isConnected && !hiddenUI?.history && <ActivitiesButton />}\n <SettingsButton />\n {variant === 'drawer' && !hiddenUI?.drawerCloseButton ? (\n <CloseDrawerButton header=\"navigation\" />\n ) : null}\n </HeaderControlsContainer>\n ) : (\n element \|\| (\n <Box\n sx={{\n width: 28,\n height: 40,\n }}\n />\n )\n )}\n </HeaderAppBar>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAkBA,MAAa,yBAAmC;CAC9C,MAAM,EAAE,UAAU,SAAS,cAAc,gBAAgB;CACzD,MAAM,sBAAsB,wBACzB,UAAU,MAAM,KAAK,MACxB;CACA,MAAM,EAAE,YAAY,WAAW;CAC/B,MAAM,CAAC,SAAS,SAAS,gBAAgB,UAAU,CACjD,MAAM,SACN,MAAM,KACR,CAAC;CACD,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,kBAAkB,SAAS,SAAS,GAAG,IACzC,SAAS,MAAM,GAAG,EAAE,IACpB;CACJ,MAAM,OAAO,gBAAgB,UAAU,gBAAgB,YAAY,GAAG,IAAI,CAAC;CAC3E,MAAM,UAAU,uBAAuB,SAAS,IAAI;CAIpD,MAAM,iBAAiB,CAAC,WAAW,sBAAsB;CAEzD,OACE,qBAAC,cAAD;EAAc,WAAW;EAAG,IAAI;GAAE,YAAY;GAAG,eAAe;EAAI;YAApE;GACG,iBAAiB,SAAS,IAAI,IAAI,oBAAC,YAAD,CAAa,CAAA,IAAI;GACnD,iBACC,oBAAC,KAAD;IAAK,IAAI;KAAE,MAAM;KAAG,aAAa;IAAE;cACjC,oBAAC,sBAAD,CAAuB,CAAA;GACpB,CAAA,IAEL,oBAAC,YAAD;IACE,OAAO,UAAU,WAAW;IAC5B,QAAQ,WAAW,+BAA+B;IAClD,IAAI;KACF,UAAU,UAAU,KAAK;KACzB,YAAY;KACZ,MAAM;IACR;cAEC;GACS,CAAA;GAEb,aAAa,iBAAiB,OAC7B,qBAAC,yBAAD,EAAA,UAAA;IACG,QAAQ,eAAe,CAAC,UAAU,WAAW,oBAAC,kBAAD,CAAmB,CAAA;IACjE,oBAAC,gBAAD,CAAiB,CAAA;IAChB,YAAY,YAAY,CAAC,UAAU,oBAClC,oBAAC,mBAAD,EAAmB,QAAO,aAAc,CAAA,IACtC;GACmB,EAAA,CAAA,IAEzB,WACE,oBAAC,KAAD,EACE,IAAI;IACF,OAAO;IACP,QAAQ;GACV,EACD,CAAA;EAGO;;AAElB"}