@lifi/widget 3.26.0 → 3.26.1

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 (42) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/esm/components/Chains/ChainsExpanded.d.ts +1 -1
  3. package/dist/esm/components/Chains/ChainsExpanded.js +3 -2
  4. package/dist/esm/components/Chains/ChainsExpanded.js.map +1 -1
  5. package/dist/esm/components/Chains/ChainsExpanded.style.js +1 -2
  6. package/dist/esm/components/Chains/ChainsExpanded.style.js.map +1 -1
  7. package/dist/esm/components/Chains/SelectChainContent.d.ts +1 -1
  8. package/dist/esm/components/Chains/SelectChainContent.js +3 -2
  9. package/dist/esm/components/Chains/SelectChainContent.js.map +1 -1
  10. package/dist/esm/components/Expansion/Expansion.js +5 -16
  11. package/dist/esm/components/Expansion/Expansion.js.map +1 -1
  12. package/dist/esm/components/Expansion/Expansion.style.d.ts +32 -0
  13. package/dist/esm/components/Expansion/Expansion.style.js +40 -0
  14. package/dist/esm/components/Expansion/Expansion.style.js.map +1 -0
  15. package/dist/esm/components/Expansion/ExpansionTransition.d.ts +0 -1
  16. package/dist/esm/components/Expansion/ExpansionTransition.js +1 -30
  17. package/dist/esm/components/Expansion/ExpansionTransition.js.map +1 -1
  18. package/dist/esm/components/Routes/RoutesContent.d.ts +2 -3
  19. package/dist/esm/components/Routes/RoutesContent.js +5 -21
  20. package/dist/esm/components/Routes/RoutesContent.js.map +1 -1
  21. package/dist/esm/components/Routes/RoutesExpanded.d.ts +2 -3
  22. package/dist/esm/components/Routes/RoutesExpanded.js +24 -8
  23. package/dist/esm/components/Routes/RoutesExpanded.js.map +1 -1
  24. package/dist/esm/components/Routes/RoutesExpanded.style.js +1 -2
  25. package/dist/esm/components/Routes/RoutesExpanded.style.js.map +1 -1
  26. package/dist/esm/config/version.d.ts +1 -1
  27. package/dist/esm/config/version.js +1 -1
  28. package/dist/esm/hooks/useRoutes.js +32 -4
  29. package/dist/esm/hooks/useRoutes.js.map +1 -1
  30. package/package.json +5 -5
  31. package/package.json.tmp +4 -4
  32. package/src/components/Chains/ChainsExpanded.style.tsx +1 -2
  33. package/src/components/Chains/ChainsExpanded.tsx +6 -2
  34. package/src/components/Chains/SelectChainContent.tsx +81 -82
  35. package/src/components/Expansion/Expansion.style.tsx +43 -0
  36. package/src/components/Expansion/Expansion.tsx +8 -23
  37. package/src/components/Expansion/ExpansionTransition.tsx +5 -33
  38. package/src/components/Routes/RoutesContent.tsx +8 -29
  39. package/src/components/Routes/RoutesExpanded.style.ts +1 -2
  40. package/src/components/Routes/RoutesExpanded.tsx +33 -13
  41. package/src/config/version.ts +1 -1
  42. package/src/hooks/useRoutes.ts +68 -33
package/CHANGELOG.md CHANGED
@@ -2,6 +2,13 @@
2
2
 
3
3
  All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
4
4
 
