@rango-dev/widget-embedded 0.10.0 → 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 (33) hide show
  1. package/dist/components/Layout.d.ts.map +1 -1
  2. package/dist/components/SwitchFromAndTo.d.ts +2 -3
  3. package/dist/components/SwitchFromAndTo.d.ts.map +1 -1
  4. package/dist/index.js +1 -1
  5. package/dist/index.js.map +4 -4
  6. package/dist/pages/ConfirmSwapPage.d.ts.map +1 -1
  7. package/dist/pages/Home.d.ts.map +1 -1
  8. package/dist/pages/SwapDetailsPage.d.ts.map +1 -1
  9. package/dist/utils/numbers.d.ts.map +1 -1
  10. package/package.json +2 -2
  11. package/src/components/Layout.tsx +12 -65
  12. package/src/components/SwitchFromAndTo.tsx +34 -4
  13. package/src/pages/ConfirmSwapPage.tsx +20 -9
  14. package/src/pages/Home.tsx +101 -144
  15. package/src/pages/SwapDetailsPage.tsx +5 -2
  16. package/src/utils/numbers.ts +2 -0
  17. package/dist/components/PercentageChange.d.ts +0 -9
  18. package/dist/components/PercentageChange.d.ts.map +0 -1
  19. package/dist/components/RoutesOverview.d.ts +0 -120
  20. package/dist/components/RoutesOverview.d.ts.map +0 -1
  21. package/dist/components/SwapDetailsPlaceholder.d.ts +0 -120
  22. package/dist/components/SwapDetailsPlaceholder.d.ts.map +0 -1
  23. package/dist/components/TokenInfo.d.ts +0 -18
  24. package/dist/components/TokenInfo.d.ts.map +0 -1
  25. package/dist/components/TokenPreview.d.ts +0 -21
  26. package/dist/components/TokenPreview.d.ts.map +0 -1
  27. package/src/components/PercentageChange.tsx +0 -33
  28. package/src/components/RoutesOverview.tsx +0 -57
  29. package/src/components/SwapDetailsPlaceholder.tsx +0 -47
  30. package/src/components/TokenInfo.tsx +0 -329
  31. package/src/components/TokenPreview.tsx +0 -187
  32. package/src/languages/en.json +0 -14
  33. 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
- }