@rango-dev/widget-embedded 0.14.1-next.0 → 0.14.1-next.10
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/Widget.d.ts.map +1 -1
- package/dist/components/BlockchainList/BlockchainList.styles.d.ts +8 -0
- package/dist/components/BlockchainList/BlockchainList.styles.d.ts.map +1 -1
- package/dist/components/BlockchainsSection/BlockchainsSection.styles.d.ts +4 -0
- package/dist/components/BlockchainsSection/BlockchainsSection.styles.d.ts.map +1 -1
- package/dist/components/ConfirmWalletsModal/ConfirmWallets.styles.d.ts +60 -0
- package/dist/components/ConfirmWalletsModal/ConfirmWallets.styles.d.ts.map +1 -1
- package/dist/components/ConfirmWalletsModal/WalletList.styles.d.ts +12 -0
- package/dist/components/ConfirmWalletsModal/WalletList.styles.d.ts.map +1 -1
- package/dist/components/HeaderButtons/HeaderButtons.styles.d.ts +16 -0
- package/dist/components/HeaderButtons/HeaderButtons.styles.d.ts.map +1 -1
- package/dist/components/Layout/Layout.styles.d.ts +12 -0
- package/dist/components/Layout/Layout.styles.d.ts.map +1 -1
- package/dist/components/LoadingLiquiditySourceList/LoadingLiquiditySourceList.styles.d.ts +4 -0
- package/dist/components/LoadingLiquiditySourceList/LoadingLiquiditySourceList.styles.d.ts.map +1 -1
- package/dist/components/LoadingSwapDetails/LoadingSwapDetails.styles.d.ts +12 -0
- package/dist/components/LoadingSwapDetails/LoadingSwapDetails.styles.d.ts.map +1 -1
- package/dist/components/NoRoutes/NoRoutes.styles.d.ts +12 -0
- package/dist/components/NoRoutes/NoRoutes.styles.d.ts.map +1 -1
- package/dist/components/NotificationContent/NotificationContent.styles.d.ts +16 -0
- package/dist/components/NotificationContent/NotificationContent.styles.d.ts.map +1 -1
- package/dist/components/RouteErrors/RouteErrors.styles.d.ts +16 -0
- package/dist/components/RouteErrors/RouteErrors.styles.d.ts.map +1 -1
- package/dist/components/SearchInput/SearchInput.styles.d.ts +4 -0
- package/dist/components/SearchInput/SearchInput.styles.d.ts.map +1 -1
- package/dist/components/SettingsContainer/SettingsContainer.style.d.ts +16 -0
- package/dist/components/SettingsContainer/SettingsContainer.style.d.ts.map +1 -1
- package/dist/components/Slippage/Slippage.styles.d.ts +16 -0
- package/dist/components/Slippage/Slippage.styles.d.ts.map +1 -1
- package/dist/components/SwapDetails/SwapDetails.styles.d.ts +24 -0
- package/dist/components/SwapDetails/SwapDetails.styles.d.ts.map +1 -1
- package/dist/components/SwapDetailsAlerts/SwapDetailsAlerts.styles.d.ts +4 -0
- package/dist/components/SwapDetailsAlerts/SwapDetailsAlerts.styles.d.ts.map +1 -1
- package/dist/components/SwapDetailsModal/SwapDetailsModal.styles.d.ts +4 -0
- package/dist/components/SwapDetailsModal/SwapDetailsModal.styles.d.ts.map +1 -1
- package/dist/components/SwapsGroup/SwapsGroup.styles.d.ts +16 -0
- package/dist/components/SwapsGroup/SwapsGroup.styles.d.ts.map +1 -1
- package/dist/components/TokenList/TokenList.styles.d.ts +40 -0
- package/dist/components/TokenList/TokenList.styles.d.ts.map +1 -1
- package/dist/components/WalletModal/WalletModalContent.styles.d.ts +16 -0
- package/dist/components/WalletModal/WalletModalContent.styles.d.ts.map +1 -1
- package/dist/constants/fonts.d.ts +2 -0
- package/dist/constants/fonts.d.ts.map +1 -0
- package/dist/{constants.d.ts → constants/index.d.ts} +1 -1
- package/dist/constants/index.d.ts.map +1 -0
- package/dist/hooks/useTheme.d.ts +2 -2
- package/dist/hooks/useTheme.d.ts.map +1 -1
- package/dist/index.d.ts +9 -6
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +4 -4
- package/dist/store/bestRoute.d.ts.map +1 -1
- package/dist/types/config.d.ts +5 -10
- package/dist/types/config.d.ts.map +1 -1
- package/dist/utils/colors.d.ts +11 -0
- package/dist/utils/colors.d.ts.map +1 -0
- package/dist/utils/common.d.ts +0 -4
- package/dist/utils/common.d.ts.map +1 -1
- package/dist/utils/configs.d.ts +2 -0
- package/dist/utils/configs.d.ts.map +1 -1
- package/dist/utils/hash.d.ts +2 -0
- package/dist/utils/hash.d.ts.map +1 -0
- package/dist/utils/meta.d.ts +3 -1
- package/dist/utils/meta.d.ts.map +1 -1
- package/dist/utils/routing.d.ts +8 -1
- package/dist/utils/routing.d.ts.map +1 -1
- package/dist/utils/ui.d.ts +13 -0
- package/dist/utils/ui.d.ts.map +1 -0
- package/package.json +5 -5
- package/src/Widget.tsx +5 -2
- package/src/components/BlockchainsSection/BlockchainsSection.tsx +2 -2
- package/src/components/TokenList/TokenList.tsx +1 -1
- package/src/constants/fonts.ts +1 -0
- package/src/hooks/useSyncStoresWithConfig.ts +1 -1
- package/src/hooks/useTheme.ts +44 -26
- package/src/index.ts +33 -26
- package/src/store/bestRoute.ts +24 -48
- package/src/types/config.ts +5 -10
- package/src/utils/colors.ts +93 -0
- package/src/utils/common.ts +0 -49
- package/src/utils/configs.ts +3 -0
- package/src/utils/hash.ts +27 -0
- package/src/utils/meta.ts +11 -1
- package/src/utils/routing.ts +58 -0
- package/src/utils/ui.ts +79 -0
- package/dist/constants.d.ts.map +0 -1
- /package/src/{constants.ts → constants/index.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bestRoute.d.ts","sourceRoot":"","sources":["../../src/store/bestRoute.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mDAAmD,CAAC;AACrF,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAE1E,OAAO,SAAS,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"bestRoute.d.ts","sourceRoot":"","sources":["../../src/store/bestRoute.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mDAAmD,CAAC;AACrF,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAE1E,OAAO,SAAS,MAAM,cAAc,CAAC;AAoBrC,MAAM,WAAW,UAAU;IACzB,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,YAAY,EAAE,cAAc,GAAG,IAAI,CAAC;IACpC,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,SAAS,GAAG,IAAI,CAAC;IAChC,YAAY,EAAE,SAAS,GAAG,IAAI,CAAC;IAC/B,cAAc,EAAE,SAAS,GAAG,IAAI,CAAC;IACjC,SAAS,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACnC,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjC,qBAAqB,EAAE,OAAO,CAAC;IAC/B,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,iBAAiB,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1D,eAAe,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAExD,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5C,UAAU,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1C,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,SAAS,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACpC,QAAQ,EAAE,CAAC,SAAS,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;IACxD,KAAK,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI,CAAC;IAC1C,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,uBAAuB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD,kBAAkB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAChD,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;gCApBV,IAAI;uCACG,IAAI;yCACF,IAAI;yCACJ,cAAc,GAAG,IAAI,KAAK,IAAI;uCAChC,cAAc,GAAG,IAAI,KAAK,IAAI;oCAEjC,KAAK,GAAG,IAAI,KAAK,IAAI;kCACvB,KAAK,GAAG,IAAI,KAAK,IAAI;uCAChB,MAAM,KAAK,IAAI;;oCAElB,iBAAiB,GAAG,IAAI,KAAK,IAAI;mCAClC,WAAW,KAAK,IAAI;qCAClB,IAAI;8CACK,OAAO,KAAK,IAAI;4CAClB,MAAM,EAAE,KAAK,IAAI;;8CAEf,MAAM,KAAK,IAAI;uCACtB,IAAI;;CA4L9B,CAAC"}
|
package/dist/types/config.d.ts
CHANGED
|
@@ -7,22 +7,17 @@ import type { Asset } from 'rango-sdk';
|
|
|
7
7
|
* @property {string} background
|
|
8
8
|
* @property {string} foreground
|
|
9
9
|
* @property {string} primary
|
|
10
|
-
* @property {string}
|
|
11
|
-
* @property {string} error
|
|
12
|
-
* @property {string} warning
|
|
13
|
-
* @property {string} surface
|
|
14
|
-
* @property {string} neutral
|
|
10
|
+
* @property {string} secondary
|
|
15
11
|
*
|
|
16
12
|
*/
|
|
13
|
+
export type WidgetColorsKeys = keyof WidgetColors;
|
|
17
14
|
export type WidgetColors = {
|
|
18
15
|
background?: string;
|
|
19
16
|
foreground?: string;
|
|
20
|
-
primary?: string;
|
|
21
|
-
success?: string;
|
|
22
|
-
error?: string;
|
|
23
|
-
warning?: string;
|
|
24
|
-
surface?: string;
|
|
25
17
|
neutral?: string;
|
|
18
|
+
primary?: string;
|
|
19
|
+
secondary?: string;
|
|
20
|
+
info?: string;
|
|
26
21
|
};
|
|
27
22
|
/**
|
|
28
23
|
* The `WidgetTheme` defines the properties of a widget theme, including mode, font family, colors, border
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAEvC
|
|
1
|
+
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAEvC;;;;;;;GAOG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,YAAY,CAAC;AAClD,MAAM,MAAM,YAAY,GAAG;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE;QAAE,KAAK,EAAE,YAAY,CAAC;QAAC,IAAI,EAAE,YAAY,CAAA;KAAE,CAAC;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;CACrC,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,MAAM,wBAAwB,GAAG;IACrC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;CAClB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,wBAAwB,CAAC;IAChC,EAAE,CAAC,EAAE,wBAAwB,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,CAAC,UAAU,GAAG,iBAAiB,CAAC,EAAE,CAAC;IAC7C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,YAAY,CAAC,EAAE,KAAK,EAAE,CAAC;CACxB,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { WidgetColors } from '../types';
|
|
2
|
+
export declare const colorShade: (col: string, amt: number) => string;
|
|
3
|
+
export declare const generateRangeColors: (name: string, color: string) => {
|
|
4
|
+
[x: string]: string;
|
|
5
|
+
};
|
|
6
|
+
export declare const generateColors: (mainColors: {
|
|
7
|
+
[x: string]: string;
|
|
8
|
+
}, colors?: WidgetColors) => {
|
|
9
|
+
[x: string]: string;
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=colors.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/utils/colors.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAoB,MAAM,UAAU,CAAC;AAE/D,eAAO,MAAM,UAAU,QAAS,MAAM,OAAO,MAAM,WAyBlD,CAAC;AAEF,eAAO,MAAM,mBAAmB,SAAU,MAAM,SAAS,MAAM;;CAkC9D,CAAC;AACF,eAAO,MAAM,cAAc;;YAEhB,YAAY;;CA0BtB,CAAC"}
|
package/dist/utils/common.d.ts
CHANGED
|
@@ -2,9 +2,5 @@ export declare function removeDuplicateFrom<T>(array: T[]): T[];
|
|
|
2
2
|
export declare function areEqual(array1: (number | string)[], array2: (number | string)[]): boolean;
|
|
3
3
|
export declare function debounce(fn: Function, time: number): (...args: any) => void;
|
|
4
4
|
export declare function containsText(text: string, searchText: string): boolean;
|
|
5
|
-
export declare const colorShade: (col: string, amt: number) => string;
|
|
6
|
-
export declare const generateRangeColors: (name: string, color: string) => {
|
|
7
|
-
[x: string]: string;
|
|
8
|
-
};
|
|
9
5
|
export declare const getContainer: () => HTMLElement;
|
|
10
6
|
//# sourceMappingURL=common.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../src/utils/common.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../src/utils/common.ts"],"names":[],"mappings":"AAAA,wBAAgB,mBAAmB,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,CAEtD;AAED,wBAAgB,QAAQ,CACtB,MAAM,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EAC3B,MAAM,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,WAK5B;AAED,wBAAgB,QAAQ,CAAC,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,aAGvB,GAAG,UAS9B;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,OAAO,CAGtE;AAED,eAAO,MAAM,YAAY,mBAC2B,CAAC"}
|
package/dist/utils/configs.d.ts
CHANGED
|
@@ -9,4 +9,6 @@ export declare function setConfig(name: keyof Configs, value: any): any;
|
|
|
9
9
|
export declare function initConfig(nextConfigs: Configs): Configs;
|
|
10
10
|
export declare const DEFAULT_PRIMARY_RADIUS = 20;
|
|
11
11
|
export declare const DEFAULT_SECONDARY_RADIUS = 25;
|
|
12
|
+
export declare const DEFAULT_FONT_FAMILY = "Roboto";
|
|
13
|
+
export declare const THEME_CLASS_NAME_PREFIX = "theme-widget";
|
|
12
14
|
//# sourceMappingURL=configs.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"configs.d.ts","sourceRoot":"","sources":["../../src/utils/configs.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,OAAO;IACtB,OAAO,EAAE,MAAM,CAAC;CACjB;AAMD,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,OAAO,UAE5C;AAED,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,OAAO,EAAE,KAAK,EAAE,GAAG,OAIxD;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,WAAW,EAAE,OAAO,WAS9C;AAED,eAAO,MAAM,sBAAsB,KAAK,CAAC;AACzC,eAAO,MAAM,wBAAwB,KAAK,CAAC"}
|
|
1
|
+
{"version":3,"file":"configs.d.ts","sourceRoot":"","sources":["../../src/utils/configs.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,OAAO;IACtB,OAAO,EAAE,MAAM,CAAC;CACjB;AAMD,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,OAAO,UAE5C;AAED,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,OAAO,EAAE,KAAK,EAAE,GAAG,OAIxD;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,WAAW,EAAE,OAAO,WAS9C;AAED,eAAO,MAAM,sBAAsB,KAAK,CAAC;AACzC,eAAO,MAAM,wBAAwB,KAAK,CAAC;AAC3C,eAAO,MAAM,mBAAmB,WAAW,CAAC;AAE5C,eAAO,MAAM,uBAAuB,iBAAiB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hash.d.ts","sourceRoot":"","sources":["../../src/utils/hash.ts"],"names":[],"mappings":"AAyBA,eAAO,MAAM,MAAM,UAAW,MAAM,WAC0B,CAAC"}
|
package/dist/utils/meta.d.ts
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
import type { BlockchainMeta } from 'rango-sdk';
|
|
1
|
+
import type { Asset, BlockchainMeta, Token } from 'rango-sdk';
|
|
2
2
|
export declare function getBlockchainDisplayNameFor(blockchainName: string, blockchains: BlockchainMeta[]): string | undefined;
|
|
3
3
|
export declare function getBlockchainShortNameFor(blockchainName: string, blockchains: BlockchainMeta[]): string | undefined;
|
|
4
|
+
export declare function findToken(t: Asset, tokens: Token[]): Token | null;
|
|
5
|
+
export declare function findBlockchain(name: string, blockchains: BlockchainMeta[]): BlockchainMeta | null;
|
|
4
6
|
//# sourceMappingURL=meta.d.ts.map
|
package/dist/utils/meta.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/utils/meta.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/utils/meta.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAI9D,wBAAgB,2BAA2B,CACzC,cAAc,EAAE,MAAM,EACtB,WAAW,EAAE,cAAc,EAAE,GAC5B,MAAM,GAAG,SAAS,CAGpB;AACD,wBAAgB,yBAAyB,CACvC,cAAc,EAAE,MAAM,EACtB,WAAW,EAAE,cAAc,EAAE,GAC5B,MAAM,GAAG,SAAS,CAGpB;AAED,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,gBAElD;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,yBAEzE"}
|
package/dist/utils/routing.d.ts
CHANGED
|
@@ -15,7 +15,14 @@ export declare function getRequiredBalanceOfWallet(selectedWallet: Wallet, fee:
|
|
|
15
15
|
export declare function isRouteParametersChanged(params: BestRouteEqualityParams): boolean | undefined;
|
|
16
16
|
export declare function getFormattedBestRoute(bestRoute: BestRouteResponse | null): BestRouteResponse | null;
|
|
17
17
|
export declare function getFormattedPendingSwap(pendingSwap: PendingSwap): PendingSwap;
|
|
18
|
-
export declare const getBestRouteStatus: (loading: boolean, error: boolean) => "
|
|
18
|
+
export declare const getBestRouteStatus: (loading: boolean, error: boolean) => "loading" | "success" | "failed";
|
|
19
19
|
export declare function getPriceImpactLevel(priceImpact: number): PriceImpactWarningLevel;
|
|
20
20
|
export declare function findCommonTokens<T extends Asset[], R extends Asset[]>(listA: T, listB: R): R;
|
|
21
|
+
export declare function createRetryRoute(pendingSwap: PendingSwap, blockchains: BlockchainMeta[], tokens: Token[]): {
|
|
22
|
+
fromBlockchain: BlockchainMeta | null;
|
|
23
|
+
fromToken: Token | null;
|
|
24
|
+
toBlockchain: BlockchainMeta | null;
|
|
25
|
+
toToken: Token | null;
|
|
26
|
+
inputAmount: string;
|
|
27
|
+
};
|
|
21
28
|
//# sourceMappingURL=routing.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"routing.d.ts","sourceRoot":"","sources":["../../src/utils/routing.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAChE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,KAAK,EACV,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,8CAA8C,CAAC;AACtD,OAAO,KAAK,EACV,KAAK,EACL,iBAAiB,EACjB,cAAc,EACd,KAAK,EACN,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"routing.d.ts","sourceRoot":"","sources":["../../src/utils/routing.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAChE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,KAAK,EACV,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,8CAA8C,CAAC;AACtD,OAAO,KAAK,EACV,KAAK,EACL,iBAAiB,EACjB,cAAc,EACd,KAAK,EACN,MAAM,WAAW,CAAC;AAGnB,OAAO,SAAS,MAAM,cAAc,CAAC;AAerC,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,KAAK,EAAE,EACf,YAAY,EAAE,MAAM,GAAG,IAAI,EAC3B,KAAK,EAAE,cAAc,GAAG,IAAI,GAC3B,KAAK,GAAG,IAAI,CAqBd;AAED,wBAAgB,2BAA2B,CACzC,SAAS,EAAE,iBAAiB,GAAG,IAAI,GAClC,MAAM,GAAG,IAAI,GAAG,SAAS,CAG3B;AAED,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAK1B;AAED,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAO1B;AAED,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAO1B;AAED,wBAAgB,cAAc,CAC5B,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,GACxB,OAAO,CAMT;AAED,wBAAgB,oBAAoB,CAClC,YAAY,EAAE,SAAS,GAAG,IAAI,EAC9B,YAAY,EAAE,SAAS,GAAG,CAAC,WAQ5B;AAED,wBAAgB,0BAA0B,CACxC,cAAc,EAAE,MAAM,EACtB,GAAG,EAAE,0BAA0B,EAAE,GAAG,IAAI,GACvC,wBAAwB,EAAE,GAAG,IAAI,CAcnC;AAED,wBAAgB,wBAAwB,CAAC,MAAM,EAAE,uBAAuB,uBA4BvE;AAED,wBAAgB,qBAAqB,CACnC,SAAS,EAAE,iBAAiB,GAAG,IAAI,GAClC,iBAAiB,GAAG,IAAI,CAyB1B;AAED,wBAAgB,uBAAuB,CAAC,WAAW,EAAE,WAAW,GAAG,WAAW,CA6B7E;AAGD,eAAO,MAAM,kBAAkB,YAAa,OAAO,SAAS,OAAO,qCAQlE,CAAC;AAEF,wBAAgB,mBAAmB,CACjC,WAAW,EAAE,MAAM,GAClB,uBAAuB,CASzB;AAED,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,KAAK,EAAE,EAAE,CAAC,SAAS,KAAK,EAAE,EACnE,KAAK,EAAE,CAAC,EACR,KAAK,EAAE,CAAC,KAUT;AAED,wBAAgB,gBAAgB,CAC9B,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,cAAc,EAAE,EAC7B,MAAM,EAAE,KAAK,EAAE,GACd;IACD,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,SAAS,EAAE,KAAK,GAAG,IAAI,CAAC;IACxB,YAAY,EAAE,cAAc,GAAG,IAAI,CAAC;IACpC,OAAO,EAAE,KAAK,GAAG,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;CACrB,CA4CA"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { WidgetTheme } from '../types';
|
|
2
|
+
import type { createTheme } from '@rango-dev/ui';
|
|
3
|
+
interface CustomizedThemeValues {
|
|
4
|
+
id: string;
|
|
5
|
+
tokens: Parameters<typeof createTheme>[0];
|
|
6
|
+
}
|
|
7
|
+
interface CustomizedTheme {
|
|
8
|
+
light: undefined | CustomizedThemeValues;
|
|
9
|
+
dark: undefined | CustomizedThemeValues;
|
|
10
|
+
}
|
|
11
|
+
export declare function customizedThemeTokens(colors: WidgetTheme['colors']): CustomizedTheme;
|
|
12
|
+
export {};
|
|
13
|
+
//# sourceMappingURL=ui.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/utils/ui.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAYjD,UAAU,qBAAqB;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;CAC3C;AAED,UAAU,eAAe;IACvB,KAAK,EAAE,SAAS,GAAG,qBAAqB,CAAC;IACzC,IAAI,EAAE,SAAS,GAAG,qBAAqB,CAAC;CACzC;AAED,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,WAAW,CAAC,QAAQ,CAAC,GAC5B,eAAe,CAoDjB"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rango-dev/widget-embedded",
|
|
3
|
-
"version": "0.14.1-next.
|
|
3
|
+
"version": "0.14.1-next.10",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -19,12 +19,12 @@
|
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"@lingui/core": "4.2.1",
|
|
21
21
|
"@lingui/react": "4.2.1",
|
|
22
|
-
"@rango-dev/provider-all": "^0.17.
|
|
22
|
+
"@rango-dev/provider-all": "^0.17.1-next.1",
|
|
23
23
|
"@rango-dev/queue-manager-core": "^0.17.0",
|
|
24
|
-
"@rango-dev/queue-manager-rango-preset": "^0.17.
|
|
24
|
+
"@rango-dev/queue-manager-rango-preset": "^0.17.1-next.1",
|
|
25
25
|
"@rango-dev/queue-manager-react": "^0.17.0",
|
|
26
|
-
"@rango-dev/ui": "^0.17.
|
|
27
|
-
"@rango-dev/wallets-react": "^0.3.0",
|
|
26
|
+
"@rango-dev/ui": "^0.17.1-next.7",
|
|
27
|
+
"@rango-dev/wallets-react": "^0.3.1-next.0",
|
|
28
28
|
"@rango-dev/wallets-shared": "^0.17.0",
|
|
29
29
|
"bignumber.js": "^9.1.1",
|
|
30
30
|
"copy-to-clipboard": "^3.3.3",
|
package/src/Widget.tsx
CHANGED
|
@@ -12,6 +12,7 @@ import { globalFont } from './globalStyles';
|
|
|
12
12
|
import { useTheme } from './hooks/useTheme';
|
|
13
13
|
import QueueManager from './QueueManager';
|
|
14
14
|
import { useAppStore } from './store/app';
|
|
15
|
+
import { useMetaStore } from './store/meta';
|
|
15
16
|
import { useNotificationStore } from './store/notification';
|
|
16
17
|
import { useSettingsStore } from './store/settings';
|
|
17
18
|
import { initConfig } from './utils/configs';
|
|
@@ -29,7 +30,7 @@ const MainContainer = styled('div', {
|
|
|
29
30
|
listStyleType: 'none',
|
|
30
31
|
},
|
|
31
32
|
'& *:focus-visible': {
|
|
32
|
-
|
|
33
|
+
outlineColor: '$info500',
|
|
33
34
|
transition: 'none',
|
|
34
35
|
},
|
|
35
36
|
});
|
|
@@ -47,6 +48,7 @@ export function Main(props: PropsWithChildren<WidgetProps>) {
|
|
|
47
48
|
useState<string>('');
|
|
48
49
|
const [disconnectedWallet, setDisconnectedWallet] = useState<WalletType>();
|
|
49
50
|
const widgetContext = useContext(WidgetContext);
|
|
51
|
+
const fetchMeta = useMetaStore.use.fetchMeta();
|
|
50
52
|
|
|
51
53
|
useMemo(() => {
|
|
52
54
|
if (config?.apiKey) {
|
|
@@ -57,6 +59,7 @@ export function Main(props: PropsWithChildren<WidgetProps>) {
|
|
|
57
59
|
}, [config]);
|
|
58
60
|
|
|
59
61
|
useEffect(() => {
|
|
62
|
+
void fetchMeta();
|
|
60
63
|
void useSettingsStore.persist.rehydrate();
|
|
61
64
|
void useNotificationStore.persist.rehydrate();
|
|
62
65
|
widgetContext.onConnectWallet(setLastConnectedWalletWithNetwork);
|
|
@@ -64,7 +67,7 @@ export function Main(props: PropsWithChildren<WidgetProps>) {
|
|
|
64
67
|
|
|
65
68
|
return (
|
|
66
69
|
<I18nManager language={config?.language}>
|
|
67
|
-
<MainContainer id="swap-container" className={activeTheme}>
|
|
70
|
+
<MainContainer id="swap-container" className={activeTheme()}>
|
|
68
71
|
<QueueManager>
|
|
69
72
|
<WidgetEvents />
|
|
70
73
|
<AppRouter
|
|
@@ -63,8 +63,8 @@ export function BlockchainsSection(props: PropTypes) {
|
|
|
63
63
|
</BlockchainsChip>
|
|
64
64
|
{blockchainsList.list.map((item) => (
|
|
65
65
|
<BlockchainsChip
|
|
66
|
-
key={item.
|
|
67
|
-
selected={!!blockchain && blockchain.
|
|
66
|
+
key={item.name}
|
|
67
|
+
selected={!!blockchain && blockchain.name === item.name}
|
|
68
68
|
onClick={() => onChange(item)}>
|
|
69
69
|
<Image src={item.logo} size={30} />
|
|
70
70
|
</BlockchainsChip>
|
|
@@ -24,7 +24,7 @@ import React, { forwardRef, useEffect, useState } from 'react';
|
|
|
24
24
|
import { useAppStore } from '../../store/app';
|
|
25
25
|
import { useMetaStore } from '../../store/meta';
|
|
26
26
|
import { useWalletsStore } from '../../store/wallets';
|
|
27
|
-
import { generateRangeColors } from '../../utils/
|
|
27
|
+
import { generateRangeColors } from '../../utils/colors';
|
|
28
28
|
|
|
29
29
|
import { LoadingTokenList } from './LoadingTokenList';
|
|
30
30
|
import {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export const DEFAULT_FONT_FAMILY = 'Roboto';
|
|
@@ -57,7 +57,7 @@ export function useSyncStoresWithConfig(config: WidgetConfig | undefined) {
|
|
|
57
57
|
}, [
|
|
58
58
|
config?.from?.token?.symbol,
|
|
59
59
|
config?.from?.token?.address,
|
|
60
|
-
config?.from?.blockchain,
|
|
60
|
+
config?.from?.token?.blockchain,
|
|
61
61
|
config?.from?.blockchain,
|
|
62
62
|
loadingMetaStatus,
|
|
63
63
|
]);
|
package/src/hooks/useTheme.ts
CHANGED
|
@@ -1,27 +1,37 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-magic-numbers */
|
|
1
2
|
import type { WidgetTheme } from '../types';
|
|
2
3
|
|
|
3
|
-
import {
|
|
4
|
+
import {
|
|
5
|
+
createTheme,
|
|
6
|
+
darkTheme as defaultDarkTheme,
|
|
7
|
+
lightTheme as defaultLightTheme,
|
|
8
|
+
} from '@rango-dev/ui';
|
|
4
9
|
import { useEffect, useState } from 'react';
|
|
5
10
|
|
|
6
|
-
import { useMetaStore } from '../store/meta';
|
|
7
11
|
import { useSettingsStore } from '../store/settings';
|
|
8
12
|
import {
|
|
13
|
+
DEFAULT_FONT_FAMILY,
|
|
9
14
|
DEFAULT_PRIMARY_RADIUS,
|
|
10
15
|
DEFAULT_SECONDARY_RADIUS,
|
|
11
16
|
} from '../utils/configs';
|
|
17
|
+
import { customizedThemeTokens } from '../utils/ui';
|
|
18
|
+
|
|
19
|
+
export function useTheme(props: WidgetTheme) {
|
|
20
|
+
const {
|
|
21
|
+
colors,
|
|
22
|
+
fontFamily = DEFAULT_FONT_FAMILY,
|
|
23
|
+
borderRadius = DEFAULT_PRIMARY_RADIUS,
|
|
24
|
+
secondaryBorderRadius = DEFAULT_SECONDARY_RADIUS,
|
|
25
|
+
mode = 'auto',
|
|
26
|
+
} = props;
|
|
12
27
|
|
|
13
|
-
|
|
14
|
-
// colors,
|
|
15
|
-
fontFamily = 'Roboto',
|
|
16
|
-
borderRadius = DEFAULT_PRIMARY_RADIUS,
|
|
17
|
-
secondaryBorderRadius = DEFAULT_SECONDARY_RADIUS,
|
|
18
|
-
mode = 'auto',
|
|
19
|
-
}: WidgetTheme) {
|
|
28
|
+
const [OSTheme, setOSTheme] = useState('light');
|
|
20
29
|
const theme = useSettingsStore.use.theme();
|
|
21
|
-
const fetchMeta = useMetaStore.use.fetchMeta();
|
|
22
30
|
const setTheme = useSettingsStore.use.setTheme();
|
|
23
31
|
|
|
24
|
-
const
|
|
32
|
+
const { dark, light } = customizedThemeTokens(colors);
|
|
33
|
+
|
|
34
|
+
const baseTheme = createTheme({
|
|
25
35
|
radii: {
|
|
26
36
|
primary: `${borderRadius}px`,
|
|
27
37
|
secondary: `${secondaryBorderRadius}px`,
|
|
@@ -30,19 +40,24 @@ export function useTheme({
|
|
|
30
40
|
widget: fontFamily,
|
|
31
41
|
},
|
|
32
42
|
});
|
|
43
|
+
const lightThemeClasses = [baseTheme.className, defaultLightTheme.className];
|
|
44
|
+
const darkThemeClasses = [baseTheme.className, defaultDarkTheme.className];
|
|
33
45
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
46
|
+
/*
|
|
47
|
+
* If theme has been customized, we will push the customized theme to override the default themes.
|
|
48
|
+
* To be overridden, it should be last thing that has been pushed.
|
|
49
|
+
*/
|
|
50
|
+
if (light) {
|
|
51
|
+
const customizedLightTheme = createTheme(light.id, light.tokens);
|
|
52
|
+
lightThemeClasses.push(customizedLightTheme.className);
|
|
53
|
+
}
|
|
54
|
+
if (dark) {
|
|
55
|
+
const customizedDarkTheme = createTheme(dark.id, dark.tokens);
|
|
56
|
+
darkThemeClasses.push(customizedDarkTheme.className);
|
|
57
|
+
}
|
|
38
58
|
|
|
39
59
|
useEffect(() => {
|
|
40
|
-
const
|
|
41
|
-
await fetchMeta();
|
|
42
|
-
};
|
|
43
|
-
void fetchData();
|
|
44
|
-
|
|
45
|
-
const switchTheme = (event: MediaQueryListEvent) => {
|
|
60
|
+
const switchThemeListener = (event: MediaQueryListEvent) => {
|
|
46
61
|
if (event.matches) {
|
|
47
62
|
setOSTheme('dark');
|
|
48
63
|
} else {
|
|
@@ -59,13 +74,14 @@ export function useTheme({
|
|
|
59
74
|
|
|
60
75
|
window
|
|
61
76
|
.matchMedia('(prefers-color-scheme: dark)')
|
|
62
|
-
.addEventListener('change',
|
|
77
|
+
.addEventListener('change', switchThemeListener);
|
|
63
78
|
return () => {
|
|
64
79
|
window
|
|
65
80
|
.matchMedia('(prefers-color-scheme: dark)')
|
|
66
|
-
.removeEventListener('change',
|
|
81
|
+
.removeEventListener('change', switchThemeListener);
|
|
67
82
|
};
|
|
68
83
|
}, []);
|
|
84
|
+
|
|
69
85
|
useEffect(() => {
|
|
70
86
|
if (mode !== 'auto') {
|
|
71
87
|
setTheme(mode);
|
|
@@ -73,11 +89,13 @@ export function useTheme({
|
|
|
73
89
|
}, [mode]);
|
|
74
90
|
|
|
75
91
|
const getActiveTheme = () => {
|
|
92
|
+
const lightClassNames = lightThemeClasses.join(' ');
|
|
93
|
+
const darkClassNames = darkThemeClasses.join(' ');
|
|
76
94
|
if (theme === 'auto') {
|
|
77
|
-
return OSTheme === 'dark' ?
|
|
95
|
+
return OSTheme === 'dark' ? darkClassNames : lightClassNames;
|
|
78
96
|
}
|
|
79
|
-
return theme === 'dark' ?
|
|
97
|
+
return theme === 'dark' ? darkClassNames : lightClassNames;
|
|
80
98
|
};
|
|
81
99
|
|
|
82
|
-
return { activeTheme: getActiveTheme
|
|
100
|
+
return { activeTheme: getActiveTheme };
|
|
83
101
|
}
|
package/src/index.ts
CHANGED
|
@@ -1,46 +1,53 @@
|
|
|
1
|
-
import {
|
|
2
|
-
WidgetTheme,
|
|
3
|
-
WidgetConfig,
|
|
4
|
-
WidgetColors,
|
|
1
|
+
import type {
|
|
5
2
|
BlockchainAndTokenConfig,
|
|
3
|
+
WidgetColors,
|
|
4
|
+
WidgetColorsKeys,
|
|
5
|
+
WidgetConfig,
|
|
6
|
+
WidgetTheme,
|
|
6
7
|
} from './types';
|
|
7
|
-
import { WidgetProps
|
|
8
|
-
import {
|
|
9
|
-
import { WidgetWallets } from './Wallets';
|
|
10
|
-
import {
|
|
11
|
-
useWallets,
|
|
12
|
-
ProviderInterface,
|
|
13
|
-
EventHandler as HandleWalletsUpdate,
|
|
14
|
-
} from '@rango-dev/wallets-react';
|
|
15
|
-
import {
|
|
16
|
-
useEvents as useWidgetEvents,
|
|
17
|
-
MainEvents,
|
|
18
|
-
RouteEvent,
|
|
19
|
-
StepEvent,
|
|
8
|
+
import type { WidgetProps } from './Widget';
|
|
9
|
+
import type {
|
|
20
10
|
Route,
|
|
21
|
-
|
|
11
|
+
RouteEvent,
|
|
12
|
+
RouteFailedEvent,
|
|
22
13
|
RouteStartedEvent,
|
|
23
14
|
RouteSucceededEvent,
|
|
24
|
-
|
|
25
|
-
|
|
15
|
+
Step,
|
|
16
|
+
StepApprovalTxSucceededEvent,
|
|
17
|
+
StepCheckStatusEvent,
|
|
18
|
+
StepEvent,
|
|
19
|
+
StepFailedEvent,
|
|
20
|
+
StepOutputRevealedEvent,
|
|
26
21
|
StepStartedEvent,
|
|
27
22
|
StepSucceededEvent,
|
|
28
|
-
StepFailedEvent,
|
|
29
|
-
StepTxExecutionUpdatedEvent,
|
|
30
23
|
StepTxExecutionBlockedEvent,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
24
|
+
StepTxExecutionUpdatedEvent,
|
|
25
|
+
} from '@rango-dev/queue-manager-rango-preset';
|
|
26
|
+
import type {
|
|
27
|
+
EventHandler as HandleWalletsUpdate,
|
|
28
|
+
ProviderInterface,
|
|
29
|
+
} from '@rango-dev/wallets-react';
|
|
30
|
+
import type { WalletType } from '@rango-dev/wallets-shared';
|
|
31
|
+
|
|
32
|
+
import {
|
|
33
|
+
MainEvents,
|
|
34
|
+
RouteEventType,
|
|
34
35
|
StepEventType,
|
|
35
|
-
StepExecutionEventStatus,
|
|
36
36
|
StepExecutionBlockedEventStatus,
|
|
37
|
+
StepExecutionEventStatus,
|
|
38
|
+
useEvents as useWidgetEvents,
|
|
37
39
|
} from '@rango-dev/queue-manager-rango-preset';
|
|
40
|
+
import { useWallets } from '@rango-dev/wallets-react';
|
|
41
|
+
|
|
42
|
+
import { WidgetWallets } from './Wallets';
|
|
43
|
+
import { Widget } from './Widget';
|
|
38
44
|
|
|
39
45
|
export type {
|
|
40
46
|
WidgetConfig,
|
|
41
47
|
WalletType,
|
|
42
48
|
WidgetTheme,
|
|
43
49
|
WidgetColors,
|
|
50
|
+
WidgetColorsKeys,
|
|
44
51
|
ProviderInterface,
|
|
45
52
|
BlockchainAndTokenConfig,
|
|
46
53
|
WidgetProps,
|
package/src/store/bestRoute.ts
CHANGED
|
@@ -9,9 +9,11 @@ import { subscribeWithSelector } from 'zustand/middleware';
|
|
|
9
9
|
|
|
10
10
|
import { ZERO } from '../constants/numbers';
|
|
11
11
|
import { isPositiveNumber } from '../utils/numbers';
|
|
12
|
-
import {
|
|
12
|
+
import {
|
|
13
|
+
createRetryRoute,
|
|
14
|
+
getBestRouteToTokenUsdPrice,
|
|
15
|
+
} from '../utils/routing';
|
|
13
16
|
import { calcOutputUsdValue } from '../utils/swap';
|
|
14
|
-
import { tokensAreEqual } from '../utils/wallets';
|
|
15
17
|
|
|
16
18
|
import { useMetaStore } from './meta';
|
|
17
19
|
import createSelectors from './selectors';
|
|
@@ -116,13 +118,14 @@ export const useBestRouteStore = createSelectors(
|
|
|
116
118
|
},
|
|
117
119
|
setFromToken: (token) => {
|
|
118
120
|
const { blockchains } = useMetaStore.getState().meta;
|
|
119
|
-
const fromBlockchain =
|
|
120
|
-
blockchains.find(
|
|
121
|
-
(blockchain) => blockchain.name === token?.blockchain
|
|
122
|
-
) ?? null;
|
|
123
121
|
return set((state) => ({
|
|
124
122
|
fromToken: token,
|
|
125
|
-
|
|
123
|
+
...(token && {
|
|
124
|
+
fromBlockchain:
|
|
125
|
+
blockchains.find(
|
|
126
|
+
(blockchain) => blockchain.name === token.blockchain
|
|
127
|
+
) ?? null,
|
|
128
|
+
}),
|
|
126
129
|
...(!!state.inputAmount && {
|
|
127
130
|
inputUsdValue: getUsdValue(token, state.inputAmount),
|
|
128
131
|
}),
|
|
@@ -147,13 +150,14 @@ export const useBestRouteStore = createSelectors(
|
|
|
147
150
|
},
|
|
148
151
|
setToToken: (token) => {
|
|
149
152
|
const { blockchains } = useMetaStore.getState().meta;
|
|
150
|
-
const toBlockchain =
|
|
151
|
-
blockchains.find(
|
|
152
|
-
(blockchain) => blockchain.name === token?.blockchain
|
|
153
|
-
) ?? null;
|
|
154
153
|
return set(() => ({
|
|
155
154
|
toToken: token,
|
|
156
|
-
|
|
155
|
+
...(token && {
|
|
156
|
+
toBlockchain:
|
|
157
|
+
blockchains.find(
|
|
158
|
+
(blockchain) => blockchain.name === token.blockchain
|
|
159
|
+
) ?? null,
|
|
160
|
+
}),
|
|
157
161
|
}));
|
|
158
162
|
},
|
|
159
163
|
setInputAmount: (amount) => {
|
|
@@ -171,49 +175,21 @@ export const useBestRouteStore = createSelectors(
|
|
|
171
175
|
},
|
|
172
176
|
retry: (pendingSwap) => {
|
|
173
177
|
const { tokens, blockchains } = useMetaStore.getState().meta;
|
|
174
|
-
const failedIndex =
|
|
175
|
-
pendingSwap.status === 'failed'
|
|
176
|
-
? pendingSwap.steps.findIndex((s) => s.status === 'failed')
|
|
177
|
-
: null;
|
|
178
|
-
|
|
179
|
-
if (failedIndex === null || failedIndex < 0) {
|
|
180
|
-
return;
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
const firstStep = pendingSwap.steps[0];
|
|
184
|
-
const lastStep = pendingSwap.steps[pendingSwap.steps.length - 1];
|
|
185
|
-
const fromBlockchain =
|
|
186
|
-
blockchains.find(
|
|
187
|
-
(blockchain) => blockchain.name === firstStep.fromBlockchain
|
|
188
|
-
) || null;
|
|
189
|
-
const toBlockchain =
|
|
190
|
-
blockchains.find(
|
|
191
|
-
(blockchain) => blockchain.name === lastStep.toBlockchain
|
|
192
|
-
) || null;
|
|
193
178
|
|
|
194
|
-
const
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
);
|
|
201
|
-
|
|
202
|
-
const toToken = tokens.find((token) =>
|
|
203
|
-
tokensAreEqual(token, {
|
|
204
|
-
blockchain: lastStep.toBlockchain,
|
|
205
|
-
symbol: lastStep.toSymbol,
|
|
206
|
-
address: lastStep.toSymbolAddress,
|
|
207
|
-
})
|
|
208
|
-
);
|
|
179
|
+
const {
|
|
180
|
+
fromBlockchain,
|
|
181
|
+
fromToken,
|
|
182
|
+
toBlockchain,
|
|
183
|
+
toToken,
|
|
184
|
+
inputAmount,
|
|
185
|
+
} = createRetryRoute(pendingSwap, blockchains, tokens);
|
|
209
186
|
|
|
210
|
-
const inputAmount = pendingSwap.inputAmount;
|
|
211
187
|
set({
|
|
212
188
|
fromBlockchain,
|
|
213
189
|
fromToken,
|
|
214
190
|
inputAmount,
|
|
215
191
|
outputAmount: null,
|
|
216
|
-
inputUsdValue: getUsdValue(fromToken
|
|
192
|
+
inputUsdValue: getUsdValue(fromToken ?? null, inputAmount),
|
|
217
193
|
outputUsdValue: new BigNumber(0),
|
|
218
194
|
toBlockchain,
|
|
219
195
|
toToken,
|
package/src/types/config.ts
CHANGED
|
@@ -8,22 +8,17 @@ import type { Asset } from 'rango-sdk';
|
|
|
8
8
|
* @property {string} background
|
|
9
9
|
* @property {string} foreground
|
|
10
10
|
* @property {string} primary
|
|
11
|
-
* @property {string}
|
|
12
|
-
* @property {string} error
|
|
13
|
-
* @property {string} warning
|
|
14
|
-
* @property {string} surface
|
|
15
|
-
* @property {string} neutral
|
|
11
|
+
* @property {string} secondary
|
|
16
12
|
*
|
|
17
13
|
*/
|
|
14
|
+
export type WidgetColorsKeys = keyof WidgetColors;
|
|
18
15
|
export type WidgetColors = {
|
|
19
16
|
background?: string;
|
|
20
17
|
foreground?: string;
|
|
21
|
-
primary?: string;
|
|
22
|
-
success?: string;
|
|
23
|
-
error?: string;
|
|
24
|
-
warning?: string;
|
|
25
|
-
surface?: string;
|
|
26
18
|
neutral?: string;
|
|
19
|
+
primary?: string;
|
|
20
|
+
secondary?: string;
|
|
21
|
+
info?: string;
|
|
27
22
|
};
|
|
28
23
|
|
|
29
24
|
/**
|