5
+ ### [3.26.1](https://github.com/lifinance/widget/compare/v3.26.0...v3.26.1) (2025-08-06)
6
+
7
+
8
+ ### Bug Fixes
9
+
10
+ * revert container fallbacks ([#501](https://github.com/lifinance/widget/issues/501)) ([147647b](https://github.com/lifinance/widget/commit/147647be64910b920d45e0e000f30fa3eaf6c82e))
11
+
5
12
  ## [3.26.0](https://github.com/lifinance/widget/compare/v3.25.0...v3.26.0) (2025-08-05)
6
13
 
7
14
 
@@ -3,5 +3,5 @@ interface ChainsExpandedProps {
3
3
  formType: FormType;
4
4
  open: boolean;
5
5
  }
6
- export declare const ChainsExpanded: ({ formType, open }: ChainsExpandedProps) => import("react/jsx-runtime").JSX.Element;
6
+ export declare const ChainsExpanded: import("react").NamedExoticComponent<ChainsExpandedProps>;
7
7
  export {};
@@ -1,11 +1,12 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { memo } from 'react';
2
3
  import { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider';
3
4
  import { getWidgetMaxHeight } from '../../utils/widgetSize';
4
5
  import { ExpansionTransition } from '../Expansion/ExpansionTransition';
5
6
  import { chainExpansionWidth, SelectChainExpansionContainer, } from './ChainsExpanded.style';
6
7
  import { SelectChainContent } from './SelectChainContent';
7
- export const ChainsExpanded = ({ formType, open }) => {
8
+ export const ChainsExpanded = memo(function ChainsExpanded({ formType, open, }) {
8
9
  const { theme } = useWidgetConfig();
9
10
  return (_jsx(ExpansionTransition, { in: open, width: chainExpansionWidth, children: _jsx(SelectChainExpansionContainer, { expansionHeight: getWidgetMaxHeight(theme), children: _jsx(SelectChainContent, { inExpansion: true, formType: formType }) }) }));
10
- };
11
+ });
11
12
  //# sourceMappingURL=ChainsExpanded.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ChainsExpanded.js","sourceRoot":"","sources":["../../../../src/components/Chains/ChainsExpanded.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,+CAA+C,CAAA;AAE/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAA;AACtE,OAAO,EACL,mBAAmB,EACnB,6BAA6B,GAC9B,MAAM,wBAAwB,CAAA;AAC/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAOzD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAuB,EAAE,EAAE;IACxE,MAAM,EAAE,KAAK,EAAE,GAAG,eAAe,EAAE,CAAA;IAEnC,OAAO,CACL,KAAC,mBAAmB,IAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,mBAAmB,YACvD,KAAC,6BAA6B,IAC5B,eAAe,EAAE,kBAAkB,CAAC,KAAK,CAAC,YAE1C,KAAC,kBAAkB,IAAC,WAAW,QAAC,QAAQ,EAAE,QAAQ,GAAI,GACxB,GACZ,CACvB,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"ChainsExpanded.js","sourceRoot":"","sources":["../../../../src/components/Chains/ChainsExpanded.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,+CAA+C,CAAA;AAE/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAA;AACtE,OAAO,EACL,mBAAmB,EACnB,6BAA6B,GAC9B,MAAM,wBAAwB,CAAA;AAC/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAOzD,MAAM,CAAC,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,cAAc,CAAC,EACzD,QAAQ,EACR,IAAI,GACgB;IACpB,MAAM,EAAE,KAAK,EAAE,GAAG,eAAe,EAAE,CAAA;IAEnC,OAAO,CACL,KAAC,mBAAmB,IAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,mBAAmB,YACvD,KAAC,6BAA6B,IAC5B,eAAe,EAAE,kBAAkB,CAAC,KAAK,CAAC,YAE1C,KAAC,kBAAkB,IAAC,WAAW,QAAC,QAAQ,EAAE,QAAQ,GAAI,GACxB,GACZ,CACvB,CAAA;AACH,CAAC,CAAC,CAAA"}
@@ -3,14 +3,13 @@ export const chainExpansionWidth = '256px';
3
3
  export const SelectChainExpansionContainer = styled(Box, {
4
4
  shouldForwardProp: (prop) => prop !== 'expansionHeight',
5
5
  })(({ theme, expansionHeight }) => ({
6
+ ...theme.container,
6
7
  position: 'relative',
7
8
  boxSizing: 'content-box',
8
9
  width: chainExpansionWidth,
9
10
  background: theme.vars.palette.background.default,
10
11
  overflow: 'hidden',
11
12
  flex: 1,
12
- borderRadius: theme.container?.borderRadius ?? 0,
13
- boxShadow: theme.container?.boxShadow ?? 'none',
14
13
  zIndex: 0,
15
14
  height: expansionHeight,
16
15
  ...theme.chainSidebarContainer,
@@ -1 +1 @@
1
- {"version":3,"file":"ChainsExpanded.style.js","sourceRoot":"","sources":["../../../../src/components/Chains/ChainsExpanded.style.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAE3C,MAAM,CAAC,MAAM,mBAAmB,GAAG,OAAO,CAAA;AAM1C,MAAM,CAAC,MAAM,6BAA6B,GAAG,MAAM,CAAC,GAAG,EAAE;IACvD,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,KAAK,iBAAiB;CACxD,CAAC,CAAqC,CAAC,EAAE,KAAK,EAAE,eAAe,EAAE,EAAE,EAAE,CAAC,CAAC;IACtE,QAAQ,EAAE,UAAU;IACpB,SAAS,EAAE,aAAa;IACxB,KAAK,EAAE,mBAAmB;IAC1B,UAAU,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;IACjD,QAAQ,EAAE,QAAQ;IAClB,IAAI,EAAE,CAAC;IACP,YAAY,EAAE,KAAK,CAAC,SAAS,EAAE,YAAY,IAAI,CAAC;IAChD,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,SAAS,IAAI,MAAM;IAC/C,MAAM,EAAE,CAAC;IACT,MAAM,EAAE,eAAe;IACvB,GAAG,KAAK,CAAC,qBAAqB;CAC/B,CAAC,CAAC,CAAA"}
1
+ {"version":3,"file":"ChainsExpanded.style.js","sourceRoot":"","sources":["../../../../src/components/Chains/ChainsExpanded.style.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAE3C,MAAM,CAAC,MAAM,mBAAmB,GAAG,OAAO,CAAA;AAM1C,MAAM,CAAC,MAAM,6BAA6B,GAAG,MAAM,CAAC,GAAG,EAAE;IACvD,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,KAAK,iBAAiB;CACxD,CAAC,CAAqC,CAAC,EAAE,KAAK,EAAE,eAAe,EAAE,EAAE,EAAE,CAAC,CAAC;IACtE,GAAG,KAAK,CAAC,SAAS;IAClB,QAAQ,EAAE,UAAU;IACpB,SAAS,EAAE,aAAa;IACxB,KAAK,EAAE,mBAAmB;IAC1B,UAAU,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;IACjD,QAAQ,EAAE,QAAQ;IAClB,IAAI,EAAE,CAAC;IACP,MAAM,EAAE,CAAC;IACT,MAAM,EAAE,eAAe;IACvB,GAAG,KAAK,CAAC,qBAAqB;CAC/B,CAAC,CAAC,CAAA"}
@@ -5,5 +5,5 @@ interface SelectChainContentProps {
5
5
  onSelect?: (chain: ExtendedChain) => void;
6
6
  inExpansion: boolean;
7
7
  }
8
- export declare const SelectChainContent: React.FC<SelectChainContentProps>;
8
+ export declare const SelectChainContent: import("react").NamedExoticComponent<SelectChainContentProps>;
9
9
  export {};
@@ -11,7 +11,7 @@ import { FullPageContainer } from '../FullPageContainer';
11
11
  import { ChainList } from './ChainList';
12
12
  import { ChainSearchInput } from './ChainSearchInput';
13
13
  const searchHeaderHeight = '80px';
14
- export const SelectChainContent = memo(({ formType, onSelect, inExpansion }) => {
14
+ export const SelectChainContent = memo(function SelectChainContent({ formType, onSelect, inExpansion, }) {
15
15
  const theme = useTheme();
16
16
  const { chains, isLoading, setCurrentChain } = useChainSelect(formType);
17
17
  const elementId = useDefaultElementId();
@@ -23,7 +23,8 @@ export const SelectChainContent = memo(({ formType, onSelect, inExpansion }) =>
23
23
  const filteredChains = useMemo(() => {
24
24
  const value = debouncedSearchValue.toLowerCase();
25
25
  return value
26
- ? (chains?.filter((chain) => chain.name.toLowerCase().includes(value)) ?? [])
26
+ ? (chains?.filter((chain) => chain.name.toLowerCase().includes(value)) ??
27
+ [])
27
28
  : (chains ?? []);
28
29
  }, [chains, debouncedSearchValue]);
29
30
  const scrollToTop = useCallback(() => {
@@ -1 +1 @@
1
- {"version":3,"file":"SelectChainContent.js","sourceRoot":"","sources":["../../../../src/components/Chains/SelectChainContent.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"SelectChainContent.js","sourceRoot":"","sources":["../../../../src/components/Chains/SelectChainContent.tsx"],"names":[],"mappings":"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"}
@@ -1,40 +1,29 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Box } from '@mui/material';
3
- import { useCallback, useMemo, useRef, useState } from 'react';
2
+ import { useMemo, useRef, useState } from 'react';
4
3
  import { useHasChainExpansion } from '../../hooks/useHasChainExpansion';
5
4
  import { ExpansionType } from '../../types/widget';
6
5
  import { ChainsExpanded } from '../Chains/ChainsExpanded';
7
6
  import { chainExpansionWidth } from '../Chains/ChainsExpanded.style';
8
7
  import { RoutesExpanded } from '../Routes/RoutesExpanded';
9
8
  import { routesExpansionWidth } from '../Routes/RoutesExpanded.style';
10
- import { animationDuration } from './ExpansionTransition';
9
+ import { ExpansionContainer } from './Expansion.style';
11
10
  export function Expansion() {
12
11
  const [withChainExpansion, expansionType] = useHasChainExpansion();
13
12
  const chainExpansionTypeRef = useRef(expansionType);
14
13
  const [routesOpen, setRoutesOpen] = useState(false);
15
- const handleSetRoutesOpen = useCallback((open) => {
16
- setRoutesOpen(open);
17
- }, []);
18
14
  // Track the previous chain expansion type to avoid re-renders when transitioning to Routes
19
15
  if (expansionType === ExpansionType.FromChain ||
20
16
  expansionType === ExpansionType.ToChain) {
21
17
  chainExpansionTypeRef.current = expansionType;
22
18
  }
23
- const boxWidth = useMemo(() => {
19
+ const containerWidth = useMemo(() => {
24
20
  return routesOpen
25
21
  ? routesExpansionWidth
26
22
  : withChainExpansion
27
23
  ? chainExpansionWidth
28
- : '0px';
24
+ : 0;
29
25
  }, [routesOpen, withChainExpansion]);
30
- return (_jsxs(Box, { sx: {
31
- position: 'relative',
32
- display: 'flex',
33
- transition: `width ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,
34
- width: boxWidth,
35
- willChange: 'width',
36
- marginLeft: boxWidth !== '0px' ? '24px' : '0px',
37
- }, children: [_jsx(RoutesExpanded, { expansionType: expansionType, setOpenExpansion: handleSetRoutesOpen }), _jsx(ChainsExpanded, { formType: chainExpansionTypeRef.current === ExpansionType.FromChain
26
+ return (_jsxs(ExpansionContainer, { width: containerWidth, children: [_jsx(RoutesExpanded, { canOpen: expansionType === ExpansionType.Routes, setOpenExpansion: setRoutesOpen }), _jsx(ChainsExpanded, { formType: chainExpansionTypeRef.current === ExpansionType.FromChain
38
27
  ? 'from'
39
28
  : 'to', open: withChainExpansion })] }));
40
29
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Expansion.js","sourceRoot":"","sources":["../../../../src/components/Expansion/Expansion.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAA;AACnC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,kCAAkC,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAA;AACrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAA;AAEzD,MAAM,UAAU,SAAS;IACvB,MAAM,CAAC,kBAAkB,EAAE,aAAa,CAAC,GAAG,oBAAoB,EAAE,CAAA;IAClE,MAAM,qBAAqB,GAAG,MAAM,CAAgB,aAAa,CAAC,CAAA;IAElE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEnD,MAAM,mBAAmB,GAAG,WAAW,CAAC,CAAC,IAAa,EAAE,EAAE;QACxD,aAAa,CAAC,IAAI,CAAC,CAAA;IACrB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,2FAA2F;IAC3F,IACE,aAAa,KAAK,aAAa,CAAC,SAAS;QACzC,aAAa,KAAK,aAAa,CAAC,OAAO,EACvC,CAAC;QACD,qBAAqB,CAAC,OAAO,GAAG,aAAa,CAAA;IAC/C,CAAC;IAED,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,OAAO,UAAU;YACf,CAAC,CAAC,oBAAoB;YACtB,CAAC,CAAC,kBAAkB;gBAClB,CAAC,CAAC,mBAAmB;gBACrB,CAAC,CAAC,KAAK,CAAA;IACb,CAAC,EAAE,CAAC,UAAU,EAAE,kBAAkB,CAAC,CAAC,CAAA;IAEpC,OAAO,CACL,MAAC,GAAG,IACF,EAAE,EAAE;YACF,QAAQ,EAAE,UAAU;YACpB,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,SAAS,iBAAiB,iCAAiC;YACvE,KAAK,EAAE,QAAQ;YACf,UAAU,EAAE,OAAO;YACnB,UAAU,EAAE,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK;SAChD,aAED,KAAC,cAAc,IACb,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,mBAAmB,GACrC,EACF,KAAC,cAAc,IACb,QAAQ,EACN,qBAAqB,CAAC,OAAO,KAAK,aAAa,CAAC,SAAS;oBACvD,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,IAAI,EAEV,IAAI,EAAE,kBAAkB,GACxB,IACE,CACP,CAAA;AACH,CAAC"}
1
+ {"version":3,"file":"Expansion.js","sourceRoot":"","sources":["../../../../src/components/Expansion/Expansion.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,kCAAkC,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAA;AACrE,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAA;AAEtD,MAAM,UAAU,SAAS;IACvB,MAAM,CAAC,kBAAkB,EAAE,aAAa,CAAC,GAAG,oBAAoB,EAAE,CAAA;IAClE,MAAM,qBAAqB,GAAG,MAAM,CAAgB,aAAa,CAAC,CAAA;IAClE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEnD,2FAA2F;IAC3F,IACE,aAAa,KAAK,aAAa,CAAC,SAAS;QACzC,aAAa,KAAK,aAAa,CAAC,OAAO,EACvC,CAAC;QACD,qBAAqB,CAAC,OAAO,GAAG,aAAa,CAAA;IAC/C,CAAC;IAED,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO,UAAU;YACf,CAAC,CAAC,oBAAoB;YACtB,CAAC,CAAC,kBAAkB;gBAClB,CAAC,CAAC,mBAAmB;gBACrB,CAAC,CAAC,CAAC,CAAA;IACT,CAAC,EAAE,CAAC,UAAU,EAAE,kBAAkB,CAAC,CAAC,CAAA;IAEpC,OAAO,CACL,MAAC,kBAAkB,IAAC,KAAK,EAAE,cAAc,aACvC,KAAC,cAAc,IACb,OAAO,EAAE,aAAa,KAAK,aAAa,CAAC,MAAM,EAC/C,gBAAgB,EAAE,aAAa,GAC/B,EACF,KAAC,cAAc,IACb,QAAQ,EACN,qBAAqB,CAAC,OAAO,KAAK,aAAa,CAAC,SAAS;oBACvD,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,IAAI,EAEV,IAAI,EAAE,kBAAkB,GACxB,IACiB,CACtB,CAAA;AACH,CAAC"}
@@ -0,0 +1,32 @@
1
+ export declare const animationDuration = 225;
2
+ export declare const defaultStyle: {
3
+ opacity: number;
4
+ whiteSpace: string;
5
+ transform: string;
6
+ display: string;
7
+ position: "absolute";
8
+ top: number;
9
+ left: number;
10
+ transition: string;
11
+ };
12
+ export declare const transitionStyles: {
13
+ entering: {
14
+ opacity: number;
15
+ transform: string;
16
+ };
17
+ entered: {
18
+ opacity: number;
19
+ transform: string;
20
+ };
21
+ exiting: {
22
+ opacity: number;
23
+ transform: string;
24
+ };
25
+ exited: {
26
+ opacity: number;
27
+ transform: string;
28
+ };
29
+ };
30
+ export declare const ExpansionContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
31
+ width: string | number;
32
+ }, {}, {}>;
@@ -0,0 +1,40 @@
1
+ import { Box, styled } from '@mui/material';
2
+ export const animationDuration = 225;
3
+ export const defaultStyle = {
4
+ opacity: 0,
5
+ whiteSpace: 'nowrap',
6
+ transform: 'translateX(-100%)',
7
+ display: 'inline-block',
8
+ position: 'absolute',
9
+ top: 0,
10
+ left: 0,
11
+ transition: `opacity ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1), transform ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,
12
+ };
13
+ export const transitionStyles = {
14
+ entering: {
15
+ opacity: 1,
16
+ transform: 'translateX(0)',
17
+ },
18
+ entered: {
19
+ opacity: 1,
20
+ transform: 'translateX(0)',
21
+ },
22
+ exiting: {
23
+ opacity: 0,
24
+ transform: 'translateX(-100%)',
25
+ },
26
+ exited: {
27
+ opacity: 0,
28
+ transform: 'translateX(-100%)',
29
+ },
30
+ };
31
+ export const ExpansionContainer = styled(Box, {
32
+ shouldForwardProp: (prop) => prop !== 'width',
33
+ })(({ width }) => ({
34
+ position: 'relative',
35
+ display: 'flex',
36
+ transition: `width ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,
37
+ width: width,
38
+ marginLeft: width ? '24px' : 0,
39
+ }));
40
+ //# sourceMappingURL=Expansion.style.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Expansion.style.js","sourceRoot":"","sources":["../../../../src/components/Expansion/Expansion.style.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAE3C,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;AAEpC,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,OAAO,EAAE,CAAC;IACV,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,mBAAmB;IAC9B,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE,UAAmB;IAC7B,GAAG,EAAE,CAAC;IACN,IAAI,EAAE,CAAC;IACP,UAAU,EAAE,WAAW,iBAAiB,8CAA8C,iBAAiB,iCAAiC;CACzI,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,QAAQ,EAAE;QACR,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,eAAe;KAC3B;IACD,OAAO,EAAE;QACP,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,eAAe;KAC3B;IACD,OAAO,EAAE;QACP,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,mBAAmB;KAC/B;IACD,MAAM,EAAE;QACN,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,mBAAmB;KAC/B;CACF,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,EAAE;IAC5C,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,KAAK,OAAO;CAC9C,CAAC,CAA6B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAC7C,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,SAAS,iBAAiB,iCAAiC;IACvE,KAAK,EAAE,KAAK;IACZ,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;CAC/B,CAAC,CAAC,CAAA"}
@@ -1,5 +1,4 @@
1
1
  import { type PropsWithChildren } from 'react';
2
- export declare const animationDuration = 225;
3
2
  interface ExpansionTransitionProps {
4
3
  in: boolean;
5
4
  width: string;
@@ -2,36 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { Box } from '@mui/material';
3
3
  import { useRef } from 'react';
4
4
  import { Transition } from 'react-transition-group';
5
- export const animationDuration = 225;
6
- const defaultStyle = {
7
- opacity: 0,
8
- whiteSpace: 'nowrap',
9
- transform: 'translateX(-100%)',
10
- display: 'inline-block',
11
- position: 'absolute',
12
- top: 0,
13
- left: 0,
14
- willChange: 'opacity, transform',
15
- transition: `opacity ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1), transform ${animationDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`,
16
- };
17
- const transitionStyles = {
18
- entering: {
19
- opacity: 1,
20
- transform: 'translateX(0)',
21
- },
22
- entered: {
23
- opacity: 1,
24
- transform: 'translateX(0)',
25
- },
26
- exiting: {
27
- opacity: 0,
28
- transform: 'translateX(-100%)',
29
- },
30
- exited: {
31
- opacity: 0,
32
- transform: 'translateX(-100%)',
33
- },
34
- };
5
+ import { animationDuration, defaultStyle, transitionStyles, } from './Expansion.style';
35
6
  export function ExpansionTransition({ in: inProp, children, width, onExited, }) {
36
7
  const nodeRef = useRef(null);
37
8
  return (_jsx(Transition, { nodeRef: nodeRef, in: inProp, timeout: animationDuration, onExited: onExited, mountOnEnter: true, unmountOnExit: true, children: (state) => {
@@ -1 +1 @@
1
- {"version":3,"file":"ExpansionTransition.js","sourceRoot":"","sources":["../../../../src/components/Expansion/ExpansionTransition.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAA;AACnC,OAAO,EAA0B,MAAM,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAEnD,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;AAEpC,MAAM,YAAY,GAAG;IACnB,OAAO,EAAE,CAAC;IACV,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,mBAAmB;IAC9B,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE,UAAmB;IAC7B,GAAG,EAAE,CAAC;IACN,IAAI,EAAE,CAAC;IACP,UAAU,EAAE,oBAAoB;IAChC,UAAU,EAAE,WAAW,iBAAiB,8CAA8C,iBAAiB,iCAAiC;CACzI,CAAA;AAED,MAAM,gBAAgB,GAAG;IACvB,QAAQ,EAAE;QACR,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,eAAe;KAC3B;IACD,OAAO,EAAE;QACP,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,eAAe;KAC3B;IACD,OAAO,EAAE;QACP,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,mBAAmB;KAC/B;IACD,MAAM,EAAE;QACN,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,mBAAmB;KAC/B;CACF,CAAA;AAQD,MAAM,UAAU,mBAAmB,CAAC,EAClC,EAAE,EAAE,MAAM,EACV,QAAQ,EACR,KAAK,EACL,QAAQ,GACoC;IAC5C,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAC5B,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,MAAM,EACV,OAAO,EAAE,iBAAiB,EAC1B,QAAQ,EAAE,QAAQ,EAClB,YAAY,QACZ,aAAa,kBAEZ,CAAC,KAAK,EAAE,EAAE;YACT,OAAO,CACL,KAAC,GAAG,IACF,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE;oBACL,GAAG,YAAY;oBACf,GAAG,gBAAgB,CAAC,KAAsC,CAAC;oBAC3D,KAAK;iBACN,YAEA,QAAQ,GACL,CACP,CAAA;QACH,CAAC,GACU,CACd,CAAA;AACH,CAAC"}
1
+ {"version":3,"file":"ExpansionTransition.js","sourceRoot":"","sources":["../../../../src/components/Expansion/ExpansionTransition.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAA;AACnC,OAAO,EAA0B,MAAM,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACnD,OAAO,EACL,iBAAiB,EACjB,YAAY,EACZ,gBAAgB,GACjB,MAAM,mBAAmB,CAAA;AAQ1B,MAAM,UAAU,mBAAmB,CAAC,EAClC,EAAE,EAAE,MAAM,EACV,QAAQ,EACR,KAAK,EACL,QAAQ,GACoC;IAC5C,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAC5B,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,MAAM,EACV,OAAO,EAAE,iBAAiB,EAC1B,QAAQ,EAAE,QAAQ,EAClB,YAAY,QACZ,aAAa,kBAEZ,CAAC,KAAK,EAAE,EAAE;YACT,OAAO,CACL,KAAC,GAAG,IACF,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE;oBACL,GAAG,YAAY;oBACf,GAAG,gBAAgB,CAAC,KAAsC,CAAC;oBAC3D,KAAK;iBACN,YAEA,QAAQ,GACL,CACP,CAAA;QACH,CAAC,GACU,CACd,CAAA;AACH,CAAC"}
@@ -3,12 +3,11 @@ interface RoutesContentProps {
3
3
  routes: Route[];
4
4
  isFetching: boolean;
5
5
  isLoading: boolean;
6
- expanded: boolean;
7
- setReviewableRoute: (route: Route) => void;
8
6
  dataUpdatedAt: number;
9
7
  refetchTime: number;
10
8
  fromChain: ExtendedChain | undefined;
11
9
  refetch: () => void;
10
+ onRouteClick: (route: Route) => void;
12
11
  }
13
- export declare const RoutesContent: ({ routes, isFetching, isLoading, expanded, setReviewableRoute, dataUpdatedAt, refetchTime, fromChain, refetch, }: RoutesContentProps) => import("react/jsx-runtime").JSX.Element;
12
+ export declare const RoutesContent: import("react").NamedExoticComponent<RoutesContentProps>;
14
13
  export {};
@@ -1,15 +1,11 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useAccount } from '@lifi/wallet-management';
3
3
  import { Stack, Typography } from '@mui/material';
4
- import { useEffect } from 'react';
4
+ import { memo } from 'react';
5
5
  import { useTranslation } from 'react-i18next';
6
- import { useNavigate } from 'react-router-dom';
7
6
  import { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js';
8
- import { useWidgetEvents } from '../../hooks/useWidgetEvents.js';
9
7
  import { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js';
10
8
  import { useFieldValues } from '../../stores/form/useFieldValues.js';
11
- import { WidgetEvent } from '../../types/events.js';
12
- import { navigationRoutes } from '../../utils/navigationRoutes.js';
13
9
  import { PageContainer } from '../PageContainer.js';
14
10
  import { ProgressToNextUpdate } from '../ProgressToNextUpdate.js';
15
11
  import { RouteCard } from '../RouteCard/RouteCard.js';
@@ -17,28 +13,16 @@ import { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js';
17
13
  import { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js';
18
14
  import { Container, Header } from './RoutesExpanded.style.js';
19
15
  const headerHeight = '64px';
20
- export const RoutesContent = ({ routes, isFetching, isLoading, expanded, setReviewableRoute, dataUpdatedAt, refetchTime, fromChain, refetch, }) => {
16
+ export const RoutesContent = memo(function RoutesContent({ routes, isFetching, isLoading, dataUpdatedAt, refetchTime, fromChain, refetch, onRouteClick, }) {
21
17
  const { t } = useTranslation();
22
- const navigate = useNavigate();
23
18
  const { subvariant, subvariantOptions } = useWidgetConfig();
24
19
  const { account } = useAccount({ chainType: fromChain?.chainType });
25
20
  const [toAddress] = useFieldValues('toAddress');
26
21
  const { requiredToAddress } = useToAddressRequirements();
27
- const emitter = useWidgetEvents();
28
- const handleRouteClick = (route) => {
29
- setReviewableRoute(route);
30
- navigate(navigationRoutes.transactionExecution, {
31
- state: { routeId: route.id },
32
- });
33
- emitter.emit(WidgetEvent.RouteSelected, { route, routes: routes });
34
- };
35
22
  const currentRoute = routes?.[0];
36
- const routeNotFound = !currentRoute && !isLoading && !isFetching && expanded;
23
+ const routeNotFound = !currentRoute && !isLoading && !isFetching;
37
24
  const toAddressUnsatisfied = currentRoute && requiredToAddress && !toAddress;
38
25
  const allowInteraction = account.isConnected && !toAddressUnsatisfied;
39
- useEffect(() => {
40
- emitter.emit(WidgetEvent.WidgetExpanded, expanded);
41
- }, [emitter, expanded]);
42
26
  const title = subvariant === 'custom'
43
27
  ? subvariantOptions?.custom === 'deposit'
44
28
  ? t('header.deposit')
@@ -51,6 +35,6 @@ export const RoutesContent = ({ routes, isFetching, isLoading, expanded, setRevi
51
35
  }, children: title }), _jsx(ProgressToNextUpdate, { updatedAt: dataUpdatedAt || Date.now(), timeToUpdate: refetchTime, isLoading: isFetching, onClick: () => refetch(), sx: { marginRight: -1 } })] }), _jsx(PageContainer, { sx: { height: `calc(100% - ${headerHeight})`, overflow: 'auto' }, children: _jsx(Stack, { direction: "column", spacing: 2, sx: {
52
36
  flex: 1,
53
37
  paddingBottom: 3,
54
- }, children: routeNotFound ? (_jsx(RouteNotFoundCard, {})) : (isLoading || isFetching) && !routes?.length ? (Array.from({ length: 3 }).map((_, index) => (_jsx(RouteCardSkeleton, {}, index)))) : (routes?.map((route, index) => (_jsx(RouteCard, { route: route, onClick: allowInteraction ? () => handleRouteClick(route) : undefined, active: index === 0, expanded: routes?.length === 1 }, index)))) }) })] }));
55
- };
38
+ }, children: routeNotFound ? (_jsx(RouteNotFoundCard, {})) : (isLoading || isFetching) && !routes?.length ? (Array.from({ length: 3 }).map((_, index) => (_jsx(RouteCardSkeleton, {}, index)))) : (routes?.map((route, index) => (_jsx(RouteCard, { route: route, onClick: allowInteraction ? () => onRouteClick(route) : undefined, active: index === 0, expanded: routes?.length === 1 }, index)))) }) })] }));
39
+ });
56
40
  //# sourceMappingURL=RoutesContent.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"RoutesContent.js","sourceRoot":"","sources":["../../../../src/components/Routes/RoutesContent.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAA;AACpD,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAC9C,OAAO,EAAE,wBAAwB,EAAE,MAAM,yCAAyC,CAAA;AAClF,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAA;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,kDAAkD,CAAA;AAClF,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAA;AACpE,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AACnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAA;AACrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAA;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAc7D,MAAM,YAAY,GAAG,MAAM,CAAA;AAE3B,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,MAAM,EACN,UAAU,EACV,SAAS,EACT,QAAQ,EACR,kBAAkB,EAClB,aAAa,EACb,WAAW,EACX,SAAS,EACT,OAAO,GACY,EAAE,EAAE;IACvB,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAA;IAE9B,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAC9B,MAAM,EAAE,UAAU,EAAE,iBAAiB,EAAE,GAAG,eAAe,EAAE,CAAA;IAE3D,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAAA;IACnE,MAAM,CAAC,SAAS,CAAC,GAAG,cAAc,CAAC,WAAW,CAAC,CAAA;IAC/C,MAAM,EAAE,iBAAiB,EAAE,GAAG,wBAAwB,EAAE,CAAA;IAExD,MAAM,OAAO,GAAG,eAAe,EAAE,CAAA;IAEjC,MAAM,gBAAgB,GAAG,CAAC,KAAY,EAAE,EAAE;QACxC,kBAAkB,CAAC,KAAK,CAAC,CAAA;QACzB,QAAQ,CAAC,gBAAgB,CAAC,oBAAoB,EAAE;YAC9C,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,EAAE;SAC7B,CAAC,CAAA;QACF,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAO,EAAE,CAAC,CAAA;IACrE,CAAC,CAAA;IACD,MAAM,YAAY,GAAG,MAAM,EAAE,CAAC,CAAC,CAAC,CAAA;IAEhC,MAAM,aAAa,GAAG,CAAC,YAAY,IAAI,CAAC,SAAS,IAAI,CAAC,UAAU,IAAI,QAAQ,CAAA;IAC5E,MAAM,oBAAoB,GAAG,YAAY,IAAI,iBAAiB,IAAI,CAAC,SAAS,CAAA;IAC5E,MAAM,gBAAgB,GAAG,OAAO,CAAC,WAAW,IAAI,CAAC,oBAAoB,CAAA;IAErE,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAA;IACpD,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEvB,MAAM,KAAK,GACT,UAAU,KAAK,QAAQ;QACrB,CAAC,CAAC,iBAAiB,EAAE,MAAM,KAAK,SAAS;YACvC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC;YACrB,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC;QACtB,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAA;IAEzB,OAAO,CACL,MAAC,SAAS,IAAC,iBAAiB,QAAC,aAAa,EAAE,SAAS,aACnD,MAAC,MAAM,IAAC,EAAE,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,aAClC,KAAC,UAAU,IACT,MAAM,QACN,EAAE,EAAE;4BACF,QAAQ,EAAE,EAAE;4BACZ,UAAU,EAAE,KAAK;4BACjB,IAAI,EAAE,CAAC;yBACR,YAEA,KAAK,GACK,EACb,KAAC,oBAAoB,IACnB,SAAS,EAAE,aAAa,IAAI,IAAI,CAAC,GAAG,EAAE,EACtC,YAAY,EAAE,WAAW,EACzB,SAAS,EAAE,UAAU,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,EACxB,EAAE,EAAE,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,GACvB,IACK,EACT,KAAC,aAAa,IACZ,EAAE,EAAE,EAAE,MAAM,EAAE,eAAe,YAAY,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,YAEhE,KAAC,KAAK,IACJ,SAAS,EAAC,QAAQ,EAClB,OAAO,EAAE,CAAC,EACV,EAAE,EAAE;wBACF,IAAI,EAAE,CAAC;wBACP,aAAa,EAAE,CAAC;qBACjB,YAEA,aAAa,CAAC,CAAC,CAAC,CACf,KAAC,iBAAiB,KAAG,CACtB,CAAC,CAAC,CAAC,CAAC,SAAS,IAAI,UAAU,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CACjD,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAC1C,KAAC,iBAAiB,MAAM,KAAK,CAAI,CAClC,CAAC,CACH,CAAC,CAAC,CAAC,CACF,MAAM,EAAE,GAAG,CAAC,CAAC,KAAY,EAAE,KAAa,EAAE,EAAE,CAAC,CAC3C,KAAC,SAAS,IAER,KAAK,EAAE,KAAK,EACZ,OAAO,EACL,gBAAgB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,EAE9D,MAAM,EAAE,KAAK,KAAK,CAAC,EACnB,QAAQ,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC,IANzB,KAAK,CAOV,CACH,CAAC,CACH,GACK,GACM,IACN,CACb,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"RoutesContent.js","sourceRoot":"","sources":["../../../../src/components/Routes/RoutesContent.tsx"],"names":[],"mappings":"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"}
@@ -1,7 +1,6 @@
1
- import { ExpansionType } from '../../types/widget.js';
2
1
  interface RoutesExpandedProps {
3
- expansionType: ExpansionType;
2
+ canOpen: boolean;
4
3
  setOpenExpansion: (open: boolean) => void;
5
4
  }
6
- export declare const RoutesExpanded: ({ expansionType, setOpenExpansion, }: RoutesExpandedProps) => import("react/jsx-runtime").JSX.Element;
5
+ export declare const RoutesExpanded: import("react").NamedExoticComponent<RoutesExpandedProps>;
7
6
  export {};
@@ -1,11 +1,16 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { useEffect, useRef } from 'react';
2
+ import { memo, useCallback, useEffect, useLayoutEffect, useRef } from 'react';
3
+ import { useNavigate } from 'react-router-dom';
3
4
  import { useRoutes } from '../../hooks/useRoutes.js';
4
- import { ExpansionType } from '../../types/widget.js';
5
+ import { useWidgetEvents } from '../../hooks/useWidgetEvents.js';
6
+ import { WidgetEvent } from '../../types/events.js';
7
+ import { navigationRoutes } from '../../utils/navigationRoutes.js';
5
8
  import { ExpansionTransition } from '../Expansion/ExpansionTransition.js';
6
9
  import { RoutesContent } from './RoutesContent.js';
7
10
  import { routesExpansionWidth } from './RoutesExpanded.style.js';
8
- export const RoutesExpanded = ({ expansionType, setOpenExpansion, }) => {
11
+ export const RoutesExpanded = memo(function RoutesExpanded({ canOpen, setOpenExpansion, }) {
12
+ const emitter = useWidgetEvents();
13
+ const navigate = useNavigate();
9
14
  const routesRef = useRef(undefined);
10
15
  const routesActiveRef = useRef(false);
11
16
  const { routes, isLoading, isFetching, isFetched, dataUpdatedAt, refetchTime, fromChain, refetch, setReviewableRoute, } = useRoutes();
@@ -22,11 +27,22 @@ export const RoutesExpanded = ({ expansionType, setOpenExpansion, }) => {
22
27
  routesActiveRef.current = Boolean(routes);
23
28
  }
24
29
  const expanded = Boolean(routesActiveRef.current || isLoading || isFetching || isFetched) &&
25
- expansionType === ExpansionType.Routes;
26
- useEffect(() => {
27
- // To update parent's width when expansion changes
30
+ canOpen;
31
+ // biome-ignore lint/correctness/useExhaustiveDependencies: stable navigation callback that won't cause rerenders in RoutesContent
32
+ const onRouteClick = useCallback((route) => {
33
+ setReviewableRoute(route);
34
+ navigate(navigationRoutes.transactionExecution, {
35
+ state: { routeId: route.id },
36
+ });
37
+ emitter.emit(WidgetEvent.RouteSelected, { route, routes: routes });
38
+ }, [emitter, routes, setReviewableRoute]);
39
+ // Use layout effect to update parent's width when expansion changes
40
+ useLayoutEffect(() => {
28
41
  setOpenExpansion(expanded);
29
42
  }, [expanded, setOpenExpansion]);
30
- return (_jsx(ExpansionTransition, { in: expanded, width: routesExpansionWidth, onExited: onExit, children: _jsx(RoutesContent, { routes: routesRef.current || [], isFetching: isFetching, isLoading: isLoading, expanded: expanded, setReviewableRoute: setReviewableRoute, dataUpdatedAt: dataUpdatedAt, refetchTime: refetchTime, fromChain: fromChain, refetch: refetch }) }));
31
- };
43
+ useEffect(() => {
44
+ emitter.emit(WidgetEvent.WidgetExpanded, expanded);
45
+ }, [emitter, expanded]);
46
+ return (_jsx(ExpansionTransition, { in: expanded, width: routesExpansionWidth, onExited: onExit, children: _jsx(RoutesContent, { routes: routesRef.current || [], isFetching: isFetching, isLoading: isLoading, dataUpdatedAt: dataUpdatedAt, refetchTime: refetchTime, fromChain: fromChain, refetch: refetch, onRouteClick: onRouteClick }) }));
47
+ });
32
48
  //# sourceMappingURL=RoutesExpanded.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"RoutesExpanded.js","sourceRoot":"","sources":["../../../../src/components/Routes/RoutesExpanded.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAA;AACzE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAA;AAOhE,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,aAAa,EACb,gBAAgB,GACI,EAAE,EAAE;IACxB,MAAM,SAAS,GAAG,MAAM,CAAU,SAAS,CAAC,CAAA;IAE5C,MAAM,eAAe,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IACrC,MAAM,EACJ,MAAM,EACN,SAAS,EACT,UAAU,EACV,SAAS,EACT,aAAa,EACb,WAAW,EACX,SAAS,EACT,OAAO,EACP,kBAAkB,GACnB,GAAG,SAAS,EAAE,CAAA;IAEf,MAAM,MAAM,GAAG,GAAG,EAAE;QAClB,6BAA6B;QAC7B,SAAS,CAAC,OAAO,GAAG,SAAS,CAAA;IAC/B,CAAC,CAAA;IAED,6DAA6D;IAC7D,IAAI,SAAS,CAAC,OAAO,IAAI,CAAC,MAAM,EAAE,CAAC;QACjC,eAAe,CAAC,OAAO,GAAG,KAAK,CAAA;IACjC,CAAC;SAAM,CAAC;QACN,SAAS,CAAC,OAAO,GAAG,MAAM,CAAA;QAC1B,eAAe,CAAC,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,CAAA;IAC3C,CAAC;IAED,MAAM,QAAQ,GACZ,OAAO,CAAC,eAAe,CAAC,OAAO,IAAI,SAAS,IAAI,UAAU,IAAI,SAAS,CAAC;QACxE,aAAa,KAAK,aAAa,CAAC,MAAM,CAAA;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,kDAAkD;QAClD,gBAAgB,CAAC,QAAQ,CAAC,CAAA;IAC5B,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAA;IAEhC,OAAO,CACL,KAAC,mBAAmB,IAClB,EAAE,EAAE,QAAQ,EACZ,KAAK,EAAE,oBAAoB,EAC3B,QAAQ,EAAE,MAAM,YAEhB,KAAC,aAAa,IACZ,MAAM,EAAE,SAAS,CAAC,OAAO,IAAI,EAAE,EAC/B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,kBAAkB,EACtC,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,GAChB,GACkB,CACvB,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"RoutesExpanded.js","sourceRoot":"","sources":["../../../../src/components/Routes/RoutesExpanded.tsx"],"names":[],"mappings":"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"}
@@ -4,14 +4,13 @@ export const routesExpansionWidth = '436px';
4
4
  export const Container = styled(ScopedCssBaseline, {
5
5
  shouldForwardProp: (prop) => !['minimumHeight'].includes(prop),
6
6
  })(({ theme, minimumHeight }) => ({
7
+ ...theme.container,
7
8
  backgroundColor: theme.vars.palette.background.default,
8
9
  overflow: 'hidden',
9
10
  width: routesExpansionWidth,
10
11
  display: 'flex',
11
12
  flexDirection: 'column',
12
13
  whiteSpace: 'normal',
13
- borderRadius: theme.container?.borderRadius ?? 0,
14
- boxShadow: theme.container?.boxShadow ?? 'none',
15
14
  ...(theme.container?.display !== 'flex'
16
15
  ? {
17
16
  maxHeight: theme.container?.maxHeight ??
@@ -1 +1 @@
1
- {"version":3,"file":"RoutesExpanded.style.js","sourceRoot":"","sources":["../../../../src/components/Routes/RoutesExpanded.style.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAE5D,MAAM,CAAC,MAAM,oBAAoB,GAAG,OAAO,CAAA;AAM3C,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,iBAAiB,EAAE;IACjD,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACzE,CAAC,CAAiB,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,EAAE,CAAC,CAAC;IAChD,eAAe,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;IACtD,QAAQ,EAAE,QAAQ;IAClB,KAAK,EAAE,oBAAoB;IAC3B,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,UAAU,EAAE,QAAQ;IACpB,YAAY,EAAE,KAAK,CAAC,SAAS,EAAE,YAAY,IAAI,CAAC;IAChD,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,SAAS,IAAI,MAAM;IAC/C,GAAG,CAAC,KAAK,CAAC,SAAS,EAAE,OAAO,KAAK,MAAM;QACrC,CAAC,CAAC;YACE,SAAS,EACP,KAAK,CAAC,SAAS,EAAE,SAAS;gBAC1B,KAAK,CAAC,SAAS,EAAE,MAAM;gBACvB,gBAAgB;YAClB,GAAG,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;SACtD;QACH,CAAC,CAAC,EAAE,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;IAChD,GAAG,KAAK,CAAC,eAAe;CACzB,CAAC,CAAC,CAAA;AAEH,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAChD,eAAe,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;IACtD,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,eAAe;IAC/B,UAAU,EAAE,QAAQ;IACpB,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;IAC9B,QAAQ,EAAE,QAAQ;IAClB,GAAG,EAAE,CAAC;IACN,MAAM,EAAE,IAAI;CACb,CAAC,CAAC,CAAA"}
1
+ {"version":3,"file":"RoutesExpanded.style.js","sourceRoot":"","sources":["../../../../src/components/Routes/RoutesExpanded.style.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAE5D,MAAM,CAAC,MAAM,oBAAoB,GAAG,OAAO,CAAA;AAM3C,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,iBAAiB,EAAE;IACjD,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACzE,CAAC,CAAiB,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,EAAE,CAAC,CAAC;IAChD,GAAG,KAAK,CAAC,SAAS;IAClB,eAAe,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;IACtD,QAAQ,EAAE,QAAQ;IAClB,KAAK,EAAE,oBAAoB;IAC3B,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,UAAU,EAAE,QAAQ;IACpB,GAAG,CAAC,KAAK,CAAC,SAAS,EAAE,OAAO,KAAK,MAAM;QACrC,CAAC,CAAC;YACE,SAAS,EACP,KAAK,CAAC,SAAS,EAAE,SAAS;gBAC1B,KAAK,CAAC,SAAS,EAAE,MAAM;gBACvB,gBAAgB;YAClB,GAAG,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;SACtD;QACH,CAAC,CAAC,EAAE,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;IAChD,GAAG,KAAK,CAAC,eAAe;CACzB,CAAC,CAAC,CAAA;AAEH,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAChD,eAAe,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;IACtD,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,eAAe;IAC/B,UAAU,EAAE,QAAQ;IACpB,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;IAC9B,QAAQ,EAAE,QAAQ;IAClB,GAAG,EAAE,CAAC;IACN,MAAM,EAAE,IAAI;CACb,CAAC,CAAC,CAAA"}
@@ -1,2 +1,2 @@
1
1
  export declare const name = "@lifi/widget";
2
- export declare const version = "3.26.0";
2
+ export declare const version = "3.26.1";
@@ -1,3 +1,3 @@
1
1
  export const name = '@lifi/widget';
2
- export const version = '3.26.0';
2
+ export const version = '3.26.1';
3
3
  //# sourceMappingURL=version.js.map
@@ -1,6 +1,7 @@
1
1
  import { ChainType, convertQuoteToRoute, getContractCallsQuote, getRelayerQuote, getRoutes, isRelayerStep, LiFiErrorCode, } from '@lifi/sdk';
2
2
  import { useAccount } from '@lifi/wallet-management';
3
3
  import { useQuery, useQueryClient } from '@tanstack/react-query';
4
+ import { useCallback, useMemo } from 'react';
4
5
  import { parseUnits } from 'viem';
5
6
  import { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js';
6
7
  import { useFieldValues } from '../stores/form/useFieldValues.js';
@@ -72,7 +73,7 @@ export const useRoutes = ({ observableRoute } = {}) => {
72
73
  contractCallQuoteEnabled &&
73
74
  !isBatchingSupportedLoading;
74
75
  // Some values should be strictly typed and isEnabled ensures that
75
- const queryKey = [
76
+ const queryKey = useMemo(() => [
76
77
  getQueryKey('routes', keyPrefix),
77
78
  account.address,
78
79
  fromChain?.id,
@@ -97,7 +98,34 @@ export const useRoutes = ({ observableRoute } = {}) => {
97
98
  feeConfig?.fee || fee,
98
99
  !!isBatchingSupported,
99
100
  observableRoute?.id,
100
- ];
101
+ ], [
102
+ keyPrefix,
103
+ account.address,
104
+ fromChain?.id,
105
+ fromToken?.address,
106
+ fromTokenAmount,
107
+ toWalletAddress,
108
+ toChain?.id,
109
+ toToken?.address,
110
+ toTokenAmount,
111
+ contractCalls,
112
+ slippage,
113
+ swapOnly,
114
+ disabledBridges,
115
+ disabledExchanges,
116
+ allowedBridges,
117
+ allowedExchanges,
118
+ routePriority,
119
+ subvariant,
120
+ allowSwitchChain,
121
+ enabledRefuel,
122
+ enabledAutoRefuel,
123
+ gasRecommendationFromAmount,
124
+ feeConfig?.fee,
125
+ fee,
126
+ isBatchingSupported,
127
+ observableRoute?.id,
128
+ ]);
101
129
  const { getIntermediateRoutes, setIntermediateRoutes } = useIntermediateRoutesStore();
102
130
  const { data, isLoading, isFetching, isFetched, dataUpdatedAt, refetch } = useQuery({
103
131
  queryKey,
@@ -342,13 +370,13 @@ export const useRoutes = ({ observableRoute } = {}) => {
342
370
  return true;
343
371
  },
344
372
  });
345
- const setReviewableRoute = (route) => {
373
+ const setReviewableRoute = useCallback((route) => {
346
374
  const queryDataKey = queryKey.toSpliced(queryKey.length - 1, 1, route.id);
347
375
  queryClient.setQueryData(queryDataKey, [route], {
348
376
  updatedAt: dataUpdatedAt || Date.now(),
349
377
  });
350
378
  setExecutableRoute(route);
351
- };
379
+ }, [queryClient, dataUpdatedAt, setExecutableRoute, queryKey]);
352
380
  return {
353
381
  routes: data || getIntermediateRoutes(queryKey),
354
382
  isLoading: isEnabled && isLoading,