@rango-dev/ui 0.22.1-next.9 → 0.24.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 (125) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/index.js +6 -6
  3. package/dist/index.js.map +4 -4
  4. package/dist/translations/en.d.ts.map +1 -1
  5. package/dist/translations/es.d.ts.map +1 -1
  6. package/dist/translations/fr.d.ts.map +1 -1
  7. package/dist/translations/ja.d.ts.map +1 -1
  8. package/dist/widget/ui/src/components/Alert/Alert.styles.d.ts.map +1 -1
  9. package/dist/widget/ui/src/components/BestRoute/BestRoute.d.ts +4 -0
  10. package/dist/widget/ui/src/components/BestRoute/BestRoute.d.ts.map +1 -0
  11. package/dist/widget/ui/src/components/BestRoute/BestRoute.stories.d.ts +7 -0
  12. package/dist/widget/ui/src/components/BestRoute/BestRoute.stories.d.ts.map +1 -0
  13. package/dist/widget/ui/src/components/BestRoute/BestRoute.styles.d.ts +1429 -0
  14. package/dist/widget/ui/src/components/BestRoute/BestRoute.styles.d.ts.map +1 -0
  15. package/dist/widget/ui/src/components/BestRoute/BestRoute.types.d.ts +34 -0
  16. package/dist/widget/ui/src/components/BestRoute/BestRoute.types.d.ts.map +1 -0
  17. package/dist/widget/ui/src/components/BestRoute/BestRouteSkeleton.d.ts +4 -0
  18. package/dist/widget/ui/src/components/BestRoute/BestRouteSkeleton.d.ts.map +1 -0
  19. package/dist/widget/ui/src/components/{QuoteCost/QuoteCost.styles.d.ts → BestRoute/BestRouteSkeleton.styles.d.ts} +7 -3
  20. package/dist/widget/ui/src/components/BestRoute/BestRouteSkeleton.styles.d.ts.map +1 -0
  21. package/dist/widget/ui/src/components/BestRoute/BestRouteSkeleton.types.d.ts +6 -0
  22. package/dist/widget/ui/src/components/BestRoute/BestRouteSkeleton.types.d.ts.map +1 -0
  23. package/dist/widget/ui/src/components/BestRoute/RouteSummary.d.ts +12 -0
  24. package/dist/widget/ui/src/components/BestRoute/RouteSummary.d.ts.map +1 -0
  25. package/dist/widget/ui/src/components/BestRoute/RouteSummary.styles.d.ts +158 -0
  26. package/dist/widget/ui/src/components/BestRoute/RouteSummary.styles.d.ts.map +1 -0
  27. package/dist/widget/ui/src/components/BestRoute/index.d.ts +5 -0
  28. package/dist/widget/ui/src/components/BestRoute/index.d.ts.map +1 -0
  29. package/dist/widget/ui/src/components/BestRoute/mock.d.ts +3 -0
  30. package/dist/widget/ui/src/components/BestRoute/mock.d.ts.map +1 -0
  31. package/dist/widget/ui/src/components/Checkbox/Checkbox.styles.d.ts.map +1 -1
  32. package/dist/widget/ui/src/components/ListItem/ListItem.styles.d.ts.map +1 -1
  33. package/dist/widget/ui/src/components/Radio/Radio.styles.d.ts.map +1 -1
  34. package/dist/widget/ui/src/components/RouteCost/RouteCost.d.ts +4 -0
  35. package/dist/widget/ui/src/components/RouteCost/RouteCost.d.ts.map +1 -0
  36. package/dist/widget/ui/src/components/RouteCost/RouteCost.styles.d.ts +158 -0
  37. package/dist/widget/ui/src/components/RouteCost/RouteCost.styles.d.ts.map +1 -0
  38. package/dist/widget/ui/src/components/{QuoteCost/QuoteCost.types.d.ts → RouteCost/RouteCost.types.d.ts} +1 -1
  39. package/dist/widget/ui/src/components/RouteCost/RouteCost.types.d.ts.map +1 -0
  40. package/dist/widget/ui/src/components/RouteCost/index.d.ts +2 -0
  41. package/dist/widget/ui/src/components/RouteCost/index.d.ts.map +1 -0
  42. package/dist/widget/ui/src/components/RoutesOverview/RoutesOverview.d.ts.map +1 -1
  43. package/dist/widget/ui/src/components/StepDetails/StepDetails.styles.d.ts +1 -1
  44. package/dist/widget/ui/src/components/StepDetails/StepDetails.types.d.ts +2 -16
  45. package/dist/widget/ui/src/components/StepDetails/StepDetails.types.d.ts.map +1 -1
  46. package/dist/widget/ui/src/components/StepDetails/index.d.ts +1 -1
  47. package/dist/widget/ui/src/components/StepDetails/index.d.ts.map +1 -1
  48. package/dist/widget/ui/src/components/StepDetails/mock.d.ts +1 -1
  49. package/dist/widget/ui/src/components/StepDetails/mock.d.ts.map +1 -1
  50. package/dist/widget/ui/src/components/Switch/Switch.styles.d.ts.map +1 -1
  51. package/dist/widget/ui/src/components/index.d.ts +2 -1
  52. package/dist/widget/ui/src/components/index.d.ts.map +1 -1
  53. package/dist/widget/ui/src/containers/BlockchainSelector/BlockchainSelector.d.ts +3 -3
  54. package/dist/widget/ui/src/containers/BlockchainSelector/BlockchainSelector.d.ts.map +1 -1
  55. package/dist/widget/ui/src/containers/SwapInput/SwapInput.d.ts.map +1 -1
  56. package/dist/widget/ui/src/containers/SwapInput/SwapInput.styles.d.ts +0 -159
  57. package/dist/widget/ui/src/containers/SwapInput/SwapInput.styles.d.ts.map +1 -1
  58. package/dist/widget/ui/src/containers/SwapInput/SwapInput.types.d.ts +0 -1
  59. package/dist/widget/ui/src/containers/SwapInput/SwapInput.types.d.ts.map +1 -1
  60. package/dist/widget/ui/src/containers/SwapInput/TokenSection.d.ts.map +1 -1
  61. package/dist/widget/ui/src/containers/SwapInput/TokenSection.styles.d.ts.map +1 -1
  62. package/dist/widget/ui/src/containers/TokenSelector/TokenSelector.d.ts +2 -2
  63. package/dist/widget/ui/src/containers/TokenSelector/TokenSelector.d.ts.map +1 -1
  64. package/dist/widget/ui/src/{utils → helper}/index.d.ts +3 -0
  65. package/dist/widget/ui/src/helper/index.d.ts.map +1 -0
  66. package/dist/widget/ui/src/icons/index.d.ts +0 -1
  67. package/dist/widget/ui/src/icons/index.d.ts.map +1 -1
  68. package/dist/widget/ui/src/index.d.ts +1 -0
  69. package/dist/widget/ui/src/index.d.ts.map +1 -1
  70. package/package.json +2 -2
  71. package/src/components/Alert/Alert.styles.ts +5 -2
  72. package/src/components/BestRoute/BestRoute.stories.tsx +17 -0
  73. package/src/components/BestRoute/BestRoute.styles.ts +213 -0
  74. package/src/components/BestRoute/BestRoute.tsx +176 -0
  75. package/src/components/BestRoute/BestRoute.types.ts +32 -0
  76. package/src/components/BestRoute/BestRouteSkeleton.styles.ts +110 -0
  77. package/src/components/BestRoute/BestRouteSkeleton.tsx +112 -0
  78. package/src/components/BestRoute/BestRouteSkeleton.types.ts +5 -0
  79. package/src/components/BestRoute/RouteSummary.styles.ts +15 -0
  80. package/src/components/BestRoute/RouteSummary.tsx +48 -0
  81. package/src/components/BestRoute/index.ts +4 -0
  82. package/src/components/BestRoute/mock.ts +142 -0
  83. package/src/components/Checkbox/Checkbox.styles.ts +1 -5
  84. package/src/components/ListItem/ListItem.styles.ts +0 -7
  85. package/src/components/ListItem/ListItem.tsx +1 -1
  86. package/src/components/PriceImpact/PriceImpact.tsx +2 -2
  87. package/src/components/Radio/Radio.styles.tsx +2 -5
  88. package/src/components/{QuoteCost/QuoteCost.styles.ts → RouteCost/RouteCost.styles.ts} +0 -7
  89. package/src/components/{QuoteCost/QuoteCost.tsx → RouteCost/RouteCost.tsx} +4 -3
  90. package/src/components/RouteCost/index.ts +1 -0
  91. package/src/components/RoutesOverview/RoutesOverview.tsx +2 -6
  92. package/src/components/SelectableWalletList/SelectableWalletList.tsx +1 -1
  93. package/src/components/StepDetails/StepDetails.stories.tsx +1 -1
  94. package/src/components/StepDetails/StepDetails.styles.ts +4 -4
  95. package/src/components/StepDetails/StepDetails.tsx +3 -3
  96. package/src/components/StepDetails/StepDetails.types.ts +2 -17
  97. package/src/components/StepDetails/index.ts +1 -1
  98. package/src/components/StepDetails/mock.ts +1 -1
  99. package/src/components/SvgIcon/SvgIcon.style.ts +1 -1
  100. package/src/components/Switch/Switch.styles.tsx +2 -6
  101. package/src/components/index.ts +2 -1
  102. package/src/containers/BlockchainSelector/BlockchainSelector.tsx +8 -9
  103. package/src/containers/SwapInput/SwapInput.styles.ts +0 -33
  104. package/src/containers/SwapInput/SwapInput.tsx +19 -16
  105. package/src/containers/SwapInput/SwapInput.types.ts +0 -1
  106. package/src/containers/SwapInput/TokenSection.styles.ts +0 -8
  107. package/src/containers/SwapInput/TokenSection.tsx +1 -4
  108. package/src/containers/TokenSelector/TokenSelector.tsx +10 -8
  109. package/src/helper/index.ts +99 -0
  110. package/src/icons/index.ts +0 -1
  111. package/src/index.ts +1 -0
  112. package/src/theme.ts +4 -4
  113. package/dist/widget/ui/src/components/QuoteCost/QuoteCost.d.ts +0 -4
  114. package/dist/widget/ui/src/components/QuoteCost/QuoteCost.d.ts.map +0 -1
  115. package/dist/widget/ui/src/components/QuoteCost/QuoteCost.styles.d.ts.map +0 -1
  116. package/dist/widget/ui/src/components/QuoteCost/QuoteCost.types.d.ts.map +0 -1
  117. package/dist/widget/ui/src/components/QuoteCost/index.d.ts +0 -2
  118. package/dist/widget/ui/src/components/QuoteCost/index.d.ts.map +0 -1
  119. package/dist/widget/ui/src/icons/Language.d.ts +0 -5
  120. package/dist/widget/ui/src/icons/Language.d.ts.map +0 -1
  121. package/dist/widget/ui/src/utils/index.d.ts.map +0 -1
  122. package/src/components/QuoteCost/index.ts +0 -1
  123. package/src/icons/Language.tsx +0 -55
  124. package/src/utils/index.ts +0 -23
  125. /package/src/components/{QuoteCost/QuoteCost.types.ts → RouteCost/RouteCost.types.ts} +0 -0
