@lifi/widget 1.0.1 → 1.1.2

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 (72) hide show
  1. package/AppDrawer.d.ts +1 -1
  2. package/AppProvider.d.ts +1 -1
  3. package/components/ProgressToNextUpdate/ProgressToNextUpdate.js +9 -11
  4. package/components/SwapRouteCard/SwapRouteCard.js +5 -1
  5. package/components/SwapRouteCard/SwapRouteCard.style.js +2 -2
  6. package/components/SwapRoutes/SwapRoutes.js +1 -1
  7. package/components/TokenList/TokenList.js +10 -3
  8. package/config/env.d.ts +0 -9
  9. package/config/env.js +1 -17
  10. package/fonts/Inter-Black.woff +0 -0
  11. package/fonts/Inter-Black.woff2 +0 -0
  12. package/fonts/Inter-BlackItalic.woff +0 -0
  13. package/fonts/Inter-BlackItalic.woff2 +0 -0
  14. package/fonts/Inter-Bold.woff +0 -0
  15. package/fonts/Inter-Bold.woff2 +0 -0
  16. package/fonts/Inter-BoldItalic.woff +0 -0
  17. package/fonts/Inter-BoldItalic.woff2 +0 -0
  18. package/fonts/Inter-ExtraBold.woff +0 -0
  19. package/fonts/Inter-ExtraBold.woff2 +0 -0
  20. package/fonts/Inter-ExtraBoldItalic.woff +0 -0
  21. package/fonts/Inter-ExtraBoldItalic.woff2 +0 -0
  22. package/fonts/Inter-ExtraLight.woff +0 -0
  23. package/fonts/Inter-ExtraLight.woff2 +0 -0
  24. package/fonts/Inter-ExtraLightItalic.woff +0 -0
  25. package/fonts/Inter-ExtraLightItalic.woff2 +0 -0
  26. package/fonts/Inter-Italic.woff +0 -0
  27. package/fonts/Inter-Italic.woff2 +0 -0
  28. package/fonts/Inter-Light.woff +0 -0
  29. package/fonts/Inter-Light.woff2 +0 -0
  30. package/fonts/Inter-LightItalic.woff +0 -0
  31. package/fonts/Inter-LightItalic.woff2 +0 -0
  32. package/fonts/Inter-Medium.woff +0 -0
  33. package/fonts/Inter-Medium.woff2 +0 -0
  34. package/fonts/Inter-MediumItalic.woff +0 -0
  35. package/fonts/Inter-MediumItalic.woff2 +0 -0
  36. package/fonts/Inter-Regular.woff +0 -0
  37. package/fonts/Inter-Regular.woff2 +0 -0
  38. package/fonts/Inter-SemiBold.woff +0 -0
  39. package/fonts/Inter-SemiBold.woff2 +0 -0
  40. package/fonts/Inter-SemiBoldItalic.woff +0 -0
  41. package/fonts/Inter-SemiBoldItalic.woff2 +0 -0
  42. package/fonts/Inter-Thin.woff +0 -0
  43. package/fonts/Inter-Thin.woff2 +0 -0
  44. package/fonts/Inter-ThinItalic.woff +0 -0
  45. package/fonts/Inter-ThinItalic.woff2 +0 -0
  46. package/fonts/Inter-italic.var.woff2 +0 -0
  47. package/fonts/Inter-roman.var.woff2 +0 -0
  48. package/fonts/Inter.var.woff2 +0 -0
  49. package/fonts/inter.css +200 -0
  50. package/hooks/useChains.js +2 -2
  51. package/hooks/useDebouncedWatch.js +7 -2
  52. package/hooks/useRouteExecution/useRouteExecution.js +3 -3
  53. package/hooks/useSwapRoutes.js +17 -8
  54. package/i18n/en/translation.json +136 -132
  55. package/i18n/index.d.ts +8 -4
  56. package/icons/LiFiFullLogo.svg +10 -0
  57. package/icons/LiFiLogo.svg +5 -0
  58. package/lifi.js +1 -4
  59. package/package.json +8 -8
  60. package/pages/SelectTokenPage/SelectTokenPage.js +9 -2
  61. package/pages/SettingsPage/GasPriceSelect.js +2 -2
  62. package/pages/SettingsPage/RoutePrioritySelect.js +3 -2
  63. package/providers/SwapFormProvider/SwapFormProvider.d.ts +7 -0
  64. package/providers/SwapFormProvider/SwapFormProvider.js +4 -3
  65. package/providers/SwapFormProvider/types.d.ts +2 -1
  66. package/providers/WidgetProvider/WidgetProvider.js +6 -7
  67. package/providers/WidgetProvider/types.d.ts +1 -1
  68. package/types/widget.d.ts +1 -1
  69. package/config/rpcs.d.ts +0 -1
  70. package/config/rpcs.js +0 -20
  71. package/i18n/react-i18next.d.ts +0 -9
  72. package/react-app-env.d.ts +0 -1
