@rango-dev/ui 0.53.1-next.3 → 0.53.1-next.4
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.
- package/dist/index.js +1 -1
- package/dist/index.js.map +4 -4
- package/dist/ui.build.json +1 -1
- package/dist/widget/ui/src/components/Alert/Alert.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/FullExpandedQuote/FullExpandedQuote.TokenSection.d.ts.map +1 -1
- package/dist/widget/ui/src/components/FullExpandedQuote/FullExpandedQuote.d.ts.map +1 -1
- package/dist/widget/ui/src/components/FullExpandedQuote/FullExpandedQuote.styles.d.ts +213 -49
- package/dist/widget/ui/src/components/FullExpandedQuote/FullExpandedQuote.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/PriceImpact/PriceImpact.d.ts.map +1 -1
- package/dist/widget/ui/src/components/PriceImpact/PriceImpact.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/PriceImpact/PriceImpact.types.d.ts +2 -0
- package/dist/widget/ui/src/components/PriceImpact/PriceImpact.types.d.ts.map +1 -1
- package/dist/widget/ui/src/components/StepDetails/StepDetails.d.ts.map +1 -1
- package/dist/widget/ui/src/components/StepDetails/StepDetails.styles.d.ts +324 -0
- package/dist/widget/ui/src/components/StepDetails/StepDetails.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/SwapListItem/SwapToken.d.ts.map +1 -1
- package/dist/widget/ui/src/components/SwapListItem/SwapToken.styles.d.ts +484 -0
- package/dist/widget/ui/src/components/SwapListItem/SwapToken.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/Toast/Toast.styles.d.ts +3 -2
- package/dist/widget/ui/src/components/Toast/Toast.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/TokenAmount/TokenAmount.d.ts.map +1 -1
- package/dist/widget/ui/src/components/TokenAmount/TokenAmount.styles.d.ts +1285 -1
- package/dist/widget/ui/src/components/TokenAmount/TokenAmount.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/Tooltip/Tooltip.styles.d.ts +3 -2
- package/dist/widget/ui/src/components/Tooltip/Tooltip.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/components/Typography/NotSelectableTypography.d.ts +3 -2
- package/dist/widget/ui/src/components/Typography/NotSelectableTypography.d.ts.map +1 -1
- package/dist/widget/ui/src/components/Typography/Typography.d.ts +3 -2
- package/dist/widget/ui/src/components/Typography/Typography.d.ts.map +1 -1
- package/dist/widget/ui/src/components/Wallet/Wallet.styles.d.ts +3 -2
- package/dist/widget/ui/src/components/Wallet/Wallet.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/containers/SwapInput/SwapInput.d.ts.map +1 -1
- package/dist/widget/ui/src/containers/SwapInput/SwapInput.styles.d.ts +3 -2
- package/dist/widget/ui/src/containers/SwapInput/SwapInput.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/containers/SwapInput/TokenSection.styles.d.ts +169 -3
- package/dist/widget/ui/src/containers/SwapInput/TokenSection.styles.d.ts.map +1 -1
- package/dist/widget/ui/src/hooks/index.d.ts +1 -0
- package/dist/widget/ui/src/hooks/index.d.ts.map +1 -1
- package/dist/widget/ui/src/hooks/useIsTruncated.d.ts +3 -0
- package/dist/widget/ui/src/hooks/useIsTruncated.d.ts.map +1 -0
- package/package.json +1 -1
- package/src/components/Alert/Alert.styles.ts +3 -0
- package/src/components/FullExpandedQuote/FullExpandedQuote.TokenSection.tsx +18 -5
- package/src/components/FullExpandedQuote/FullExpandedQuote.styles.ts +11 -3
- package/src/components/FullExpandedQuote/FullExpandedQuote.tsx +13 -3
- package/src/components/PriceImpact/PriceImpact.styles.ts +8 -3
- package/src/components/PriceImpact/PriceImpact.tsx +27 -17
- package/src/components/PriceImpact/PriceImpact.types.ts +2 -0
- package/src/components/StepDetails/StepDetails.styles.ts +15 -0
- package/src/components/StepDetails/StepDetails.tsx +33 -8
- package/src/components/SwapListItem/SwapToken.styles.ts +16 -1
- package/src/components/SwapListItem/SwapToken.tsx +97 -25
- package/src/components/Toast/Toast.styles.ts +2 -0
- package/src/components/TokenAmount/TokenAmount.styles.ts +60 -2
- package/src/components/TokenAmount/TokenAmount.tsx +98 -38
- package/src/components/Typography/Typography.tsx +15 -15
- package/src/containers/SwapInput/SwapInput.styles.ts +2 -1
- package/src/containers/SwapInput/SwapInput.tsx +18 -35
- package/src/containers/SwapInput/TokenSection.styles.ts +7 -0
- package/src/hooks/index.ts +1 -0
- package/src/hooks/useIsTruncated.tsx +27 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TokenAmount.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TokenAmount/TokenAmount.styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TokenAmount.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TokenAmount/TokenAmount.styles.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as RadixTooltip from '@radix-ui/react-tooltip';
|
|
2
|
-
import { Typography } from '../Typography/index.js';
|
|
3
2
|
export declare const TooltipContent: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<RadixTooltip.TooltipContentProps & import("react").RefAttributes<HTMLDivElement>>, {}, {
|
|
4
3
|
xs: string;
|
|
5
4
|
sm: string;
|
|
@@ -160,7 +159,9 @@ export declare const TooltipContent: import("@stitches/react/types/styled-compon
|
|
|
160
159
|
zIndices: {};
|
|
161
160
|
transitions: {};
|
|
162
161
|
}, import("@stitches/react/types/config.js").DefaultThemeMap, {}>>;
|
|
163
|
-
export declare const TooltipTypography: import("@stitches/react/types/styled-component.js").StyledComponent<
|
|
162
|
+
export declare const TooltipTypography: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<import("../Typography/Typography.types.js").TypographyPropTypes & {
|
|
163
|
+
children?: import("react").ReactNode | undefined;
|
|
164
|
+
} & import("react").RefAttributes<HTMLSpanElement>>, {}, {
|
|
164
165
|
xs: string;
|
|
165
166
|
sm: string;
|
|
166
167
|
md: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tooltip/Tooltip.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"Tooltip.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tooltip/Tooltip.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,yBAAyB,CAAC;AAKxD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAEzB,CAAC;AAEH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAQ5B,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAIzB,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
export declare const NotSelectableTypography: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<import("./Typography.types.js").TypographyPropTypes & {
|
|
2
|
+
children?: import("react").ReactNode | undefined;
|
|
3
|
+
} & import("react").RefAttributes<HTMLSpanElement>>, {}, {
|
|
3
4
|
xs: string;
|
|
4
5
|
sm: string;
|
|
5
6
|
md: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotSelectableTypography.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Typography/NotSelectableTypography.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"NotSelectableTypography.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Typography/NotSelectableTypography.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAElC,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { TypographyPropTypes } from './Typography.types.js';
|
|
2
|
-
import type { PropsWithChildren } from 'react';
|
|
3
2
|
import React from 'react';
|
|
4
|
-
export declare
|
|
3
|
+
export declare const Typography: React.ForwardRefExoticComponent<TypographyPropTypes & {
|
|
4
|
+
children?: React.ReactNode | undefined;
|
|
5
|
+
} & React.RefAttributes<HTMLSpanElement>>;
|
|
5
6
|
//# sourceMappingURL=Typography.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Typography/Typography.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Typography/Typography.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAGjE,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,UAAU;;yCAoBrB,CAAC"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { Typography } from '../Typography/index.js';
|
|
2
1
|
export declare const WalletImageContainer: import("@stitches/react/types/styled-component.js").StyledComponent<"div", {}, {
|
|
3
2
|
xs: string;
|
|
4
3
|
sm: string;
|
|
@@ -159,7 +158,9 @@ export declare const WalletImageContainer: import("@stitches/react/types/styled-
|
|
|
159
158
|
zIndices: {};
|
|
160
159
|
transitions: {};
|
|
161
160
|
}, import("@stitches/react/types/config.js").DefaultThemeMap, {}>>;
|
|
162
|
-
export declare const Title: import("@stitches/react/types/styled-component.js").StyledComponent<
|
|
161
|
+
export declare const Title: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<import("../Typography/Typography.types.js").TypographyPropTypes & {
|
|
162
|
+
children?: import("react").ReactNode | undefined;
|
|
163
|
+
} & import("react").RefAttributes<HTMLSpanElement>>, {}, {
|
|
163
164
|
xs: string;
|
|
164
165
|
sm: string;
|
|
165
166
|
md: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Wallet.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Wallet/Wallet.styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Wallet.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Wallet/Wallet.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAI/B,CAAC;AAEH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAEhB,CAAC;AAEH,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAIf,CAAC;AAEH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAgDvB,CAAC;AAEH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAQjC,CAAC;AAEH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kEAUxB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwapInput.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAG/D,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"SwapInput.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAG/D,OAAO,KAAK,MAAM,OAAO,CAAC;AAyB1B,wBAAgB,SAAS,CAAC,KAAK,EAAE,kBAAkB,qBAqIlD"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { Typography } from '../../components/index.js';
|
|
2
1
|
export declare const textStyles: import("@stitches/react/types/styled-component.js").CssComponent<never, {}, {
|
|
3
2
|
xs: string;
|
|
4
3
|
sm: string;
|
|
@@ -2056,7 +2055,9 @@ export declare const labelContainerStyles: import("@stitches/react/types/styled-
|
|
|
2056
2055
|
zIndices: {};
|
|
2057
2056
|
transitions: {};
|
|
2058
2057
|
}, import("@stitches/react/types/config.js").DefaultThemeMap, {}>>;
|
|
2059
|
-
export declare const UsdPrice: import("@stitches/react/types/styled-component.js").StyledComponent<
|
|
2058
|
+
export declare const UsdPrice: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<import("../../components/index.js").TypographyPropTypes & {
|
|
2059
|
+
children?: import("react").ReactNode | undefined;
|
|
2060
|
+
} & import("react").RefAttributes<HTMLSpanElement>>, {}, {
|
|
2060
2061
|
xs: string;
|
|
2061
2062
|
sm: string;
|
|
2062
2063
|
md: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwapInput.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SwapInput.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.styles.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type TooltipPropTypes
|
|
1
|
+
import { type TooltipPropTypes } from '../../components/index.js';
|
|
2
2
|
export declare const Container: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<{
|
|
3
3
|
id?: string | undefined | undefined;
|
|
4
4
|
slot?: string | undefined | undefined;
|
|
@@ -1239,7 +1239,9 @@ export declare const TitleContainer: import("@stitches/react/types/styled-compon
|
|
|
1239
1239
|
zIndices: {};
|
|
1240
1240
|
transitions: {};
|
|
1241
1241
|
}, import("@stitches/react/types/config.js").DefaultThemeMap, {}>>;
|
|
1242
|
-
export declare const Title: import("@stitches/react/types/styled-component.js").StyledComponent<
|
|
1242
|
+
export declare const Title: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<import("../../components/index.js").TypographyPropTypes & {
|
|
1243
|
+
children?: import("react").ReactNode | undefined;
|
|
1244
|
+
} & import("react").RefAttributes<HTMLSpanElement>>, {}, {
|
|
1243
1245
|
xs: string;
|
|
1244
1246
|
sm: string;
|
|
1245
1247
|
md: string;
|
|
@@ -1400,7 +1402,171 @@ export declare const Title: import("@stitches/react/types/styled-component.js").
|
|
|
1400
1402
|
transitions: {};
|
|
1401
1403
|
}, import("@stitches/react/types/config.js").DefaultThemeMap, {}>>;
|
|
1402
1404
|
export declare const SymbolTooltipStyles: TooltipPropTypes['styles'];
|
|
1403
|
-
export declare const SymbolTooltipContent: import("@stitches/react/types/styled-component.js").StyledComponent<
|
|
1405
|
+
export declare const SymbolTooltipContent: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<import("../../components/index.js").TypographyPropTypes & {
|
|
1406
|
+
children?: import("react").ReactNode | undefined;
|
|
1407
|
+
} & import("react").RefAttributes<HTMLSpanElement>>, {}, {
|
|
1408
|
+
xs: string;
|
|
1409
|
+
sm: string;
|
|
1410
|
+
md: string;
|
|
1411
|
+
lg: string;
|
|
1412
|
+
}, import("@stitches/react/types/css-util.js").CSS<{
|
|
1413
|
+
xs: string;
|
|
1414
|
+
sm: string;
|
|
1415
|
+
md: string;
|
|
1416
|
+
lg: string;
|
|
1417
|
+
}, {
|
|
1418
|
+
colors: {
|
|
1419
|
+
primary: string;
|
|
1420
|
+
primary500: string;
|
|
1421
|
+
primary550: string;
|
|
1422
|
+
secondary: string;
|
|
1423
|
+
secondary100: string;
|
|
1424
|
+
secondary150: string;
|
|
1425
|
+
secondary200: string;
|
|
1426
|
+
secondary250: string;
|
|
1427
|
+
secondary500: string;
|
|
1428
|
+
secondary550: string;
|
|
1429
|
+
neutral: string;
|
|
1430
|
+
neutral100: string;
|
|
1431
|
+
neutral200: string;
|
|
1432
|
+
neutral300: string;
|
|
1433
|
+
neutral400: string;
|
|
1434
|
+
neutral500: string;
|
|
1435
|
+
neutral600: string;
|
|
1436
|
+
neutral700: string;
|
|
1437
|
+
neutral800: string;
|
|
1438
|
+
neutral900: string;
|
|
1439
|
+
error100: string;
|
|
1440
|
+
error300: string;
|
|
1441
|
+
error500: string;
|
|
1442
|
+
error600: string;
|
|
1443
|
+
error700: string;
|
|
1444
|
+
warning100: string;
|
|
1445
|
+
warning300: string;
|
|
1446
|
+
warning500: string;
|
|
1447
|
+
warning600: string;
|
|
1448
|
+
warning700: string;
|
|
1449
|
+
info: string;
|
|
1450
|
+
info100: string;
|
|
1451
|
+
info300: string;
|
|
1452
|
+
info500: string;
|
|
1453
|
+
info600: string;
|
|
1454
|
+
info700: string;
|
|
1455
|
+
success100: string;
|
|
1456
|
+
success300: string;
|
|
1457
|
+
success500: string;
|
|
1458
|
+
success600: string;
|
|
1459
|
+
success700: string;
|
|
1460
|
+
background: string;
|
|
1461
|
+
foreground: string;
|
|
1462
|
+
};
|
|
1463
|
+
space: {
|
|
1464
|
+
0: string;
|
|
1465
|
+
5: string;
|
|
1466
|
+
10: string;
|
|
1467
|
+
15: string;
|
|
1468
|
+
20: string;
|
|
1469
|
+
25: string;
|
|
1470
|
+
30: string;
|
|
1471
|
+
40: string;
|
|
1472
|
+
46: string;
|
|
1473
|
+
50: string;
|
|
1474
|
+
60: string;
|
|
1475
|
+
70: string;
|
|
1476
|
+
80: string;
|
|
1477
|
+
90: string;
|
|
1478
|
+
100: string;
|
|
1479
|
+
2: string;
|
|
1480
|
+
4: string;
|
|
1481
|
+
6: string;
|
|
1482
|
+
8: string;
|
|
1483
|
+
12: string;
|
|
1484
|
+
16: string;
|
|
1485
|
+
24: string;
|
|
1486
|
+
28: string;
|
|
1487
|
+
32: string;
|
|
1488
|
+
36: string;
|
|
1489
|
+
};
|
|
1490
|
+
radii: {
|
|
1491
|
+
xs: string;
|
|
1492
|
+
sm: string;
|
|
1493
|
+
xm: string;
|
|
1494
|
+
md: string;
|
|
1495
|
+
xl: string;
|
|
1496
|
+
lg: string;
|
|
1497
|
+
primary: string;
|
|
1498
|
+
secondary: string;
|
|
1499
|
+
};
|
|
1500
|
+
fontSizes: {
|
|
1501
|
+
10: string;
|
|
1502
|
+
12: string;
|
|
1503
|
+
14: string;
|
|
1504
|
+
16: string;
|
|
1505
|
+
18: string;
|
|
1506
|
+
20: string;
|
|
1507
|
+
22: string;
|
|
1508
|
+
24: string;
|
|
1509
|
+
28: string;
|
|
1510
|
+
32: string;
|
|
1511
|
+
36: string;
|
|
1512
|
+
40: string;
|
|
1513
|
+
48: string;
|
|
1514
|
+
};
|
|
1515
|
+
fonts: {
|
|
1516
|
+
primary: string;
|
|
1517
|
+
widget: string;
|
|
1518
|
+
};
|
|
1519
|
+
fontWeights: {
|
|
1520
|
+
regular: number;
|
|
1521
|
+
medium: number;
|
|
1522
|
+
semiBold: number;
|
|
1523
|
+
bold: number;
|
|
1524
|
+
};
|
|
1525
|
+
lineHeights: {
|
|
1526
|
+
12: string;
|
|
1527
|
+
16: string;
|
|
1528
|
+
20: string;
|
|
1529
|
+
24: string;
|
|
1530
|
+
26: string;
|
|
1531
|
+
28: string;
|
|
1532
|
+
30: string;
|
|
1533
|
+
36: string;
|
|
1534
|
+
40: string;
|
|
1535
|
+
44: string;
|
|
1536
|
+
52: string;
|
|
1537
|
+
64: string;
|
|
1538
|
+
};
|
|
1539
|
+
letterSpacings: {};
|
|
1540
|
+
sizes: {
|
|
1541
|
+
4: string;
|
|
1542
|
+
6: string;
|
|
1543
|
+
8: string;
|
|
1544
|
+
10: string;
|
|
1545
|
+
12: string;
|
|
1546
|
+
16: string;
|
|
1547
|
+
18: string;
|
|
1548
|
+
20: string;
|
|
1549
|
+
24: string;
|
|
1550
|
+
26: string;
|
|
1551
|
+
28: string;
|
|
1552
|
+
30: string;
|
|
1553
|
+
32: string;
|
|
1554
|
+
36: string;
|
|
1555
|
+
40: string;
|
|
1556
|
+
45: string;
|
|
1557
|
+
48: string;
|
|
1558
|
+
};
|
|
1559
|
+
borderWidths: {};
|
|
1560
|
+
borderStyles: {};
|
|
1561
|
+
shadows: {
|
|
1562
|
+
mainContainer: string;
|
|
1563
|
+
};
|
|
1564
|
+
zIndices: {};
|
|
1565
|
+
transitions: {};
|
|
1566
|
+
}, import("@stitches/react/types/config.js").DefaultThemeMap, {}>>;
|
|
1567
|
+
export declare const BlockChainTypography: import("@stitches/react/types/styled-component.js").StyledComponent<import("react").ForwardRefExoticComponent<import("../../components/index.js").TypographyPropTypes & {
|
|
1568
|
+
children?: import("react").ReactNode | undefined;
|
|
1569
|
+
} & import("react").RefAttributes<HTMLSpanElement>>, {}, {
|
|
1404
1570
|
xs: string;
|
|
1405
1571
|
sm: string;
|
|
1406
1572
|
md: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TokenSection.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/TokenSection.styles.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,gBAAgB,
|
|
1
|
+
{"version":3,"file":"TokenSection.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/TokenSection.styles.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useIsTruncated.d.ts","sourceRoot":"","sources":["../../../../../src/hooks/useIsTruncated.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAuB,MAAM,OAAO,CAAC;AAO5D,wBAAgB,cAAc,CAC5B,OAAO,EAAE,MAAM,EACf,GAAG,EAAE,SAAS,CAAC,WAAW,CAAC,GAC1B,OAAO,CAgBT"}
|
package/package.json
CHANGED
|
@@ -1,17 +1,21 @@
|
|
|
1
1
|
import type { TokenSectionPropTypes } from './FullExpandedQuote.types.js';
|
|
2
2
|
|
|
3
3
|
import React from 'react';
|
|
4
|
+
import { InfoIcon } from 'src/icons/index.js';
|
|
4
5
|
|
|
5
6
|
import { ChainToken } from '../ChainToken/index.js';
|
|
7
|
+
import { textTruncate } from '../TokenAmount/TokenAmount.styles.js';
|
|
6
8
|
import { NumericTooltip } from '../Tooltip/index.js';
|
|
7
9
|
import { Typography } from '../Typography/index.js';
|
|
8
10
|
|
|
9
11
|
import {
|
|
12
|
+
AmountText,
|
|
10
13
|
TokenInfo,
|
|
11
|
-
tokenLabelStyles,
|
|
12
14
|
TokenSectionContainer,
|
|
13
15
|
} from './FullExpandedQuote.styles.js';
|
|
14
16
|
|
|
17
|
+
const MAX_AMOUNT_LENGTH_FOR_INFO_ICON = 6;
|
|
18
|
+
|
|
15
19
|
export function TokenSection(props: TokenSectionPropTypes) {
|
|
16
20
|
const {
|
|
17
21
|
style = {},
|
|
@@ -23,6 +27,7 @@ export function TokenSection(props: TokenSectionPropTypes) {
|
|
|
23
27
|
isInternalSwap,
|
|
24
28
|
size = 'xmedium',
|
|
25
29
|
} = props;
|
|
30
|
+
|
|
26
31
|
return (
|
|
27
32
|
<TokenSectionContainer style={style} isInternalSwap={isInternalSwap}>
|
|
28
33
|
<ChainToken size={size} chainImage={chainImage} tokenImage={tokenImage} />
|
|
@@ -32,14 +37,22 @@ export function TokenSection(props: TokenSectionPropTypes) {
|
|
|
32
37
|
container={tooltipProps?.container}
|
|
33
38
|
side="bottom"
|
|
34
39
|
open={tooltipProps?.open}>
|
|
35
|
-
<
|
|
40
|
+
<AmountText
|
|
36
41
|
size="xsmall"
|
|
37
42
|
variant="body"
|
|
38
|
-
className={
|
|
43
|
+
className={`${textTruncate()} ${
|
|
44
|
+
isInternalSwap ? 'internal_swap_amount_typography' : ''
|
|
45
|
+
}`}>
|
|
39
46
|
{amount}
|
|
40
|
-
</
|
|
47
|
+
</AmountText>
|
|
48
|
+
{amount && amount.length > MAX_AMOUNT_LENGTH_FOR_INFO_ICON && (
|
|
49
|
+
<InfoIcon color="gray" size={12} />
|
|
50
|
+
)}
|
|
41
51
|
</NumericTooltip>
|
|
42
|
-
<Typography
|
|
52
|
+
<Typography
|
|
53
|
+
size="xsmall"
|
|
54
|
+
variant="body"
|
|
55
|
+
className="token_label_typography">
|
|
43
56
|
{name}
|
|
44
57
|
</Typography>
|
|
45
58
|
</TokenInfo>
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { css, darkTheme, styled } from '../../theme.js';
|
|
2
2
|
import { PriceImpact } from '../PriceImpact/index.js';
|
|
3
|
-
|
|
4
|
-
export const tokenLabelStyles = css({});
|
|
3
|
+
import { Typography } from '../Typography/Typography.js';
|
|
5
4
|
|
|
6
5
|
export const FlexCenter = styled('div', {
|
|
7
6
|
display: 'flex',
|
|
@@ -135,7 +134,7 @@ export const TokenInfo = styled(FlexCenter, {
|
|
|
135
134
|
bottom: 0,
|
|
136
135
|
left: 0,
|
|
137
136
|
right: 0,
|
|
138
|
-
|
|
137
|
+
'& .internal_swap_amount_typography, & .token_label_typography': {
|
|
139
138
|
color: '$neutral700',
|
|
140
139
|
[`.${darkTheme} &`]: {
|
|
141
140
|
color: '$neutral900',
|
|
@@ -226,6 +225,7 @@ export const VerticalLine = styled('div', {
|
|
|
226
225
|
export const StyledPriceImpact = styled(PriceImpact, {
|
|
227
226
|
justifyContent: 'center',
|
|
228
227
|
gap: '$4',
|
|
228
|
+
maxWidth: 150,
|
|
229
229
|
});
|
|
230
230
|
|
|
231
231
|
export const lastStepStyle = css({
|
|
@@ -305,3 +305,11 @@ export const TooltipFooter = styled(FlexCenter, {
|
|
|
305
305
|
export const Icon = styled('div', {
|
|
306
306
|
paddingBottom: '$20',
|
|
307
307
|
});
|
|
308
|
+
|
|
309
|
+
export const OutputPriceValue = styled(Typography, {
|
|
310
|
+
maxWidth: '65px',
|
|
311
|
+
});
|
|
312
|
+
|
|
313
|
+
export const AmountText = styled(Typography, {
|
|
314
|
+
maxWidth: '34px',
|
|
315
|
+
});
|
|
@@ -4,11 +4,12 @@ import type { Tag } from 'rango-types/lib/api/main';
|
|
|
4
4
|
import { i18n } from '@lingui/core';
|
|
5
5
|
import React, { useState } from 'react';
|
|
6
6
|
|
|
7
|
-
import { ErrorIcon, WarningIcon } from '../../icons/index.js';
|
|
7
|
+
import { ErrorIcon, InfoIcon, WarningIcon } from '../../icons/index.js';
|
|
8
8
|
import { ChainToken } from '../ChainToken/index.js';
|
|
9
9
|
import { Image } from '../common/index.js';
|
|
10
10
|
import { Divider } from '../Divider/index.js';
|
|
11
11
|
import { QuoteTag } from '../QuoteTag/index.js';
|
|
12
|
+
import { textTruncate } from '../TokenAmount/TokenAmount.styles.js';
|
|
12
13
|
import { NumericTooltip, Tooltip } from '../Tooltip/index.js';
|
|
13
14
|
import { Typography } from '../Typography/index.js';
|
|
14
15
|
|
|
@@ -28,6 +29,7 @@ import {
|
|
|
28
29
|
import {
|
|
29
30
|
IconHighlight,
|
|
30
31
|
lastStepStyle,
|
|
32
|
+
OutputPriceValue,
|
|
31
33
|
OutputSection,
|
|
32
34
|
RouteContainer,
|
|
33
35
|
RouteHeader,
|
|
@@ -46,6 +48,7 @@ import {
|
|
|
46
48
|
import { TokenSection } from './FullExpandedQuote.TokenSection.js';
|
|
47
49
|
import { TooltipContent } from './FullExpandedQuote.Tooltip.js';
|
|
48
50
|
|
|
51
|
+
const MAX_OUTPUT_AMOUNT_LENGTH_FOR_INFO_ICON = 7;
|
|
49
52
|
export function FullExpandedQuote(props: PropTypes) {
|
|
50
53
|
const {
|
|
51
54
|
loading,
|
|
@@ -244,9 +247,16 @@ export function FullExpandedQuote(props: PropTypes) {
|
|
|
244
247
|
open={
|
|
245
248
|
!props.outputPrice.realValue ? false : undefined
|
|
246
249
|
}>
|
|
247
|
-
<
|
|
250
|
+
<OutputPriceValue
|
|
251
|
+
className={textTruncate()}
|
|
252
|
+
size="xmedium"
|
|
253
|
+
variant="title">
|
|
248
254
|
{props.outputPrice.value}
|
|
249
|
-
</
|
|
255
|
+
</OutputPriceValue>
|
|
256
|
+
{props.outputPrice.value.length >
|
|
257
|
+
MAX_OUTPUT_AMOUNT_LENGTH_FOR_INFO_ICON && (
|
|
258
|
+
<InfoIcon color="gray" size={12} />
|
|
259
|
+
)}
|
|
250
260
|
<Divider size={4} direction="horizontal" />
|
|
251
261
|
<Typography size="xmedium" variant="title">
|
|
252
262
|
{step.to.token.displayName}
|
|
@@ -5,13 +5,18 @@ export const Container = styled('div', {
|
|
|
5
5
|
display: 'flex',
|
|
6
6
|
justifyContent: 'end',
|
|
7
7
|
alignItems: 'center',
|
|
8
|
+
overflow: 'hidden',
|
|
9
|
+
minWidth: 0,
|
|
8
10
|
});
|
|
9
11
|
|
|
10
12
|
export const ValueTypography = styled('div', {
|
|
11
13
|
display: 'flex',
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
14
|
+
'& .output-usd-value': {
|
|
15
|
+
flex: '1 1 auto',
|
|
16
|
+
minWidth: 0,
|
|
17
|
+
flexShrink: 1,
|
|
18
|
+
maxWidth: '100%',
|
|
19
|
+
},
|
|
15
20
|
'& ._typography': {
|
|
16
21
|
$$color: '$colors$neutral600',
|
|
17
22
|
[`.${darkTheme} &`]: {
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import type { PriceImpactPropTypes } from './PriceImpact.types.js';
|
|
2
2
|
|
|
3
|
-
import React from 'react';
|
|
3
|
+
import React, { useRef } from 'react';
|
|
4
|
+
import { useIsTruncated } from 'src/hooks/useIsTruncated.js';
|
|
5
|
+
import { InfoIcon } from 'src/icons/index.js';
|
|
4
6
|
|
|
5
7
|
import { Divider, NumericTooltip, Typography } from '../index.js';
|
|
8
|
+
import { textTruncate } from '../TokenAmount/TokenAmount.styles.js';
|
|
6
9
|
|
|
7
10
|
import { Container, ValueTypography } from './PriceImpact.styles.js';
|
|
8
11
|
|
|
@@ -21,25 +24,32 @@ export function PriceImpact(props: PriceImpactPropTypes) {
|
|
|
21
24
|
|
|
22
25
|
const hasWarning = !outputUsdValue || warningLevel === 'low';
|
|
23
26
|
const hasError = warningLevel === 'high';
|
|
24
|
-
|
|
27
|
+
const realOutputUsdValueRef = useRef<HTMLSpanElement | null>(null);
|
|
28
|
+
const isRealOutputUsdValueTruncated = useIsTruncated(
|
|
29
|
+
realOutputUsdValue || '',
|
|
30
|
+
realOutputUsdValueRef
|
|
31
|
+
);
|
|
25
32
|
return (
|
|
26
33
|
<Container {...rest}>
|
|
27
34
|
{outputUsdValue && (
|
|
28
|
-
<
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
<
|
|
39
|
-
{
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
35
|
+
<ValueTypography className={textTruncate()}>
|
|
36
|
+
<Typography
|
|
37
|
+
className={`${textTruncate()} output-usd-value`}
|
|
38
|
+
size={size}
|
|
39
|
+
ref={realOutputUsdValueRef}
|
|
40
|
+
variant="body"
|
|
41
|
+
color={outputColor}>
|
|
42
|
+
{realOutputUsdValue === '0' ? '0.00' : `~$${realOutputUsdValue}`}
|
|
43
|
+
</Typography>
|
|
44
|
+
{isRealOutputUsdValueTruncated && (
|
|
45
|
+
<NumericTooltip
|
|
46
|
+
content={realOutputUsdValue}
|
|
47
|
+
container={tooltipProps?.container}
|
|
48
|
+
side={tooltipProps?.side}>
|
|
49
|
+
<InfoIcon size={12} color="gray" />
|
|
50
|
+
</NumericTooltip>
|
|
51
|
+
)}
|
|
52
|
+
</ValueTypography>
|
|
43
53
|
)}
|
|
44
54
|
{((outputUsdValue && percentageChange) || !outputUsdValue) && (
|
|
45
55
|
<ValueTypography hasError={hasError} hasWarning={hasWarning}>
|
|
@@ -11,6 +11,8 @@ export type PriceImpactPropTypes = {
|
|
|
11
11
|
error?: string;
|
|
12
12
|
percentageChange?: string | null;
|
|
13
13
|
warningLevel?: PriceImpactWarningLevel;
|
|
14
|
+
style?: React.CSSProperties;
|
|
15
|
+
className?: string;
|
|
14
16
|
tooltipProps?: {
|
|
15
17
|
container?: TooltipPropTypes['container'];
|
|
16
18
|
side?: TooltipPropTypes['side'];
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { css } from '@stitches/react';
|
|
2
2
|
|
|
3
3
|
import { darkTheme, styled } from '../../theme.js';
|
|
4
|
+
import { Typography } from '../Typography/Typography.js';
|
|
4
5
|
|
|
5
6
|
export const Container = styled('div', {
|
|
6
7
|
width: '100%',
|
|
@@ -127,6 +128,20 @@ export const StepSeparator = styled('div', {
|
|
|
127
128
|
},
|
|
128
129
|
});
|
|
129
130
|
|
|
131
|
+
export const TokenNameText = styled(Typography, {
|
|
132
|
+
overflow: 'hidden',
|
|
133
|
+
textOverflow: 'ellipsis',
|
|
134
|
+
whiteSpace: 'nowrap',
|
|
135
|
+
maxWidth: '38px',
|
|
136
|
+
});
|
|
137
|
+
|
|
138
|
+
export const ValueTypography = styled(Typography, {
|
|
139
|
+
overflow: 'hidden',
|
|
140
|
+
textOverflow: 'ellipsis',
|
|
141
|
+
whiteSpace: 'nowrap',
|
|
142
|
+
maxWidth: '60px',
|
|
143
|
+
});
|
|
144
|
+
|
|
130
145
|
export const tokensContainerStyles = css({
|
|
131
146
|
width: '100%',
|
|
132
147
|
overflow: 'hidden',
|