@@ -762,163 +762,4 @@ export declare const MaxButton: import("@stitches/react/types/styled-component")
762
762
  zIndices: {};
763
763
  transitions: {};
764
764
  }, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
765
- export declare const ValueTypography: import("@stitches/react/types/styled-component").StyledComponent<"div", {
766
- hasWarning?: boolean | "true" | "false" | undefined;
767
- }, {
768
- sm: string;
769
- md: string;
770
- lg: string;
771
- }, import("@stitches/react/types/css-util").CSS<{
772
- sm: string;
773
- md: string;
774
- lg: string;
775
- }, {
776
- colors: {
777
- primary: string;
778
- primary500: string;
779
- primary600: string;
780
- secondary: string;
781
- secondary100: string;
782
- secondary200: string;
783
- secondary300: string;
784
- secondary400: string;
785
- secondary500: string;
786
- secondary600: string;
787
- secondary700: string;
788
- secondary800: string;
789
- secondary900: string;
790
- neutral: string;
791
- neutral100: string;
792
- neutral200: string;
793
- neutral300: string;
794
- neutral400: string;
795
- neutral500: string;
796
- neutral600: string;
797
- neutral700: string;
798
- neutral800: string;
799
- neutral900: string;
800
- error100: string;
801
- error300: string;
802
- error500: string;
803
- error600: string;
804
- error700: string;
805
- warning100: string;
806
- warning300: string;
807
- warning500: string;
808
- warning600: string;
809
- warning700: string;
810
- info: string;
811
- info100: string;
812
- info300: string;
813
- info500: string;
814
- info600: string;
815
- info700: string;
816
- success100: string;
817
- success300: string;
818
- success500: string;
819
- success600: string;
820
- success700: string;
821
- background: string;
822
- foreground: string;
823
- };
824
- space: {
825
- 0: string;
826
- 5: string;
827
- 10: string;
828
- 15: string;
829
- 20: string;
830
- 25: string;
831
- 30: string;
832
- 40: string;
833
- 46: string;
834
- 50: string;
835
- 60: string;
836
- 70: string;
837
- 80: string;
838
- 90: string;
839
- 100: string;
840
- 2: string;
841
- 4: string;
842
- 6: string;
843
- 8: string;
844
- 12: string;
845
- 16: string;
846
- 24: string;
847
- 28: string;
848
- 32: string;
849
- };
850
- radii: {
851
- xs: string;
852
- sm: string;
853
- xm: string;
854
- md: string;
855
- xl: string;
856
- lg: string;
857
- primary: string;
858
- secondary: string;
859
- };
860
- fontSizes: {
861
- 10: string;
862
- 12: string;
863
- 14: string;
864
- 16: string;
865
- 18: string;
866
- 20: string;
867
- 22: string;
868
- 24: string;
869
- 28: string;
870
- 32: string;
871
- 36: string;
872
- 40: string;
873
- 48: string;
874
- };
875
- fonts: {
876
- primary: string;
877
- widget: string;
878
- };
879
- fontWeights: {
880
- regular: number;
881
- medium: number;
882
- semiBold: number;
883
- bold: number;
884
- };
885
- lineHeights: {
886
- 12: string;
887
- 16: string;
888
- 20: string;
889
- 24: string;
890
- 26: string;
891
- 28: string;
892
- 30: string;
893
- 36: string;
894
- 40: string;
895
- 44: string;
896
- 52: string;
897
- 64: string;
898
- };
899
- letterSpacings: {};
900
- sizes: {
901
- 4: string;
902
- 6: string;
903
- 8: string;
904
- 12: string;
905
- 16: string;
906
- 18: string;
907
- 20: string;
908
- 24: string;
909
- 28: string;
910
- 32: string;
911
- 36: string;
912
- 40: string;
913
- 45: string;
914
- 48: string;
915
- };
916
- borderWidths: {};
917
- borderStyles: {};
918
- shadows: {
919
- s: string;
920
- };
921
- zIndices: {};
922
- transitions: {};
923
- }, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
924
765
  //# sourceMappingURL=SwapInput.styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SwapInput.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.styles.ts"],"names":[],"mappings":";;;AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAgDpB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAUtB,CAAC;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAMpB,CAAC;AAEH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAwB1B,CAAC"}