package/AppDrawer.d.ts CHANGED
@@ -3,7 +3,7 @@ import { RefObject } from 'react';
3
3
  import { WidgetConfig } from './types';
4
4
  export declare type AppDrawerProps = DrawerProps & {
5
5
  elementRef?: RefObject<HTMLDivElement>;
6
- config: WidgetConfig;
6
+ config?: WidgetConfig;
7
7
  };
8
8
  export interface AppDrawerBase {
9
9
  isOpen(): void;
package/AppProvider.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { PropsWithChildren } from 'react';
2
2
  import { WidgetConfig } from '.';
3
3
  export interface AppProps {
4
- config: WidgetConfig;
4
+ config?: WidgetConfig;
5
5
  }
6
6
  export declare const AppProvider: React.FC<PropsWithChildren<AppProps>>;
@@ -2,20 +2,18 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Box, CircularProgress, IconButton, Tooltip, } from '@mui/material';
3
3
  import { useEffect, useState } from 'react';
4
4
  import { useTranslation } from 'react-i18next';
5
- const calculateTime = (updatedAt, timeToUpdate) => {
6
- if (updatedAt === 0) {
7
- return 0;
8
- }
9
- const progress = ((Date.now() - updatedAt) / timeToUpdate) * 100;
10
- return Math.min(100, progress);
11
- };
5
+ const getProgressValue = (updatedAt, timeToUpdate) => updatedAt
6
+ ? Math.min(100, ((Date.now() - updatedAt) / timeToUpdate) * 100)
7
+ : 0;
8
+ const getSecondsToUpdate = (updatedAt, timeToUpdate) => Math.max(Math.round((timeToUpdate - (Date.now() - updatedAt)) / 1000), 0);
12
9
  export const ProgressToNextUpdate = ({ updatedAt, timeToUpdate, isLoading, onClick, sx }) => {
13
10
  const { t } = useTranslation();
14
- const [value, setValue] = useState(() => calculateTime(updatedAt, timeToUpdate));
11
+ const [value, setValue] = useState(() => getProgressValue(updatedAt, timeToUpdate));
15
12
  useEffect(() => {
13
+ setValue(getProgressValue(updatedAt, timeToUpdate));
16
14
  const id = setInterval(() => {
17
- const time = calculateTime(updatedAt, timeToUpdate);
18
- setValue(calculateTime(updatedAt, timeToUpdate));
15
+ const time = getProgressValue(updatedAt, timeToUpdate);
16
+ setValue(time);
19
17
  if (time >= 100) {
20
18
  clearInterval(id);
21
19
  }
@@ -28,7 +26,7 @@ export const ProgressToNextUpdate = ({ updatedAt, timeToUpdate, isLoading, onCli
28
26
  }
29
27
  }, [isLoading]);
30
28
  return (_jsx(IconButton, Object.assign({ onClick: onClick, sx: sx, disabled: isLoading }, { children: _jsx(Tooltip, Object.assign({ title: t('tooltip.progressToNextUpdate', {
31
- value: Math.round((timeToUpdate - (Date.now() - updatedAt)) / 1000),
29
+ value: getSecondsToUpdate(updatedAt, timeToUpdate),
32
30
  }), placement: "top", enterDelay: 250, arrow: true }, { children: _jsxs(Box, Object.assign({ sx: {
33
31
  display: 'grid',
34
32
  position: 'relative',
@@ -17,13 +17,17 @@ import { StepActions } from '../StepActions';
17
17
  import { StepToken } from '../StepToken';
18
18
  import { Card, Check, Label } from './SwapRouteCard.style';
19
19
  export const SwapRouteCard = (_a) => {
20
+ var _b;
20
21
  var { route, active, dense } = _a, other = __rest(_a, ["route", "active", "dense"]);
21
22
  const { t } = useTranslation();
23
+ const label = ((_b = route.tags) === null || _b === void 0 ? void 0 : _b.length)
24
+ ? t(`swap.tags.${route.tags[0].toLowerCase()}`).toUpperCase()
25
+ : t(`swap.tags.general`).toUpperCase();
22
26
  return (_jsx(Card, Object.assign({ active: active, dense: dense }, other, { children: _jsxs(Box, { children: [_jsxs(Box, Object.assign({ sx: {
23
27
  display: 'flex',
24
28
  alignItems: 'center',
25
29
  justifyContent: 'space-between',
26
- }, mb: 2 }, { children: [_jsx(Label, { children: "GENERAL" }), active ? (_jsx(Check, { children: _jsx(CheckIcon, { fontSize: "inherit" }) })) : null] })), _jsx(StepToken, { token: Object.assign(Object.assign({}, route.toToken), { amount: route.toAmount }), mb: 2 }), !dense
30
+ }, mb: 2 }, { children: [_jsx(Label, { children: label }), active ? (_jsx(Check, { children: _jsx(CheckIcon, { fontSize: "inherit" }) })) : null] })), _jsx(StepToken, { token: Object.assign(Object.assign({}, route.toToken), { amount: route.toAmount }), mb: 2 }), !dense
27
31
  ? route.steps.map((step) => (_jsx(StepActions, { step: step, mb: 2 }, step.id)))
28
32
  : null, _jsxs(Box, Object.assign({ sx: {
29
33
  display: 'flex',
@@ -49,9 +49,9 @@ export const Label = styled(Typography, {
49
49
  : theme.palette.mode === 'light'
50
50
  ? theme.palette.common.black
51
51
  : theme.palette.grey[300],
52
- padding: theme.spacing(0.5, 0.75),
52
+ padding: theme.spacing(0.75),
53
53
  fontSize: 12,
54
- lineHeight: 1.2,
54
+ lineHeight: 1,
55
55
  fontWeight: '600',
56
56
  height: 24,
57
57
  letterSpacing: '0.05rem',
@@ -29,5 +29,5 @@ export const SwapRoutes = (props) => {
29
29
  } }), _jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center' } }, { children: [_jsx(Stack, Object.assign({ direction: "row", py: 2, pl: 2, pr: 1 }, { children: isLoading || isFetching || !currentRoute ? (_jsx(Skeleton, { variant: "rectangular", width: "100%", height: 181, sx: (theme) => ({
30
30
  borderRadius: theme.shape.borderRadiusSecondary / theme.shape.borderRadius,
31
31
  minWidth: '100%',
32
- }) })) : (_jsx(SwapRouteCard, { minWidth: "100%", route: currentRoute, active: true, dense: true }, currentRoute.id)) })), _jsx(Box, Object.assign({ py: 1, pr: 1 }, { children: _jsx(IconButton, Object.assign({ onClick: handleCardClick, size: "medium", "aria-label": "swap-routes" }, { children: _jsx(KeyboardArrowRightIcon, {}) })) }))] }))] })));
32
+ }) })) : (_jsx(SwapRouteCard, { minWidth: "100%", route: currentRoute, active: true, dense: true })) })), _jsx(Box, Object.assign({ py: 1, pr: 1 }, { children: _jsx(IconButton, Object.assign({ onClick: handleCardClick, size: "medium", "aria-label": "swap-routes" }, { children: _jsx(KeyboardArrowRightIcon, {}) })) }))] }))] })));
33
33
  };
