@rango-dev/widget-embedded 0.9.1-next.2 → 0.10.1-next.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 (34) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/components/Layout.d.ts.map +1 -1
  3. package/dist/components/SwitchFromAndTo.d.ts +2 -3
  4. package/dist/components/SwitchFromAndTo.d.ts.map +1 -1
  5. package/dist/index.js +1 -1
  6. package/dist/index.js.map +4 -4
  7. package/dist/pages/ConfirmSwapPage.d.ts.map +1 -1
  8. package/dist/pages/Home.d.ts.map +1 -1
  9. package/dist/pages/SwapDetailsPage.d.ts.map +1 -1
  10. package/dist/utils/numbers.d.ts.map +1 -1
  11. package/package.json +8 -8
  12. package/src/components/Layout.tsx +12 -65
  13. package/src/components/SwitchFromAndTo.tsx +34 -4
  14. package/src/pages/ConfirmSwapPage.tsx +20 -9
  15. package/src/pages/Home.tsx +101 -144
  16. package/src/pages/SwapDetailsPage.tsx +5 -2
  17. package/src/utils/numbers.ts +2 -0
  18. package/dist/components/PercentageChange.d.ts +0 -9
  19. package/dist/components/PercentageChange.d.ts.map +0 -1
  20. package/dist/components/RoutesOverview.d.ts +0 -120
  21. package/dist/components/RoutesOverview.d.ts.map +0 -1
  22. package/dist/components/SwapDetailsPlaceholder.d.ts +0 -120
  23. package/dist/components/SwapDetailsPlaceholder.d.ts.map +0 -1
  24. package/dist/components/TokenInfo.d.ts +0 -18
  25. package/dist/components/TokenInfo.d.ts.map +0 -1
  26. package/dist/components/TokenPreview.d.ts +0 -21
  27. package/dist/components/TokenPreview.d.ts.map +0 -1
  28. package/src/components/PercentageChange.tsx +0 -33
  29. package/src/components/RoutesOverview.tsx +0 -57
  30. package/src/components/SwapDetailsPlaceholder.tsx +0 -47
  31. package/src/components/TokenInfo.tsx +0 -329
  32. package/src/components/TokenPreview.tsx +0 -187
  33. package/src/languages/en.json +0 -14
  34. package/src/languages/tr.json +0 -11