1
+ {"version":3,"file":"SwapInput.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.styles.ts"],"names":[],"mappings":";;;AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAyCpB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAUtB,CAAC;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAMpB,CAAC"}
@@ -28,7 +28,6 @@ type FromProps = {
28
28
  };
29
29
  type ToProps = {
30
30
  mode: 'To';
31
- fetchingQuote?: boolean;
32
31
  percentageChange: string | null;
33
32
  warningLevel: PriceImpactWarningLevel;
34
33
  };
@@ -1 +1 @@
1
- {"version":3,"file":"SwapInput.types.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gDAAgD,CAAC;AAE9F,MAAM,MAAM,SAAS,GAAG;IACtB,KAAK,EAAE;QACL,WAAW,EAAE,MAAM,CAAC;QACpB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,EAAE;QACL,WAAW,EAAE,MAAM,CAAC;QACpB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,aAAa,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C,CAAC;AAEF,KAAK,OAAO,GAAG;IACb,IAAI,EAAE,IAAI,CAAC;IACX,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,YAAY,EAAE,uBAAuB,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,CAAC,SAAS,GAAG,OAAO,CAAC,CAAC"}
1
+ {"version":3,"file":"SwapInput.types.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/SwapInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gDAAgD,CAAC;AAE9F,MAAM,MAAM,SAAS,GAAG;IACtB,KAAK,EAAE;QACL,WAAW,EAAE,MAAM,CAAC;QACpB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,EAAE;QACL,WAAW,EAAE,MAAM,CAAC;QACpB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,aAAa,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C,CAAC;AAEF,KAAK,OAAO,GAAG;IACb,IAAI,EAAE,IAAI,CAAC;IACX,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,YAAY,EAAE,uBAAuB,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,CAAC,SAAS,GAAG,OAAO,CAAC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"TokenSection.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/TokenSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAG9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBA8CpD"}
1
+ {"version":3,"file":"TokenSection.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/TokenSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAG9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBA2CpD"}
@@ -1 +1 @@
1
- {"version":3,"file":"TokenSection.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/TokenSection.styles.ts"],"names":[],"mappings":";;;AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAyBpB,CAAC;AAEH,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DA0BhC,CAAC"}
1
+ {"version":3,"file":"TokenSection.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/SwapInput/TokenSection.styles.ts"],"names":[],"mappings":";;;AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAwBpB,CAAC;AAEH,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAmBhC,CAAC"}
@@ -1,6 +1,6 @@
1
- import type { TokenWithAmount } from '../../components/TokenList/TokenList';
2
- import type { LoadingStatus } from '../../types/meta';
3
1
  import React from 'react';