@@ -12,12 +12,12 @@ import { createTokenAmountSkeletons, skeletonKey } from './utils';
12
12
  export const TokenList = ({ formType, height, onClick, }) => {
13
13
  const { t } = useTranslation();
14
14
  const { account } = useWallet();
15
- const { setValue } = useFormContext();
15
+ const { setValue, getValues } = useFormContext();
16
16
  const [selectedChainId] = useWatch({
17
17
  name: [SwapFormKeyHelper.getChainKey(formType)],
18
18
  });
19
19
  const [searchTokensFilter] = useDebouncedWatch([SwapFormKey.SearchTokensFilter], 250);
20
- const { tokens, isLoading, isFetching } = useTokenBalances(selectedChainId);
20
+ const { tokens, isLoading } = useTokenBalances(selectedChainId);
21
21
  const chainTokens = useMemo(() => {
22
22
  var _a;
23
23
  let chainTokens = tokens !== null && tokens !== void 0 ? tokens : [];
@@ -46,8 +46,15 @@ export const TokenList = ({ formType, height, onClick, }) => {
46
46
  const handleTokenClick = useCallback((tokenAddress) => {
47
47
  setValue(SwapFormKeyHelper.getTokenKey(formType), tokenAddress);
48
48
  setValue(SwapFormKeyHelper.getAmountKey(formType), '');
49
+ const oppositeFormType = formType === 'from' ? 'to' : 'from';
50
+ const [selectedOppositeToken] = getValues([
51
+ SwapFormKeyHelper.getTokenKey(oppositeFormType),
52
+ ]);
53
+ if (selectedOppositeToken === tokenAddress) {
54
+ setValue(SwapFormKeyHelper.getTokenKey(oppositeFormType), '');
55
+ }
49
56
  onClick === null || onClick === void 0 ? void 0 : onClick();
50
- }, [formType, onClick, setValue]);
57
+ }, [formType, getValues, onClick, setValue]);
51
58
  return (_jsxs(Box, Object.assign({ ref: parentRef, style: { height, overflow: 'auto' } }, { children: [!virtualItems.length ? (_jsx(Typography, Object.assign({ variant: "body1", align: "center", py: 2, px: 3 }, { children: t('swap.couldntFindTokens') }))) : null, _jsx(List, Object.assign({ style: { height: totalSize }, disablePadding: true }, { children: virtualItems.map((item) => {
52
59
  const token = chainTokens[item.index];
53
60
  if (token.name.includes(skeletonKey)) {
package/config/env.d.ts CHANGED
@@ -1,12 +1,3 @@
1
1
  export declare const env: {
2
2
  LIFI_API_URL: string;
3
- LIFI_RPC_URL_MAINNET: string;
4
- LIFI_RPC_URL_ROPSTEN: string;
5
- LIFI_RPC_URL_RINKEBY: string;
6
- LIFI_RPC_URL_GORLI: string;
7
- LIFI_RPC_URL_KOVAN: string;
8
- LIFI_RPC_URL_ARBITRUM_RINKEBY: string;
9
- LIFI_RPC_URL_OPTIMISM_KOVAN: string;
10
- LIFI_RPC_URL_POLYGON_MUMBAI: string;
11
- LIFI_RPC_URL_BSC_TESTNET: string;
12
3
  };
package/config/env.js CHANGED
@@ -1,19 +1,3 @@
1
1
  export const env = {
2
- LIFI_API_URL: 'https://li.quest/v1/',
3
- // RPC - Mainnet (overwrites)
4
- LIFI_RPC_URL_MAINNET: 'https://speedy-nodes-nyc.moralis.io/5ed6053dc39eba789ff466c9/eth/mainnet',
5
- // LIFI_RPC_URL_POLYGON:
6
- // LIFI_RPC_URL_BSC:
7
- // LIFI_RPC_URL_XDAI:
8
- // LIFI_RPC_URL_FANTOM:
9
- // LIFI_RPC_URL_ARBITRUM:
10
- // RPC - Testnet (overwrites)
11
- LIFI_RPC_URL_ROPSTEN: 'https://ropsten.infura.io/v3/c7fe4abb5bbc466cb56038efbb0b9930',
12
- LIFI_RPC_URL_RINKEBY: 'https://rinkeby.infura.io/v3/c7fe4abb5bbc466cb56038efbb0b9930',
13
- LIFI_RPC_URL_GORLI: 'https://goerli.infura.io/v3/c7fe4abb5bbc466cb56038efbb0b9930',
14
- LIFI_RPC_URL_KOVAN: 'https://kovan.infura.io/v3/c7fe4abb5bbc466cb56038efbb0b9930',
15
- LIFI_RPC_URL_ARBITRUM_RINKEBY: 'https://arbitrum-rinkeby.infura.io/v3/c7fe4abb5bbc466cb56038efbb0b9930',
16
- LIFI_RPC_URL_OPTIMISM_KOVAN: 'https://optimism-kovan.infura.io/v3/c7fe4abb5bbc466cb56038efbb0b9930',
17
- LIFI_RPC_URL_POLYGON_MUMBAI: 'https://rpc-mumbai.maticvigil.com/v1/e4dadaac060844094a667194c20f79cc9bb0bc59',
18
- LIFI_RPC_URL_BSC_TESTNET: 'https://data-seed-prebsc-1-s2.binance.org:8545',
2
+ LIFI_API_URL: 'https://li.quest/v1/', // 'https://developkub.li.finance/v1/',
19
3
  };
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
@@ -0,0 +1,200 @@
1
+ @font-face {
2
+ font-family: 'Inter';
3
+ font-style: normal;
4
+ font-weight: 100;
5
+ font-display: swap;
6
+ src: url("Inter-Thin.woff2?v=3.19") format("woff2"),
7
+ url("Inter-Thin.woff?v=3.19") format("woff");
8
+ }
9
+ @font-face {
10
+ font-family: 'Inter';
11
+ font-style: italic;
12
+ font-weight: 100;
13
+ font-display: swap;
14
+ src: url("Inter-ThinItalic.woff2?v=3.19") format("woff2"),
15
+ url("Inter-ThinItalic.woff?v=3.19") format("woff");
16
+ }
17
+
18
+ @font-face {
19
+ font-family: 'Inter';
20
+ font-style: normal;
21
+ font-weight: 200;
22
+ font-display: swap;
23
+ src: url("Inter-ExtraLight.woff2?v=3.19") format("woff2"),
24
+ url("Inter-ExtraLight.woff?v=3.19") format("woff");
25
+ }
26
+ @font-face {
27
+ font-family: 'Inter';
28
+ font-style: italic;
29
+ font-weight: 200;
30
+ font-display: swap;
31
+ src: url("Inter-ExtraLightItalic.woff2?v=3.19") format("woff2"),
32
+ url("Inter-ExtraLightItalic.woff?v=3.19") format("woff");
33
+ }
34
+
35
+ @font-face {
36
+ font-family: 'Inter';
37
+ font-style: normal;
38
+ font-weight: 300;
39
+ font-display: swap;
40
+ src: url("Inter-Light.woff2?v=3.19") format("woff2"),
41
+ url("Inter-Light.woff?v=3.19") format("woff");
42
+ }
43
+ @font-face {
44
+ font-family: 'Inter';
45
+ font-style: italic;
46
+ font-weight: 300;
47
+ font-display: swap;
48
+ src: url("Inter-LightItalic.woff2?v=3.19") format("woff2"),
49
+ url("Inter-LightItalic.woff?v=3.19") format("woff");
50
+ }
51
+
52
+ @font-face {
53
+ font-family: 'Inter';
54
+ font-style: normal;
55
+ font-weight: 400;
56
+ font-display: swap;
57
+ src: url("Inter-Regular.woff2?v=3.19") format("woff2"),
58
+ url("Inter-Regular.woff?v=3.19") format("woff");
59
+ }
60
+ @font-face {
61
+ font-family: 'Inter';
62
+ font-style: italic;
63
+ font-weight: 400;
64
+ font-display: swap;
65
+ src: url("Inter-Italic.woff2?v=3.19") format("woff2"),
66
+ url("Inter-Italic.woff?v=3.19") format("woff");
67
+ }
68
+
69
+ @font-face {
70
+ font-family: 'Inter';
71
+ font-style: normal;
72
+ font-weight: 500;
73
+ font-display: swap;
74
+ src: url("Inter-Medium.woff2?v=3.19") format("woff2"),
75
+ url("Inter-Medium.woff?v=3.19") format("woff");
76
+ }
77
+ @font-face {
78
+ font-family: 'Inter';
79
+ font-style: italic;
80
+ font-weight: 500;
81
+ font-display: swap;
82
+ src: url("Inter-MediumItalic.woff2?v=3.19") format("woff2"),
83
+ url("Inter-MediumItalic.woff?v=3.19") format("woff");
84
+ }
85
+
86
+ @font-face {
87
+ font-family: 'Inter';
88
+ font-style: normal;
89
+ font-weight: 600;
90
+ font-display: swap;
91
+ src: url("Inter-SemiBold.woff2?v=3.19") format("woff2"),
92
+ url("Inter-SemiBold.woff?v=3.19") format("woff");
93
+ }
94
+ @font-face {
95
+ font-family: 'Inter';
96
+ font-style: italic;
97
+ font-weight: 600;
98
+ font-display: swap;
99
+ src: url("Inter-SemiBoldItalic.woff2?v=3.19") format("woff2"),
100
+ url("Inter-SemiBoldItalic.woff?v=3.19") format("woff");
101
+ }
102
+
103
+ @font-face {
104
+ font-family: 'Inter';
105
+ font-style: normal;
106
+ font-weight: 700;
107
+ font-display: swap;
108
+ src: url("Inter-Bold.woff2?v=3.19") format("woff2"),
109
+ url("Inter-Bold.woff?v=3.19") format("woff");
110
+ }
111
+ @font-face {
112
+ font-family: 'Inter';
113
+ font-style: italic;
114
+ font-weight: 700;
115
+ font-display: swap;
116
+ src: url("Inter-BoldItalic.woff2?v=3.19") format("woff2"),
117
+ url("Inter-BoldItalic.woff?v=3.19") format("woff");
118
+ }
119
+
120
+ @font-face {
121
+ font-family: 'Inter';
122
+ font-style: normal;
123
+ font-weight: 800;
124
+ font-display: swap;
125
+ src: url("Inter-ExtraBold.woff2?v=3.19") format("woff2"),
126
+ url("Inter-ExtraBold.woff?v=3.19") format("woff");
127
+ }
128
+ @font-face {
129
+ font-family: 'Inter';
130
+ font-style: italic;
131
+ font-weight: 800;
132
+ font-display: swap;
133
+ src: url("Inter-ExtraBoldItalic.woff2?v=3.19") format("woff2"),
134
+ url("Inter-ExtraBoldItalic.woff?v=3.19") format("woff");
135
+ }
136
+
137
+ @font-face {
138
+ font-family: 'Inter';
139
+ font-style: normal;
140
+ font-weight: 900;
141
+ font-display: swap;
142
+ src: url("Inter-Black.woff2?v=3.19") format("woff2"),
143
+ url("Inter-Black.woff?v=3.19") format("woff");
144
+ }
145
+ @font-face {
146
+ font-family: 'Inter';
147
+ font-style: italic;
148
+ font-weight: 900;
149
+ font-display: swap;
150
+ src: url("Inter-BlackItalic.woff2?v=3.19") format("woff2"),
151
+ url("Inter-BlackItalic.woff?v=3.19") format("woff");
152
+ }
153
+
154
+ /* -------------------------------------------------------
155
+ Variable font.
156
+ Usage:
157
+
158
+ html { font-family: 'Inter', sans-serif; }
159
+ @supports (font-variation-settings: normal) {
160
+ html { font-family: 'Inter var', sans-serif; }
161
+ }
162
+ */
163
+ @font-face {
164
+ font-family: 'Inter var';
165
+ font-weight: 100 900;
166
+ font-display: swap;
167
+ font-style: normal;
168
+ font-named-instance: 'Regular';
169
+ src: url("Inter-roman.var.woff2?v=3.19") format("woff2");
170
+ }
171
+ @font-face {
172
+ font-family: 'Inter var';
173
+ font-weight: 100 900;
174
+ font-display: swap;
175
+ font-style: italic;
176
+ font-named-instance: 'Italic';
177
+ src: url("Inter-italic.var.woff2?v=3.19") format("woff2");
178
+ }
179
+
180
+
181
+ /* --------------------------------------------------------------------------
182
+ [EXPERIMENTAL] Multi-axis, single variable font.
183
+
184
+ Slant axis is not yet widely supported (as of February 2019) and thus this
185
+ multi-axis single variable font is opt-in rather than the default.
186
+
187
+ When using this, you will probably need to set font-variation-settings
188
+ explicitly, e.g.
189
+
190
+ * { font-variation-settings: "slnt" 0deg }
191
+ .italic { font-variation-settings: "slnt" 10deg }
192
+
193
+ */
194
+ @font-face {
195
+ font-family: 'Inter var experimental';
196
+ font-weight: 100 900;
197
+ font-display: swap;
198
+ font-style: oblique 0deg 10deg;
199
+ src: url("Inter.var.woff2?v=3.19") format("woff2");
200
+ }
@@ -23,10 +23,10 @@ import { useQuery } from 'react-query';
23
23
  import { LiFi } from '../lifi';
24
24
  import { useWidgetConfig } from '../providers/WidgetProvider';
25
25
  export const useChains = () => {
26
- const { enabledChains } = useWidgetConfig();
26
+ const { disabledChains } = useWidgetConfig();
27
27
  const _a = useQuery(['chains'], () => __awaiter(void 0, void 0, void 0, function* () {
28
28
  const chains = yield LiFi.getChains();
29
- return chains.filter((chain) => enabledChains.includes(chain.id));
29
+ return chains.filter((chain) => !(disabledChains === null || disabledChains === void 0 ? void 0 : disabledChains.includes(chain.id)));
30
30
  })), { data } = _a, other = __rest(_a, ["data"]);
31
31
  const getChainById = useCallback((chainId) => {
32
32
  const chain = data === null || data === void 0 ? void 0 : data.find((chain) => chain.id === chainId);
@@ -5,18 +5,23 @@ export const useDebouncedWatch = (name, delay) => {
5
5
  name,
6
6
  });
7
7
  const [debouncedValue, setDebouncedValue] = useState(watchedValue);
8
+ const debouncedValueRef = useRef();
8
9
  const isMounted = useRef(false);
9
10
  useEffect(() => {
10
11
  if (isMounted.current) {
11
12
  const hasWatchedValue = Array.isArray(watchedValue)
12
13
  ? watchedValue.some((value) => value)
13
- : watchedValue;
14
- if (hasWatchedValue) {
14
+ : Boolean(watchedValue);
15
+ const hasDebouncedValue = Array.isArray(debouncedValueRef.current)
16
+ ? debouncedValueRef.current.some((value) => value)
17
+ : Boolean(debouncedValueRef.current);
18
+ if (hasWatchedValue && hasDebouncedValue) {
15
19
  const handler = setTimeout(() => {
16
20
  setDebouncedValue(watchedValue);
17
21
  }, delay);
18
22
  return () => clearTimeout(handler);
19
23
  }
24
+ debouncedValueRef.current = watchedValue;
20
25
  setDebouncedValue(watchedValue);
21
26
  return undefined;
22
27
  }
@@ -15,9 +15,9 @@ import { useWallet } from '../../providers/WalletProvider';
15
15
  import { deepClone } from '../../utils/deepClone';
16
16
  import { useRouteStore } from './useRouteStore';
17
17
  export const useRouteExecution = (routeId) => {
18
+ const { account, switchChain } = useWallet();
18
19
  const { route, status } = useRouteStore((state) => state.routes[routeId]);
19
20
  const [updateRoute, restartRoute, removeRoute] = useRouteStore((state) => [state.updateRoute, state.restartRoute, state.removeRoute], shallow);
20
- const { account, switchChain } = useWallet();
21
21
  const updateCallback = (updatedRoute) => {
22
22
  console.log('Route updated.', updatedRoute);
23
23
  updateRoute(deepClone(updatedRoute));
@@ -104,9 +104,9 @@ export const useRouteExecution = (routeId) => {
104
104
  }, [resumeRouteMutation, routeId]);
105
105
  const restartRouteMutation = useCallback(() => {
106
106
  restartRoute(routeId);
107
- resumeRoute(useRouteStore.getState().routes[routeId].route);
107
+ resumeRoute(route);
108
108
  // eslint-disable-next-line react-hooks/exhaustive-deps
109
- }, [resumeRoute, routeId]);
109
+ }, [resumeRoute, route, routeId]);
110
110
  const removeRouteMutation = useCallback(() => {
111
111
  removeRoute(routeId);
112
112
  // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
9
9
  };
10
10
  import { useEffect } from 'react';
11
11
  import { useWatch } from 'react-hook-form';
12
- import { useQuery } from 'react-query';
12
+ import { useQuery, useQueryClient } from 'react-query';
13
13
  import { useDebouncedWatch, useToken } from '.';
14
14
  import { LiFi } from '../lifi';
15
15
  import { SwapFormKey } from '../providers/SwapFormProvider';
@@ -17,9 +17,11 @@ import { useWallet } from '../providers/WalletProvider';
17
17
  import { useCurrentRoute } from './useRouteExecution';
18
18
  const refetchTime = 60000;
19
19
  export const useSwapRoutes = () => {
20
+ var _a;
20
21
  const { account } = useWallet();
22
+ const queryClient = useQueryClient();
21
23
  const [currentRoute, setCurrentRoute] = useCurrentRoute();
22
- const [fromChainId, fromTokenAddress, toChainId, toTokenAddress, slippage, enabledBridges, enabledExchanges,] = useWatch({
24
+ const [fromChainId, fromTokenAddress, toChainId, toTokenAddress, slippage, enabledBridges, enabledExchanges, routePriority,] = useWatch({
23
25
  name: [
24
26
  SwapFormKey.FromChain,
25
27
  SwapFormKey.FromToken,
@@ -28,6 +30,7 @@ export const useSwapRoutes = () => {
28
30
  SwapFormKey.Slippage,
29
31
  SwapFormKey.EnabledBridges,
30
32
  SwapFormKey.EnabledExchanges,
33
+ SwapFormKey.RoutePriority,
31
34
  ],
32
35
  });
33
36
  const [fromTokenAmount] = useDebouncedWatch([SwapFormKey.FromAmount], 500);
@@ -40,7 +43,7 @@ export const useSwapRoutes = () => {
40
43
  Boolean(fromTokenAmount) &&
41
44
  !isNaN(fromTokenAmount) &&
42
45
  !isNaN(slippage);
43
- const { data, isLoading, isFetching, dataUpdatedAt, refetch } = useQuery([
46
+ const queryKey = [
44
47
  'routes',
45
48
  account.address,
46
49
  fromChainId,
@@ -51,13 +54,19 @@ export const useSwapRoutes = () => {
51
54
  slippage,
52
55
  enabledBridges,
53
56
  enabledExchanges,
54
- ], ({ queryKey: [_, address, fromChainId, fromTokenAddress, fromTokenAmount, toChainId, toTokenAddress, slippage, enabledBridges, enabledExchanges,], signal, }) => __awaiter(void 0, void 0, void 0, function* () {
55
- var _a;
57
+ routePriority,
58
+ ];
59
+ const previousDataUpdatedAt = (_a = queryClient.getQueryState(queryKey)) === null || _a === void 0 ? void 0 : _a.dataUpdatedAt;
60
+ const refetchInterval = previousDataUpdatedAt
61
+ ? Math.min(Math.abs(refetchTime - (Date.now() - previousDataUpdatedAt)), refetchTime)
62
+ : refetchTime;
63
+ const { data, isLoading, isFetching, dataUpdatedAt, refetch } = useQuery(queryKey, ({ queryKey: [_, address, fromChainId, fromTokenAddress, fromTokenAmount, toChainId, toTokenAddress, slippage, enabledBridges, enabledExchanges, routePriority,], signal, }) => __awaiter(void 0, void 0, void 0, function* () {
64
+ var _b;
56
65
  return LiFi.getRoutes({
57
66
  fromChainId,
58
67
  // TODO: simplify
59
68
  fromAmount: (Number(fromTokenAmount) *
60
- Math.pow(10, ((_a = token === null || token === void 0 ? void 0 : token.decimals) !== null && _a !== void 0 ? _a : 0))).toFixed(0),
69
+ Math.pow(10, ((_b = token === null || token === void 0 ? void 0 : token.decimals) !== null && _b !== void 0 ? _b : 0))).toFixed(0),
61
70
  fromTokenAddress,
62
71
  toChainId,
63
72
  toTokenAddress,
@@ -71,14 +80,14 @@ export const useSwapRoutes = () => {
71
80
  exchanges: {
72
81
  allow: enabledExchanges,
73
82
  },
83
+ order: routePriority,
74
84
  },
75
85
  }, { signal });
76
86
  }), {
77
87
  enabled: isEnabled,
78
88
  refetchIntervalInBackground: true,
79
- refetchInterval: refetchTime,
89
+ refetchInterval,
80
90
  staleTime: refetchTime,
81
- // TODO: probably should be removed
82
91
  cacheTime: refetchTime,
83
92
  });
84
93
  useEffect(() => {