@@ -1,120 +0,0 @@
1
- import React from 'react';
2
- import { BestRouteResponse } from 'rango-sdk';
3
- export declare const Container: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
4
- sm: string;
5
- md: string;
6
- lg: string;
7
- }, import("@stitches/react/types/css-util").CSS<{
8
- sm: string;
9
- md: string;
10
- lg: string;
11
- }, {
12
- colors: {
13
- primary: string;
14
- primary100: string;
15
- primary200: string;
16
- primary300: string;
17
- primary400: string;
18
- primary500: string;
19
- primary600: string;
20
- primary700: string;
21
- primary800: string;
22
- primary900: string;
23
- surface: string;
24
- neutral100: string;
25
- neutral200: string;
26
- neutral300: string;
27
- neutral400: string;
28
- neutral500: string;
29
- neutral600: string;
30
- neutral700: string;
31
- neutral800: string;
32
- neutral900: string;
33
- background: string;
34
- foreground: string;
35
- success: string;
36
- success100: string;
37
- success300: string;
38
- success500: string;
39
- success700: string;
40
- warning: string;
41
- warning100: string;
42
- warning300: string;
43
- warning500: string;
44
- warning700: string;
45
- error: string;
46
- error100: string;
47
- error300: string;
48
- error500: string;
49
- error700: string;
50
- white: string;
51
- };
52
- space: {
53
- 2: string;
54
- 4: string;
55
- 6: string;
56
- 8: string;
57
- 10: string;
58
- 12: string;
59
- 16: string;
60
- 20: string;
61
- 24: string;
62
- 28: string;
63
- 30: string;
64
- 32: string;
65
- };
66
- fontSizes: {
67
- 10: string;
68
- 12: string;
69
- 14: string;
70
- 16: string;
71
- 18: string;
72
- 20: string;
73
- 24: string;
74
- 32: string;
75
- 36: string;
76
- 40: string;
77
- 48: string;
78
- };
79
- fonts: {};
80
- fontWeights: {
81
- 400: string;
82
- 500: string;
83
- 600: string;
84
- 700: string;
85
- };
86
- lineHeights: {};
87
- letterSpacings: {};
88
- sizes: {
89
- 4: string;
90
- 6: string;
91
- 8: string;
92
- 12: string;
93
- 16: string;
94
- 20: string;
95
- 24: string;
96
- 28: string;
97
- 32: string;
98
- 36: string;
99
- 40: string;
100
- 48: string;
101
- };
102
- borderWidths: {};
103
- borderStyles: {};
104
- radii: {
105
- 5: string;
106
- 10: string;
107
- };
108
- shadows: {
109
- s: string;
110
- };
111
- zIndices: {};
112
- transitions: {};
113
- }, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
114
- interface PropTypes {
115
- routes: BestRouteResponse | null;
116
- totalFee?: string;
117
- }
118
- declare function RoutesOverview(props: PropTypes): React.JSX.Element | null;
119
- export default RoutesOverview;
120
- //# sourceMappingURL=RoutesOverview.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RoutesOverview.d.ts","sourceRoot":"","sources":["../../src/components/RoutesOverview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAE9C,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAkBpB,CAAC;AAEH,UAAU,SAAS;IACjB,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AACD,iBAAS,cAAc,CAAC,KAAK,EAAE,SAAS,4BA0BvC;AAED,eAAe,cAAc,CAAC"}
@@ -1,120 +0,0 @@
1
- import React from 'react';
2
- export declare const LoaderContainer: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
3
- sm: string;
4
- md: string;
5
- lg: string;
6
- }, import("@stitches/react/types/css-util").CSS<{
7
- sm: string;
8
- md: string;
9
- lg: string;
10
- }, {
11
- colors: {
12
- primary: string;
13
- primary100: string;
14
- primary200: string;
15
- primary300: string;
16
- primary400: string;
17
- primary500: string;
18
- primary600: string;
19
- primary700: string;
20
- primary800: string;
21
- primary900: string;
22
- surface: string;
23
- neutral100: string;
24
- neutral200: string;
25
- neutral300: string;
26
- neutral400: string;
27
- neutral500: string;
28
- neutral600: string;
29
- neutral700: string;
30
- neutral800: string;
31
- neutral900: string;
32
- background: string;
33
- foreground: string;
34
- success: string;
35
- success100: string;
36
- success300: string;
37
- success500: string;
38
- success700: string;
39
- warning: string;
40
- warning100: string;
41
- warning300: string;
42
- warning500: string;
43
- warning700: string;
44
- error: string;
45
- error100: string;
46
- error300: string;
47
- error500: string;
48
- error700: string;
49
- white: string;
50
- };
51
- space: {
52
- 2: string;
53
- 4: string;
54
- 6: string;
55
- 8: string;
56
- 10: string;
57
- 12: string;
58
- 16: string;
59
- 20: string;
60
- 24: string;
61
- 28: string;
62
- 30: string;
63
- 32: string;
64
- };
65
- fontSizes: {
66
- 10: string;
67
- 12: string;
68
- 14: string;
69
- 16: string;
70
- 18: string;
71
- 20: string;
72
- 24: string;
73
- 32: string;
74
- 36: string;
75
- 40: string;
76
- 48: string;
77
- };
78
- fonts: {};
79
- fontWeights: {
80
- 400: string;
81
- 500: string;
82
- 600: string;
83
- 700: string;
84
- };
85
- lineHeights: {};
86
- letterSpacings: {};
87
- sizes: {
88
- 4: string;
89
- 6: string;
90
- 8: string;
91
- 12: string;
92
- 16: string;
93
- 20: string;
94
- 24: string;
95
- 28: string;
96
- 32: string;
97
- 36: string;
98
- 40: string;
99
- 48: string;
100
- };
101
- borderWidths: {};
102
- borderStyles: {};
103
- radii: {
104
- 5: string;
105
- 10: string;
106
- };
107
- shadows: {
108
- s: string;
109
- };
110
- zIndices: {};
111
- transitions: {};
112
- }, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
113
- interface PropTypes {
114
- requestId: string;
115
- loading: boolean;
116
- onBack: () => void;
117
- }
118
- export declare function SwapDetailsPlaceholder(props: PropTypes): React.JSX.Element;
119
- export {};
120
- //# sourceMappingURL=SwapDetailsPlaceholder.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SwapDetailsPlaceholder.d.ts","sourceRoot":"","sources":["../../src/components/SwapDetailsPlaceholder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAM1B,CAAC;AAEH,UAAU,SAAS;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,SAAS,qBA0BtD"}
@@ -1,18 +0,0 @@
1
- import React from 'react';
2
- import { BlockchainMeta, Token } from 'rango-sdk';
3
- import BigNumber from 'bignumber.js';
4
- type PropTypes = ({
5
- type: 'From';
6
- inputAmount: string;
7
- onAmountChange: (amount: string) => void;
8
- } | {
9
- type: 'To';
10
- outputAmount: BigNumber | null;
11
- outputUsdValue: BigNumber | null;
12
- }) & {
13
- chain: BlockchainMeta | null;
14
- token: Token | null;
15
- };
16
- export declare function TokenInfo(props: PropTypes): React.JSX.Element;
17
- export {};
18
- //# sourceMappingURL=TokenInfo.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TokenInfo.d.ts","sourceRoot":"","sources":["../../src/components/TokenInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAIlD,OAAO,SAAS,MAAM,cAAc,CAAC;AAOrC,KAAK,SAAS,GAAG,CACb;IACE,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C,GACD;IACE,IAAI,EAAE,IAAI,CAAC;IACX,YAAY,EAAE,SAAS,GAAG,IAAI,CAAC;IAC/B,cAAc,EAAE,SAAS,GAAG,IAAI,CAAC;CAClC,CACJ,GAAG;IAAE,KAAK,EAAE,cAAc,GAAG,IAAI,CAAC;IAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;CAAE,CAAC;AA4F1D,wBAAgB,SAAS,CAAC,KAAK,EAAE,SAAS,qBA0MzC"}
@@ -1,21 +0,0 @@
1
- import React, { ReactNode } from 'react';
2
- import { LoadingStatus } from '../store/meta';
3
- import BigNumber from 'bignumber.js';
4
- interface PropTypes {
5
- label: string;
6
- amount: string;
7
- usdValue: BigNumber | null;
8
- loadingStatus: LoadingStatus;
9
- chain: {
10
- displayName: string;
11
- logo: string;
12
- };
13
- token: {
14
- symbol: string;
15
- image: string;
16
- };
17
- percentageChange?: ReactNode;
18
- }
19
- export declare function TokenPreview(props: PropTypes): React.JSX.Element;
20
- export {};
21
- //# sourceMappingURL=TokenPreview.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TokenPreview.d.ts","sourceRoot":"","sources":["../../src/components/TokenPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASzC,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,SAAS,MAAM,cAAc,CAAC;AA8ErC,UAAU,SAAS;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,SAAS,GAAG,IAAI,CAAC;IAC3B,aAAa,EAAE,aAAa,CAAC;IAC7B,KAAK,EAAE;QACL,WAAW,EAAE,MAAM,CAAC;QACpB,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,KAAK,EAAE;QACL,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAC9B;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,SAAS,qBAiF5C"}
@@ -1,33 +0,0 @@
1
- import BigNumber from 'bignumber.js';
2
- import React from 'react';
3
- import { getPercentageChange } from '../utils/swap';
4
- import { Typography } from '@rango-dev/ui';
5
- import { numberToString } from '../utils/numbers';
6
-
7
- interface PropTypes {
8
- inputUsdValue: BigNumber | null;
9
- outputUsdValue: BigNumber | null;
10
- }
11
-
12
- export function PercentageChange(props: PropTypes) {
13
- const { inputUsdValue, outputUsdValue } = props;
14
-
15
- if (!inputUsdValue || !outputUsdValue || !outputUsdValue.gt(0)) return null;
16
-
17
- const percentageChange = getPercentageChange(
18
- inputUsdValue.toNumber(),
19
- outputUsdValue.toNumber()
20
- );
21
-
22
- const showPercentageChange = percentageChange?.lt(0);
23
-
24
- return (
25
- <>
26
- {showPercentageChange && (
27
- <Typography variant="caption" color="$error500">
28
- {`(${numberToString(percentageChange, 0, 2)}%)`}
29
- </Typography>
30
- )}
31
- </>
32
- );
33
- }
@@ -1,57 +0,0 @@
1
- import React from 'react';
2
- import { styled, ChevronRightIcon, GasIcon, Divider } from '@rango-dev/ui';
3
- import { BestRouteResponse } from 'rango-sdk';
4
-
5
- export const Container = styled('div', {
6
- display: 'flex',
7
- alignItems: 'center',
8
- justifyContent: 'space-between',
9
- padding: '$8',
10
- borderRadius: '$5',
11
- backgroundColor: '$neutral100',
12
- color: '$neutral800',
13
- fontSize: '$12',
14
-
15
- '.routes': {
16
- display: 'flex',
17
- alignItems: 'center',
18
- },
19
- '.fee': {
20
- display: 'flex',
21
- alignItems: 'center',
22
- },
23
- });
24
-
25
- interface PropTypes {
26
- routes: BestRouteResponse | null;
27
- totalFee?: string;
28
- }
29
- function RoutesOverview(props: PropTypes) {
30
- if (!props.routes) return null;
31
-
32
- const swaps = props.routes.result?.swaps;
33
- return (
34
- <Container>
35
- <div className="routes">
36
- {swaps?.map((swap, idx) => {
37
- const isLast = idx + 1 == swaps.length;
38
- return (
39
- <React.Fragment key={idx}>
40
- <div className="route">{swap.from.symbol}</div>
41
- <ChevronRightIcon size={12} />
42
- {isLast ? <div className="route">{swap.to.symbol}</div> : null}
43
- </React.Fragment>
44
- );
45
- })}
46
- </div>
47
- {props.totalFee ? (
48
- <div className="fee">
49
- <GasIcon size={12} />
50
- <Divider size={4} direction="horizontal" />${props.totalFee}
51
- </div>
52
- ) : null}
53
- </Container>
54
- );
55
- }
56
-
57
- export default RoutesOverview;
@@ -1,47 +0,0 @@
1
- import React from 'react';
2
- import { SecondaryPage, Spinner, Alert, styled } from '@rango-dev/ui';
3
- import { i18n } from '@lingui/core';
4
-
5
- const PlaceholderContainer = styled('div', { height: '450px' });
6
-
7
- export const LoaderContainer = styled('div', {
8
- display: 'flex',
9
- justifyContent: 'center',
10
- width: '100%',
11
- paddingTop: '33%',
12
- flex: 1,
13
- });
14
-
15
- interface PropTypes {
16
- requestId: string;
17
- loading: boolean;
18
- onBack: () => void;
19
- }
20
-
21
- export function SwapDetailsPlaceholder(props: PropTypes) {
22
- const { requestId, loading, onBack } = props;
23
-
24
- return (
25
- <SecondaryPage
26
- title={i18n.t('Swap Details')}
27
- textField={false}
28
- onBack={onBack}>
29
- <PlaceholderContainer>
30
- {loading ? (
31
- <LoaderContainer>
32
- <Spinner size={24} />
33
- </LoaderContainer>
34
- ) : (
35
- <Alert
36
- type="secondary"
37
- title={i18n.t(
38
- 'swapNotFound',
39
- { requestId },
40
- { message: 'Swap with request ID = ${requestId} not found.' }
41
- )}
42
- />
43
- )}
44
- </PlaceholderContainer>
45
- </SecondaryPage>
46
- );
47
- }