2
+ import { LoadingStatus } from '../../types/meta';
3
+ import { TokenWithAmount } from '../../components/TokenList/TokenList';
4
4
  export declare const LoaderContainer: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
5
5
  sm: string;
6
6
  md: string;
@@ -1 +1 @@
1
- {"version":3,"file":"TokenSelector.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/TokenSelector/TokenSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAC5E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAM1B,CAAC;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAC;IAChC,QAAQ,EAAE,eAAe,GAAG,IAAI,CAAC;IACjC,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC3C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAUD,wBAAgB,aAAa,CAAC,KAAK,EAAE,SAAS,qBAiC7C"}
1
+ {"version":3,"file":"TokenSelector.d.ts","sourceRoot":"","sources":["../../../../../../src/containers/TokenSelector/TokenSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAIjD,OAAO,EAEL,eAAe,EAChB,MAAM,sCAAsC,CAAC;AAE9C,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAM1B,CAAC;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAC;IAChC,QAAQ,EAAE,eAAe,GAAG,IAAI,CAAC;IACjC,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC3C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAUD,wBAAgB,aAAa,CAAC,KAAK,EAAE,SAAS,qBAkC7C"}
@@ -1,3 +1,6 @@
1
1
  export declare function containsText(text: string, searchText: string): boolean;
2
2
  export declare function getConciseAddress(address: string | null, maxChars?: number, ellipsisLength?: number): string | null;
3
+ export declare const generateRangeColors: (name: string, mode: 'light' | 'dark', color?: string) => {
4
+ [x: string]: string | undefined;
5
+ };
3
6
  //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/helper/index.ts"],"names":[],"mappings":"AAEA,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,OAAO,CAEtE;AAED,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,MAAM,GAAG,IAAI,EACtB,QAAQ,SAAI,EACZ,cAAc,SAAI,GACjB,MAAM,GAAG,IAAI,CAYf;AA2CD,eAAO,MAAM,mBAAmB,SACxB,MAAM,QACN,OAAO,GAAG,MAAM,UACd,MAAM;;CA8Bf,CAAC"}
@@ -19,7 +19,6 @@ export { default as GasIcon } from './Gas';
19
19
  export { default as InProgressIcon } from './InProgress';
20
20
  export { default as InfoErrorIcon } from './InfoError';
21
21
  export { default as InfoIcon } from './Info';
22
- export { default as LanguageIcon } from './Language';
23
22
  export { default as LightModeIcon } from './LightMode';
24
23
  export { default as LinkIcon } from './Link';
25
24
  export { default as LoadingIcon } from './Loading';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/icons/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/icons/index.ts"],"names":[],"mappings":"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"}
@@ -4,4 +4,5 @@ export * from './theme';
4
4
  export * from './types';
5
5
  export * from './hooks';
6
6
  export * from './icons';
7
+ export { generateRangeColors } from './helper';
7
8
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rango-dev/ui",
3
- "version": "0.22.1-next.9",
3
+ "version": "0.24.0",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "module": "./dist/index.js",
@@ -65,7 +65,7 @@
65
65
  "@radix-ui/react-radio-group": "^1.1.1",
66
66
  "@radix-ui/react-switch": "^1.0.1",
67
67
  "@radix-ui/react-tooltip": "^1.0.2",
68
- "@rango-dev/wallets-shared": "^0.21.1-next.3",
68
+ "@rango-dev/wallets-shared": "^0.23.0",
69
69
  "@stitches/react": "^1.2.8",
70
70
  "rango-sdk": "^0.1.35",
71
71
  "react-virtualized-auto-sizer": "^1.0.7",
@@ -20,7 +20,11 @@ export const Container = styled('div', {
20
20
  paddingLeft: '$24',
21
21
  },
22
22
  '.description': {
23
- color: '$neutral700',
23
+ $$color: '$colors$neutral700',
24
+ [`.${darkTheme} &`]: {
25
+ $$color: '$colors$neutral600',
26
+ },
27
+ color: '$$color',
24
28
  fontSize: '$10',
25
29
  lineHeight: '$12',
26
30
  },
@@ -120,7 +124,6 @@ export const IconHighlight = styled('div', {
120
124
  justifyContent: 'center',
121
125
  alignItems: 'center',
122
126
  alignSelf: 'flex-start',
123
- flexShrink: 0,
124
127
  variants: {
125
128
  type: {
126
129
  success: {
@@ -0,0 +1,17 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+
3
+ import { BestRoute } from './BestRoute';
4
+ import { route1 } from './mock';
5
+
6
+ const meta: Meta<typeof BestRoute> = {
7
+ component: BestRoute,
8
+ };
9
+
10
+ export default meta;
11
+ type Story = StoryObj<typeof BestRoute>;
12
+
13
+ export const Main: Story = {
14
+ args: {
15
+ ...route1,
16
+ },
17
+ };
@@ -0,0 +1,213 @@
1
+ import * as Collapsible from '@radix-ui/react-collapsible';
2
+
3
+ import { darkTheme, styled } from '../../theme';
4
+ import { Image } from '../common';
5
+ import { CollapsibleContent } from '../common/styles';
6
+
7
+ export const EXPANDABLE_ROUTES_TRANSITION_DURATION = 300;
8
+
9
+ export const RouteContainer = styled(Collapsible.Root, {
10
+ display: 'flex',
11
+ flexDirection: 'column',
12
+ alignItems: 'start',
13
+ overflowX: 'auto',
14
+ overflowY: 'hidden',
15
+ width: '100%',
16
+ borderRadius: '$xm',
17
+ variants: {
18
+ recommended: {
19
+ true: {
20
+ $$color: '$colors$info300',
21
+ [`.${darkTheme} &`]: {
22
+ $$color: '$colors$secondary800',
23
+ },
24
+ backgroundColor: '$$color',
25
+ },
26
+ false: {
27
+ $$color: '$colors$neutral400',
28
+ [`.${darkTheme} &`]: {
29
+ $$color: '$colors$neutral200',
30
+ },
31
+ backgroundColor: '$$color',
32
+ },
33
+ },
34
+ },
35
+ '& .steps-details': {
36
+ padding: '$10 $15',
37
+ },
38
+ });
39
+
40
+ export const SummaryContainer = styled('div', {
41
+ borderRadius: '$xm',
42
+ display: 'flex',
43
+ flexDirection: 'column',
44
+ alignItems: 'start',
45
+ justifyContent: 'space-between',
46
+ color: '$foreground',
47
+ cursor: 'pointer',
48
+ boxSizing: 'border-box',
49
+ position: 'relative',
50
+ variants: {
51
+ recommended: {
52
+ true: {
53
+ $$color: '$colors$info100',
54
+ [`.${darkTheme} &`]: {
55
+ $$color: '$colors$secondary600',
56
+ },
57
+ backgroundColor: '$$color',
58
+ '&:hover': {
59
+ backgroundColor: '$$color',
60
+ },
61
+ },
62
+ false: {
63
+ $$color: '$colors$neutral200',
64
+ [`.${darkTheme} &`]: {
65
+ $$color: '$colors$neutral500',
66
+ },
67
+ backgroundColor: '$$color',
68
+ '&:hover': {
69
+ backgroundColor: '$$color',
70
+ },
71
+ },
72
+ },
73
+ basic: { true: { borderTopRightRadius: '0', borderTopLeftRadius: '0' } },
74
+ listItem: {
75
+ true: {},
76
+ false: {},
77
+ },
78
+ },
79
+
80
+ compoundVariants: [
81
+ {
82
+ listItem: true,
83
+ recommended: true,
84
+ css: {
85
+ '&:hover': {
86
+ $$color: '$colors$secondary200',
87
+ [`.${darkTheme} &`]: {
88
+ $$color: '$colors$secondary700',
89
+ },
90
+ backgroundColor: '$$color',
91
+ },
92
+ },
93
+ },
94
+ {
95
+ listItem: true,
96
+ recommended: false,
97
+ css: {
98
+ '&:hover': {
99
+ $$color: '$colors$neutral300',
100
+ [`.${darkTheme} &`]: {
101
+ $$color: '$colors$neutral400',
102
+ },
103
+ backgroundColor: '$$color',
104
+ },
105
+ },
106
+ },
107
+ ],
108
+ '& .summary': {
109
+ width: '100%',
110
+ padding: '$15 $15 $10 $15',
111
+ },
112
+ '& .basic-info': {
113
+ paddingTop: '$10',
114
+ display: 'flex',
115
+ alignItems: 'center',
116
+ },
117
+ });
118
+
119
+ export const Chains = styled(Collapsible.Trigger, {
120
+ display: 'flex',
121
+ width: '100%',
122
+ justifyContent: 'space-between',
123
+ alignItems: 'center',
124
+ height: '$36',
125
+ padding: '$10 $15',
126
+ boxSizing: 'border-box',
127
+ cursor: 'pointer',
128
+ border: 'none',
129
+ outline: 'none',
130
+ backgroundColor: 'transparent',
131
+ variants: {
132
+ error: {
133
+ true: {
134
+ [`& ${Image}`]: {
135
+ border: '1px $warning500 solid',
136
+ borderRadius: '100%',
137
+ },
138
+ },
139
+ false: {
140
+ [`& ${Image}`]: {
141
+ border: '1px transparent solid',
142
+ borderRadius: '100%',
143
+ },
144
+ },
145
+ },
146
+ recommended: {
147
+ true: {
148
+ $$color: '$colors$info300',
149
+ [`.${darkTheme} &`]: {
150
+ $$color: '$colors$secondary800',
151
+ },
152
+ backgroundColor: '$$color',
153
+ },
154
+ false: {
155
+ $$color: '$colors$neutral400',
156
+ [`.${darkTheme} &`]: {
157
+ $$color: '$colors$neutral200',
158
+ },
159
+ backgroundColor: '$$color',
160
+ },
161
+ },
162
+ },
163
+ '& div:nth-child(1)': { display: 'flex' },
164
+ });
165
+
166
+ export const Content = styled(CollapsibleContent, {
167
+ width: '100%',
168
+ });
169
+
170
+ export const IconContainer = styled('div', {
171
+ display: 'flex',
172
+ justifyContent: 'center',
173
+ alignItems: 'center',
174
+ padding: '$2',
175
+ transition: `all ${EXPANDABLE_ROUTES_TRANSITION_DURATION}ms ease`,
176
+ variants: {
177
+ orientation: {
178
+ down: {
179
+ transform: 'rotate(0)',
180
+ },
181
+ up: {
182
+ transform: 'rotate(180deg)',
183
+ },
184
+ },
185
+ },
186
+ });
187
+
188
+ export const Separator = styled('div', {
189
+ height: '$12',
190
+ marginLeft: '$10',
191
+ marginRight: '$10',
192
+ borderLeft: '1px solid $foreground',
193
+ });
194
+
195
+ export const HorizontalSeparator = styled('div', {
196
+ display: 'flex',
197
+ justifyContent: 'center',
198
+ margin: '0 $15',
199
+ borderTop: '1px solid',
200
+ $$color: '$colors$neutral300',
201
+ [`.${darkTheme} &`]: {
202
+ $$color: '$colors$neutral400',
203
+ },
204
+ borderColor: '$$color',
205
+ });
206
+
207
+ export const FrameIcon = styled('div', {
208
+ width: '$16',
209
+ height: '$16',
210
+ justifyContent: 'center',
211
+ alignItems: 'center',
212
+ display: 'flex',
213
+ });