@funkit/connect 9.2.0 → 9.3.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.
- package/CHANGELOG.md +35 -0
- package/dist/__generated__/default_configs.d.ts +31 -2
- package/dist/__generated__/default_feature_gates.d.ts +1 -0
- package/dist/{chunk-XCM74QX2.js → chunk-FHIMKOGH.js} +24 -1
- package/dist/{chunk-WSCXOKCX.js → chunk-NKJYA7IM.js} +24 -1
- package/dist/{chunk-SC53AFEE.js → chunk-TWG76V3I.js} +26 -4
- package/dist/clients/fanatics.css +5448 -3919
- package/dist/clients/fanatics.js +3 -3
- package/dist/components/Box/Box.d.ts +44 -44
- package/dist/components/FunButton/FunButton.css.d.ts +1 -0
- package/dist/components/FunButton/FunLinkButton.d.ts +2 -2
- package/dist/components/FunCheckoutHistory/FunDirectExecutionHistoryDetail.d.ts +1 -1
- package/dist/components/FunDivider/FunDivider.d.ts +2 -1
- package/dist/components/FunOptionBox/FunOptionBox.css.d.ts +1 -1
- package/dist/css/sprinkles.css.d.ts +120 -44
- package/dist/domains/relay.d.ts +2 -2
- package/dist/hooks/queries/useFops.d.ts +4 -198
- package/dist/hooks/statsig/useDynamicConfig.d.ts +3 -1
- package/dist/hooks/useCheckoutTransferInit.d.ts +5 -1
- package/dist/hooks/usePaymentSources.d.ts +6 -2
- package/dist/hooks/useScrollDivider.d.ts +1 -0
- package/dist/hooks/useSwappedPreload.d.ts +2 -3
- package/dist/index.css +5523 -3943
- package/dist/index.js +1127 -835
- package/dist/modals/CheckoutModal/SourceChange/SourceList.d.ts +4 -3
- package/dist/modals/CheckoutModal/SourceChange/sourceChange.css.d.ts +6 -0
- package/dist/modals/CheckoutModal/SwappedIframe/SwappedIframe.d.ts +2 -15
- package/dist/modals/CheckoutModal/SwappedIframe/SwappedIframeContainer.d.ts +15 -0
- package/dist/modals/CheckoutModal/SwappedIframe/index.d.ts +1 -1
- package/dist/providers/FunkitCheckoutContext/types.d.ts +5 -5
- package/dist/providers/FunkitConfigContext.d.ts +2 -0
- package/dist/providers/FunkitThemeProvider.d.ts +114 -0
- package/dist/providers/SwappedProvider.d.ts +8 -8
- package/dist/themes/baseTheme.js +1 -1
- package/dist/themes/darkTheme.js +2 -2
- package/dist/themes/lightTheme.js +2 -2
- package/dist/utils/checkout.d.ts +4 -4
- package/dist/utils/swapped.d.ts +6 -3
- package/dist/wallets/walletConnectors/index.js +40 -40
- package/package.json +2 -2
- package/dist/hooks/useIframePool.d.ts +0 -38
- package/dist/modals/CheckoutModal/SwappedIframe/SwappedIframePool.d.ts +0 -14
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { ConnectablePaymentMethodInfo, PaymentMethod } from '../../../domains/paymentMethods';
|
|
3
|
+
import { type UnavailablePaymentSource } from '../../../hooks/usePaymentSources';
|
|
3
4
|
interface SourceListProps {
|
|
4
5
|
preferred: (ConnectablePaymentMethodInfo | PaymentMethod)[];
|
|
5
6
|
moreSources: (ConnectablePaymentMethodInfo | PaymentMethod)[];
|
|
6
|
-
|
|
7
|
+
unavailable: UnavailablePaymentSource[];
|
|
7
8
|
isFallback: boolean;
|
|
8
9
|
renderSource: (source: ConnectablePaymentMethodInfo | PaymentMethod) => React.ReactNode;
|
|
9
|
-
|
|
10
|
+
renderUnavailable: (source: UnavailablePaymentSource) => React.ReactNode;
|
|
10
11
|
}
|
|
11
|
-
export declare function SourceList({ preferred, moreSources,
|
|
12
|
+
export declare function SourceList({ preferred, moreSources, unavailable, isFallback, renderSource, renderUnavailable, }: SourceListProps): React.JSX.Element;
|
|
12
13
|
export {};
|
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
export declare const WITH_EMPTY_STATE_DATA_ATTRIBUTE = "data-with-empty-state";
|
|
2
2
|
export declare const emptyStateStyles: string;
|
|
3
3
|
export declare const sourceListBoxStyles: string;
|
|
4
|
+
export declare const sourceListGroupContainerStyles: string;
|
|
5
|
+
export declare const sourceListGroupContainerNoLabelsStyles: string;
|
|
4
6
|
export declare const sourceListCompactBoxStyles: string;
|
|
7
|
+
export declare const removeBottomPaddingFromSurroundingDialog: string;
|
|
8
|
+
export declare const paymentMethodStaticArea: string;
|
|
9
|
+
export declare const paymentMethodScrollArea: string;
|
|
10
|
+
export declare const paymentMethodScrollbarHidden: string;
|
|
5
11
|
export declare const fullWidthContentDivider: string;
|
|
@@ -1,16 +1,3 @@
|
|
|
1
|
-
import type { SwappedFormOfPayment } from '@funkit/api-base';
|
|
2
1
|
import React from 'react';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export type SwappedIframeState = CheckoutModalCommonState & {
|
|
6
|
-
/** The selected payment option from the fops API */
|
|
7
|
-
selectedPaymentOption: SwappedFormOfPayment;
|
|
8
|
-
/** Payment method type filter to restore when returning to SOURCE_CHANGE */
|
|
9
|
-
paymentMethodTypeFilter?: PaymentMethodType;
|
|
10
|
-
};
|
|
11
|
-
export type SwappedIframeNext = {
|
|
12
|
-
success?: boolean;
|
|
13
|
-
};
|
|
14
|
-
export declare const SwappedIframeInfo: ModalStepInfo<FunCheckoutStep.SWAPPED_IFRAME>;
|
|
15
|
-
declare function SwappedIframe({ modalState, onNext, onBack, onClose, }: ModalStepComponentProps<FunCheckoutStep.SWAPPED_IFRAME>): React.JSX.Element;
|
|
16
|
-
export default SwappedIframe;
|
|
2
|
+
declare const _default: React.MemoExoticComponent<() => React.JSX.Element | null>;
|
|
3
|
+
export default _default;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { SwappedFormOfPayment } from '@funkit/api-base';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { PaymentMethodType } from '../../../hooks/usePaymentSources';
|
|
4
|
+
import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepComponentProps, type ModalStepInfo } from '../../../modals/CheckoutModal/stepTransition';
|
|
5
|
+
export type SwappedIframeState = CheckoutModalCommonState & {
|
|
6
|
+
/** The selected payment option from the fops API */
|
|
7
|
+
selectedPaymentOption: SwappedFormOfPayment;
|
|
8
|
+
/** Payment method type filter to restore when returning to SOURCE_CHANGE */
|
|
9
|
+
paymentMethodTypeFilter?: PaymentMethodType;
|
|
10
|
+
};
|
|
11
|
+
export type SwappedIframeNext = {
|
|
12
|
+
success?: boolean;
|
|
13
|
+
};
|
|
14
|
+
export declare const SwappedIframeInfo: ModalStepInfo<FunCheckoutStep.SWAPPED_IFRAME>;
|
|
15
|
+
export declare function SwappedIframeContainer({ modalState, onNext, onBack, onClose, }: ModalStepComponentProps<FunCheckoutStep.SWAPPED_IFRAME>): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { SwappedIframeContainer, SwappedIframeInfo, type SwappedIframeNext, type SwappedIframeState, } from './SwappedIframeContainer';
|
|
@@ -16,13 +16,13 @@ export interface DynamicTargetAssetCandidate extends TokenInfo {
|
|
|
16
16
|
badgeText?: string;
|
|
17
17
|
targetAssetMinAmount?: number;
|
|
18
18
|
/**
|
|
19
|
-
* Exchange rate of the target asset in terms of the
|
|
20
|
-
* Represents how many
|
|
19
|
+
* Exchange rate of the target asset in terms of the finalized token.
|
|
20
|
+
* Represents how many finalized tokens one unit of the target asset can be exchanged for.
|
|
21
21
|
*
|
|
22
|
-
* Example: If `targetAsset`/`
|
|
22
|
+
* Example: If `targetAsset`/`finalizedToken` is USDT/hbUSDT and the rate is 1.01,
|
|
23
23
|
* 1 USDT can be exchanged for 1.01 hbUSDT.
|
|
24
24
|
*/
|
|
25
|
-
|
|
25
|
+
finalizedTokenRate?: number;
|
|
26
26
|
dynamicRoutingId?: string;
|
|
27
27
|
}
|
|
28
28
|
export declare enum FunCheckoutStartingStep {
|
|
@@ -74,7 +74,7 @@ export interface FunkitCheckoutConfig extends Omit<ApiFunkitCheckoutConfig, 'gen
|
|
|
74
74
|
* to specify the onchain action to execute after deposit */
|
|
75
75
|
qrcodeActionType?: string;
|
|
76
76
|
/** set this if you want enable vault like deposit*/
|
|
77
|
-
|
|
77
|
+
finalizedToken?: DynamicTargetAssetCandidate;
|
|
78
78
|
/**
|
|
79
79
|
* For dynamic routing, the id of the dynamic route to use
|
|
80
80
|
*/
|
|
@@ -85,6 +85,8 @@ export type FunkitPaymentMethodIconsConfig = Partial<Record<PaymentMethod, {
|
|
|
85
85
|
export interface FunkitUiCustomizationsConfig {
|
|
86
86
|
/** Title alignment - defaults to "center" */
|
|
87
87
|
alignTitle?: 'left' | 'center';
|
|
88
|
+
/** Always shows checkout modal top divider even if content cannot scroll - defaults to `false` */
|
|
89
|
+
alwaysShowTopDivider?: boolean;
|
|
88
90
|
/** Whether to show CTA in uppercase - defaults to false */
|
|
89
91
|
callToActionsUppercase?: boolean;
|
|
90
92
|
/** Whether to enable compact list style for option boxes - defaults to false */
|
|
@@ -55,7 +55,9 @@ export declare const useActiveTheme: () => {
|
|
|
55
55
|
secondaryText: string;
|
|
56
56
|
tertiaryText: string;
|
|
57
57
|
textSelection: string;
|
|
58
|
+
inputLabel: string;
|
|
58
59
|
inputBackground: string;
|
|
60
|
+
inputBackgroundHover: string;
|
|
59
61
|
inputBorderBase: string;
|
|
60
62
|
inputBorderHover: string;
|
|
61
63
|
activeTabBorderColor: string;
|
|
@@ -130,9 +132,29 @@ export declare const useActiveTheme: () => {
|
|
|
130
132
|
fiatAccountGradientTo: string;
|
|
131
133
|
optionBoxBackground: string;
|
|
132
134
|
optionBoxBackgroundUninteractive: string;
|
|
135
|
+
optionBoxBorderBase: string;
|
|
136
|
+
optionBoxBorderHover: string;
|
|
137
|
+
optionBoxDefaultModeNotActiveBorderBase: string;
|
|
138
|
+
optionBoxDefaultModeNotActiveBorderHover: string;
|
|
139
|
+
openDropdownBackgroundColor: string;
|
|
133
140
|
dropdownActiveItemBackgroundBase: string;
|
|
134
141
|
dropdownActiveItemBackgroundHover: string;
|
|
135
142
|
dropdownActiveItemBackgroundDisabled: string;
|
|
143
|
+
dropdownActiveItemBorderBase: string;
|
|
144
|
+
dropdownActiveItemBorderHover: string;
|
|
145
|
+
selectedDropdownItemBackground: string;
|
|
146
|
+
alwaysVisibleLabelBackgroundHover: string;
|
|
147
|
+
selectedDropdownItemText: string;
|
|
148
|
+
dropdownLabelColor: string;
|
|
149
|
+
copyButtonBackgroundBase: string;
|
|
150
|
+
copyButtonBackgroundHover: string;
|
|
151
|
+
copyButtonBackgroundActive: string;
|
|
152
|
+
copyButtonBorderBase: string;
|
|
153
|
+
copyButtonBorderHover: string;
|
|
154
|
+
funFeatureListBackgroundBase: string;
|
|
155
|
+
funFeatureListBackgroundHover: string;
|
|
156
|
+
funFeatureListBorderColor: string;
|
|
157
|
+
funFeatureListBorderColorHover: string;
|
|
136
158
|
spinnerBackground: string;
|
|
137
159
|
spinnerIndicator: string;
|
|
138
160
|
spinnerBackgroundVerifyAccount: string;
|
|
@@ -160,6 +182,7 @@ export declare const useActiveTheme: () => {
|
|
|
160
182
|
paymentAmountSkeletonCircleSize: string;
|
|
161
183
|
paymentMethodItemIconSize: string;
|
|
162
184
|
selectAssetItemIconSize: string;
|
|
185
|
+
sourceListGap: string;
|
|
163
186
|
txBreakdownSkeletonWidth: string;
|
|
164
187
|
txSummaryLineSkeletonHeight: string;
|
|
165
188
|
txSummaryLineSkeletonWidth: string;
|
|
@@ -355,6 +378,14 @@ export declare const useActiveTheme: () => {
|
|
|
355
378
|
fontSize: string;
|
|
356
379
|
lineHeight: string;
|
|
357
380
|
};
|
|
381
|
+
quickOptionFontSize: {
|
|
382
|
+
fontSize: string;
|
|
383
|
+
lineHeight: string;
|
|
384
|
+
};
|
|
385
|
+
useConnectedFontSize: {
|
|
386
|
+
fontSize: string;
|
|
387
|
+
lineHeight: string;
|
|
388
|
+
};
|
|
358
389
|
};
|
|
359
390
|
radii: {
|
|
360
391
|
actionButton: string;
|
|
@@ -373,7 +404,10 @@ export declare const useActiveTheme: () => {
|
|
|
373
404
|
tooltip: string;
|
|
374
405
|
dropdown: string;
|
|
375
406
|
dropdownItem: string;
|
|
407
|
+
dropdownList: string;
|
|
376
408
|
modalTopbarIcon: string;
|
|
409
|
+
withdrawalInput: string;
|
|
410
|
+
useConnected: string;
|
|
377
411
|
};
|
|
378
412
|
borderWidths: {
|
|
379
413
|
activeOptionBorderWidth: string;
|
|
@@ -436,6 +470,10 @@ export declare const useActiveTheme: () => {
|
|
|
436
470
|
youPayYouReceivePaddingLeft: string;
|
|
437
471
|
youPayYouReceivePaddingRight: string;
|
|
438
472
|
youPayYouReceivePaddingY: string;
|
|
473
|
+
inputPaddingX: string;
|
|
474
|
+
inputPaddingY: string;
|
|
475
|
+
dropdownActiveItemRegularSizePaddingY: string;
|
|
476
|
+
assetListDefaultGap: string;
|
|
439
477
|
};
|
|
440
478
|
textTransforms: {
|
|
441
479
|
inputAmountQuickOptionButton: string;
|
|
@@ -491,7 +529,9 @@ export declare const useActiveTheme: () => {
|
|
|
491
529
|
secondaryText: string;
|
|
492
530
|
tertiaryText: string;
|
|
493
531
|
textSelection: string;
|
|
532
|
+
inputLabel: string;
|
|
494
533
|
inputBackground: string;
|
|
534
|
+
inputBackgroundHover: string;
|
|
495
535
|
inputBorderBase: string;
|
|
496
536
|
inputBorderHover: string;
|
|
497
537
|
activeTabBorderColor: string;
|
|
@@ -566,9 +606,29 @@ export declare const useActiveTheme: () => {
|
|
|
566
606
|
fiatAccountGradientTo: string;
|
|
567
607
|
optionBoxBackground: string;
|
|
568
608
|
optionBoxBackgroundUninteractive: string;
|
|
609
|
+
optionBoxBorderBase: string;
|
|
610
|
+
optionBoxBorderHover: string;
|
|
611
|
+
optionBoxDefaultModeNotActiveBorderBase: string;
|
|
612
|
+
optionBoxDefaultModeNotActiveBorderHover: string;
|
|
613
|
+
openDropdownBackgroundColor: string;
|
|
569
614
|
dropdownActiveItemBackgroundBase: string;
|
|
570
615
|
dropdownActiveItemBackgroundHover: string;
|
|
571
616
|
dropdownActiveItemBackgroundDisabled: string;
|
|
617
|
+
dropdownActiveItemBorderBase: string;
|
|
618
|
+
dropdownActiveItemBorderHover: string;
|
|
619
|
+
selectedDropdownItemBackground: string;
|
|
620
|
+
alwaysVisibleLabelBackgroundHover: string;
|
|
621
|
+
selectedDropdownItemText: string;
|
|
622
|
+
dropdownLabelColor: string;
|
|
623
|
+
copyButtonBackgroundBase: string;
|
|
624
|
+
copyButtonBackgroundHover: string;
|
|
625
|
+
copyButtonBackgroundActive: string;
|
|
626
|
+
copyButtonBorderBase: string;
|
|
627
|
+
copyButtonBorderHover: string;
|
|
628
|
+
funFeatureListBackgroundBase: string;
|
|
629
|
+
funFeatureListBackgroundHover: string;
|
|
630
|
+
funFeatureListBorderColor: string;
|
|
631
|
+
funFeatureListBorderColorHover: string;
|
|
572
632
|
spinnerBackground: string;
|
|
573
633
|
spinnerIndicator: string;
|
|
574
634
|
spinnerBackgroundVerifyAccount: string;
|
|
@@ -596,6 +656,7 @@ export declare const useActiveTheme: () => {
|
|
|
596
656
|
paymentAmountSkeletonCircleSize: string;
|
|
597
657
|
paymentMethodItemIconSize: string;
|
|
598
658
|
selectAssetItemIconSize: string;
|
|
659
|
+
sourceListGap: string;
|
|
599
660
|
txBreakdownSkeletonWidth: string;
|
|
600
661
|
txSummaryLineSkeletonHeight: string;
|
|
601
662
|
txSummaryLineSkeletonWidth: string;
|
|
@@ -791,6 +852,14 @@ export declare const useActiveTheme: () => {
|
|
|
791
852
|
fontSize: string;
|
|
792
853
|
lineHeight: string;
|
|
793
854
|
};
|
|
855
|
+
quickOptionFontSize: {
|
|
856
|
+
fontSize: string;
|
|
857
|
+
lineHeight: string;
|
|
858
|
+
};
|
|
859
|
+
useConnectedFontSize: {
|
|
860
|
+
fontSize: string;
|
|
861
|
+
lineHeight: string;
|
|
862
|
+
};
|
|
794
863
|
};
|
|
795
864
|
radii: {
|
|
796
865
|
actionButton: string;
|
|
@@ -809,7 +878,10 @@ export declare const useActiveTheme: () => {
|
|
|
809
878
|
tooltip: string;
|
|
810
879
|
dropdown: string;
|
|
811
880
|
dropdownItem: string;
|
|
881
|
+
dropdownList: string;
|
|
812
882
|
modalTopbarIcon: string;
|
|
883
|
+
withdrawalInput: string;
|
|
884
|
+
useConnected: string;
|
|
813
885
|
};
|
|
814
886
|
borderWidths: {
|
|
815
887
|
activeOptionBorderWidth: string;
|
|
@@ -872,6 +944,10 @@ export declare const useActiveTheme: () => {
|
|
|
872
944
|
youPayYouReceivePaddingLeft: string;
|
|
873
945
|
youPayYouReceivePaddingRight: string;
|
|
874
946
|
youPayYouReceivePaddingY: string;
|
|
947
|
+
inputPaddingX: string;
|
|
948
|
+
inputPaddingY: string;
|
|
949
|
+
dropdownActiveItemRegularSizePaddingY: string;
|
|
950
|
+
assetListDefaultGap: string;
|
|
875
951
|
};
|
|
876
952
|
textTransforms: {
|
|
877
953
|
inputAmountQuickOptionButton: string;
|
|
@@ -925,7 +1001,9 @@ export declare const useActiveTheme: () => {
|
|
|
925
1001
|
secondaryText: string;
|
|
926
1002
|
tertiaryText: string;
|
|
927
1003
|
textSelection: string;
|
|
1004
|
+
inputLabel: string;
|
|
928
1005
|
inputBackground: string;
|
|
1006
|
+
inputBackgroundHover: string;
|
|
929
1007
|
inputBorderBase: string;
|
|
930
1008
|
inputBorderHover: string;
|
|
931
1009
|
activeTabBorderColor: string;
|
|
@@ -1000,9 +1078,29 @@ export declare const useActiveTheme: () => {
|
|
|
1000
1078
|
fiatAccountGradientTo: string;
|
|
1001
1079
|
optionBoxBackground: string;
|
|
1002
1080
|
optionBoxBackgroundUninteractive: string;
|
|
1081
|
+
optionBoxBorderBase: string;
|
|
1082
|
+
optionBoxBorderHover: string;
|
|
1083
|
+
optionBoxDefaultModeNotActiveBorderBase: string;
|
|
1084
|
+
optionBoxDefaultModeNotActiveBorderHover: string;
|
|
1085
|
+
openDropdownBackgroundColor: string;
|
|
1003
1086
|
dropdownActiveItemBackgroundBase: string;
|
|
1004
1087
|
dropdownActiveItemBackgroundHover: string;
|
|
1005
1088
|
dropdownActiveItemBackgroundDisabled: string;
|
|
1089
|
+
dropdownActiveItemBorderBase: string;
|
|
1090
|
+
dropdownActiveItemBorderHover: string;
|
|
1091
|
+
selectedDropdownItemBackground: string;
|
|
1092
|
+
alwaysVisibleLabelBackgroundHover: string;
|
|
1093
|
+
selectedDropdownItemText: string;
|
|
1094
|
+
dropdownLabelColor: string;
|
|
1095
|
+
copyButtonBackgroundBase: string;
|
|
1096
|
+
copyButtonBackgroundHover: string;
|
|
1097
|
+
copyButtonBackgroundActive: string;
|
|
1098
|
+
copyButtonBorderBase: string;
|
|
1099
|
+
copyButtonBorderHover: string;
|
|
1100
|
+
funFeatureListBackgroundBase: string;
|
|
1101
|
+
funFeatureListBackgroundHover: string;
|
|
1102
|
+
funFeatureListBorderColor: string;
|
|
1103
|
+
funFeatureListBorderColorHover: string;
|
|
1006
1104
|
spinnerBackground: string;
|
|
1007
1105
|
spinnerIndicator: string;
|
|
1008
1106
|
spinnerBackgroundVerifyAccount: string;
|
|
@@ -1030,6 +1128,7 @@ export declare const useActiveTheme: () => {
|
|
|
1030
1128
|
paymentAmountSkeletonCircleSize: string;
|
|
1031
1129
|
paymentMethodItemIconSize: string;
|
|
1032
1130
|
selectAssetItemIconSize: string;
|
|
1131
|
+
sourceListGap: string;
|
|
1033
1132
|
txBreakdownSkeletonWidth: string;
|
|
1034
1133
|
txSummaryLineSkeletonHeight: string;
|
|
1035
1134
|
txSummaryLineSkeletonWidth: string;
|
|
@@ -1225,6 +1324,14 @@ export declare const useActiveTheme: () => {
|
|
|
1225
1324
|
fontSize: string;
|
|
1226
1325
|
lineHeight: string;
|
|
1227
1326
|
};
|
|
1327
|
+
quickOptionFontSize: {
|
|
1328
|
+
fontSize: string;
|
|
1329
|
+
lineHeight: string;
|
|
1330
|
+
};
|
|
1331
|
+
useConnectedFontSize: {
|
|
1332
|
+
fontSize: string;
|
|
1333
|
+
lineHeight: string;
|
|
1334
|
+
};
|
|
1228
1335
|
};
|
|
1229
1336
|
radii: {
|
|
1230
1337
|
actionButton: string;
|
|
@@ -1243,7 +1350,10 @@ export declare const useActiveTheme: () => {
|
|
|
1243
1350
|
tooltip: string;
|
|
1244
1351
|
dropdown: string;
|
|
1245
1352
|
dropdownItem: string;
|
|
1353
|
+
dropdownList: string;
|
|
1246
1354
|
modalTopbarIcon: string;
|
|
1355
|
+
withdrawalInput: string;
|
|
1356
|
+
useConnected: string;
|
|
1247
1357
|
};
|
|
1248
1358
|
borderWidths: {
|
|
1249
1359
|
activeOptionBorderWidth: string;
|
|
@@ -1306,6 +1416,10 @@ export declare const useActiveTheme: () => {
|
|
|
1306
1416
|
youPayYouReceivePaddingLeft: string;
|
|
1307
1417
|
youPayYouReceivePaddingRight: string;
|
|
1308
1418
|
youPayYouReceivePaddingY: string;
|
|
1419
|
+
inputPaddingX: string;
|
|
1420
|
+
inputPaddingY: string;
|
|
1421
|
+
dropdownActiveItemRegularSizePaddingY: string;
|
|
1422
|
+
assetListDefaultGap: string;
|
|
1309
1423
|
};
|
|
1310
1424
|
textTransforms: {
|
|
1311
1425
|
inputAmountQuickOptionButton: string;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { type FormOfPaymentType } from '@funkit/api-base';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import { type SwappedTheme } from '../utils/swapped';
|
|
3
4
|
export interface SwappedIframeCallbacks {
|
|
@@ -9,15 +10,14 @@ export interface SwappedIframeCallbacks {
|
|
|
9
10
|
onNavigation: (step: string) => void;
|
|
10
11
|
}
|
|
11
12
|
interface SwappedContextValue {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
activateIframe: (
|
|
13
|
+
iframeUrl: string | null;
|
|
14
|
+
isSwappedReady: boolean;
|
|
15
|
+
isActive: boolean;
|
|
16
|
+
setIframeUrl: (url: string | null) => void;
|
|
17
|
+
activateIframe: (fopType: FormOfPaymentType) => void;
|
|
17
18
|
deactivateIframe: () => void;
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
setIframeRef: (url: string, el: HTMLIFrameElement | null) => void;
|
|
19
|
+
resetIframe: () => void;
|
|
20
|
+
setIframeRef: (el: HTMLIFrameElement | null) => void;
|
|
21
21
|
setActiveCallbacks: (cb: SwappedIframeCallbacks | null) => void;
|
|
22
22
|
swappedTheme: SwappedTheme;
|
|
23
23
|
}
|
package/dist/themes/baseTheme.js
CHANGED
package/dist/themes/darkTheme.js
CHANGED
package/dist/utils/checkout.d.ts
CHANGED
|
@@ -121,10 +121,10 @@ export declare function isVaultDepositCheckout(checkoutConfig: FunkitCheckoutCon
|
|
|
121
121
|
chainId: string;
|
|
122
122
|
tokenAddress: string;
|
|
123
123
|
}): boolean;
|
|
124
|
-
/** some additional
|
|
124
|
+
/** some additional finalized token will be performed after swap. We need to calculate the final destination token amount */
|
|
125
125
|
export declare function computeDisplayDestinationToken(checkoutConfig: FunkitCheckoutConfig | ServerCheckoutConfig | undefined, displayAssetAmount: number): {
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
126
|
+
finalizedTokenAmount: number;
|
|
127
|
+
finalizedTokenSymbol: string;
|
|
128
|
+
finalizedTokenIcon: string;
|
|
129
129
|
};
|
|
130
130
|
export {};
|
package/dist/utils/swapped.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { type SavedFormOfPayment, type SwappedFormOfPayment } from '@funkit/api-base';
|
|
2
2
|
import type { ThemeVars } from '../css/sprinkles.css';
|
|
3
|
+
import type { ThemeColorScheme } from '../providers/FunkitThemeProvider';
|
|
3
4
|
/**
|
|
4
5
|
* Ref: https://www.notion.so/Fun-Parameter-Styling-Guide-312966ea6e398011bbc6c14e976e281d#63dcdd77ea2d488084a980cda4c63d08
|
|
5
6
|
*/
|
|
@@ -25,10 +26,12 @@ export interface SwappedTheme {
|
|
|
25
26
|
contentPadding?: string;
|
|
26
27
|
boxPaddingY?: string;
|
|
27
28
|
boxPaddingX?: string;
|
|
29
|
+
paymentMethodLightLogos?: boolean;
|
|
28
30
|
}
|
|
29
31
|
export declare const isSavedFormOfPaymentType: (fop: SwappedFormOfPayment) => fop is SavedFormOfPayment;
|
|
30
32
|
export declare const getSavedFormOfPaymentDisplayName: (fop: SavedFormOfPayment) => string;
|
|
31
|
-
export declare const getSavedFormOfPaymentIcon: (fop: SavedFormOfPayment) => string;
|
|
33
|
+
export declare const getSavedFormOfPaymentIcon: (fop: SavedFormOfPayment) => string | undefined;
|
|
34
|
+
export declare const getSwappedIcon: (fop: SwappedFormOfPayment, isDarkMode: boolean) => string;
|
|
32
35
|
export declare function getSwappedOrigin(url: string): string | null;
|
|
33
36
|
export declare function isSwappedOrigin(origin: string): boolean;
|
|
34
37
|
export declare function resolveCssValue(value: string): string;
|
|
@@ -38,5 +41,5 @@ export declare function buildSwappedTheme(theme: ThemeVars & {
|
|
|
38
41
|
primary?: string;
|
|
39
42
|
secondary?: string;
|
|
40
43
|
};
|
|
41
|
-
}): SwappedTheme;
|
|
44
|
+
}, themeColorScheme: ThemeColorScheme): SwappedTheme;
|
|
42
45
|
export declare function buildSwappedThemeQueryParams(activeTheme: ThemeVars): Record<string, string>;
|
|
@@ -5,6 +5,9 @@ import {
|
|
|
5
5
|
import {
|
|
6
6
|
zerionWallet
|
|
7
7
|
} from "./chunk-TTHM3WUR.js";
|
|
8
|
+
import {
|
|
9
|
+
tahoWallet
|
|
10
|
+
} from "./chunk-4BMUFNMT.js";
|
|
8
11
|
import {
|
|
9
12
|
talismanWallet
|
|
10
13
|
} from "./chunk-6MFOL6EB.js";
|
|
@@ -20,21 +23,24 @@ import {
|
|
|
20
23
|
import {
|
|
21
24
|
uniswapWallet
|
|
22
25
|
} from "./chunk-NHLG5PVD.js";
|
|
23
|
-
import {
|
|
24
|
-
ramperWallet
|
|
25
|
-
} from "./chunk-R4S234FL.js";
|
|
26
26
|
import {
|
|
27
27
|
walletConnectWallet
|
|
28
28
|
} from "./chunk-J34FG3W4.js";
|
|
29
29
|
import {
|
|
30
30
|
xdefiWallet
|
|
31
31
|
} from "./chunk-O7RSASRH.js";
|
|
32
|
+
import {
|
|
33
|
+
rabbyWallet
|
|
34
|
+
} from "./chunk-WFNPWKU3.js";
|
|
32
35
|
import {
|
|
33
36
|
rainbowWallet
|
|
34
37
|
} from "./chunk-GSHSWVEG.js";
|
|
35
38
|
import {
|
|
36
|
-
|
|
37
|
-
} from "./chunk-
|
|
39
|
+
ramperWallet
|
|
40
|
+
} from "./chunk-R4S234FL.js";
|
|
41
|
+
import {
|
|
42
|
+
roninWallet
|
|
43
|
+
} from "./chunk-PKMAPNN6.js";
|
|
38
44
|
import {
|
|
39
45
|
safeWallet
|
|
40
46
|
} from "./chunk-YKVWTGU7.js";
|
|
@@ -47,12 +53,6 @@ import {
|
|
|
47
53
|
import {
|
|
48
54
|
subWallet
|
|
49
55
|
} from "./chunk-XBLHZICW.js";
|
|
50
|
-
import {
|
|
51
|
-
tahoWallet
|
|
52
|
-
} from "./chunk-4BMUFNMT.js";
|
|
53
|
-
import {
|
|
54
|
-
roninWallet
|
|
55
|
-
} from "./chunk-PKMAPNN6.js";
|
|
56
56
|
import {
|
|
57
57
|
metaMaskWallet
|
|
58
58
|
} from "./chunk-HETS3KKI.js";
|
|
@@ -75,41 +75,47 @@ import {
|
|
|
75
75
|
oneKeyWallet
|
|
76
76
|
} from "./chunk-HE5J5T7X.js";
|
|
77
77
|
import {
|
|
78
|
-
|
|
79
|
-
} from "./chunk-
|
|
78
|
+
phantomWallet
|
|
79
|
+
} from "./chunk-XMNVOYSJ.js";
|
|
80
80
|
import {
|
|
81
|
-
|
|
82
|
-
} from "./chunk-
|
|
81
|
+
foxWallet
|
|
82
|
+
} from "./chunk-53VYSPXK.js";
|
|
83
|
+
import {
|
|
84
|
+
frameWallet
|
|
85
|
+
} from "./chunk-WDTNOIMF.js";
|
|
83
86
|
import {
|
|
84
87
|
frontierWallet
|
|
85
88
|
} from "./chunk-CJJT7LMT.js";
|
|
86
|
-
import {
|
|
87
|
-
imTokenWallet
|
|
88
|
-
} from "./chunk-IUVO4IN3.js";
|
|
89
89
|
import {
|
|
90
90
|
gateWallet
|
|
91
91
|
} from "./chunk-7OARWILZ.js";
|
|
92
92
|
import {
|
|
93
|
-
|
|
94
|
-
} from "./chunk-
|
|
95
|
-
import {
|
|
96
|
-
injectedWallet
|
|
97
|
-
} from "./chunk-W6MXINYY.js";
|
|
93
|
+
imTokenWallet
|
|
94
|
+
} from "./chunk-IUVO4IN3.js";
|
|
98
95
|
import {
|
|
99
96
|
kresusWallet
|
|
100
97
|
} from "./chunk-G4V5B6YC.js";
|
|
98
|
+
import {
|
|
99
|
+
injectedWallet
|
|
100
|
+
} from "./chunk-W6MXINYY.js";
|
|
101
101
|
import {
|
|
102
102
|
ledgerWallet
|
|
103
103
|
} from "./chunk-WKCCLGHJ.js";
|
|
104
|
+
import {
|
|
105
|
+
clvWallet
|
|
106
|
+
} from "./chunk-GVOQTORD.js";
|
|
107
|
+
import {
|
|
108
|
+
argentWallet
|
|
109
|
+
} from "./chunk-VUOAIUZE.js";
|
|
104
110
|
import {
|
|
105
111
|
coin98Wallet
|
|
106
112
|
} from "./chunk-6YO27XOM.js";
|
|
107
113
|
import {
|
|
108
|
-
|
|
109
|
-
} from "./chunk-
|
|
114
|
+
coinbaseWallet
|
|
115
|
+
} from "./chunk-RZXMOPIV.js";
|
|
110
116
|
import {
|
|
111
|
-
|
|
112
|
-
} from "./chunk-
|
|
117
|
+
coreWallet
|
|
118
|
+
} from "./chunk-GH4M6FTK.js";
|
|
113
119
|
import {
|
|
114
120
|
dawnWallet
|
|
115
121
|
} from "./chunk-TFVCCI2D.js";
|
|
@@ -119,21 +125,9 @@ import {
|
|
|
119
125
|
import {
|
|
120
126
|
enkryptWallet
|
|
121
127
|
} from "./chunk-W6TXXLCO.js";
|
|
122
|
-
import {
|
|
123
|
-
foxWallet
|
|
124
|
-
} from "./chunk-53VYSPXK.js";
|
|
125
|
-
import {
|
|
126
|
-
coreWallet
|
|
127
|
-
} from "./chunk-GH4M6FTK.js";
|
|
128
128
|
import {
|
|
129
129
|
bifrostWallet
|
|
130
130
|
} from "./chunk-EKJHJFRN.js";
|
|
131
|
-
import {
|
|
132
|
-
argentWallet
|
|
133
|
-
} from "./chunk-VUOAIUZE.js";
|
|
134
|
-
import {
|
|
135
|
-
bitgetWallet
|
|
136
|
-
} from "./chunk-HOPH3TQ3.js";
|
|
137
131
|
import {
|
|
138
132
|
bitskiWallet
|
|
139
133
|
} from "./chunk-A7FNGC4A.js";
|
|
@@ -143,10 +137,16 @@ import {
|
|
|
143
137
|
import {
|
|
144
138
|
bloomWallet
|
|
145
139
|
} from "./chunk-UB2SSFH7.js";
|
|
146
|
-
import
|
|
140
|
+
import {
|
|
141
|
+
bitgetWallet
|
|
142
|
+
} from "./chunk-HOPH3TQ3.js";
|
|
147
143
|
import {
|
|
148
144
|
braveWallet
|
|
149
145
|
} from "./chunk-ZRNBHLUU.js";
|
|
146
|
+
import {
|
|
147
|
+
bybitWallet
|
|
148
|
+
} from "./chunk-6UCI7GM6.js";
|
|
149
|
+
import "./chunk-MAPXJUOO.js";
|
|
150
150
|
import "./chunk-BAVE62IL.js";
|
|
151
151
|
import "./chunk-KV4HGYM3.js";
|
|
152
152
|
export {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@funkit/connect",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.3.0",
|
|
4
4
|
"description": "Funkit Connect SDK elevates DeFi apps via web2 sign-ins and one-click checkouts.",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist",
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
"ua-parser-js": "^1.0.37",
|
|
103
103
|
"use-debounce": "^10.0.5",
|
|
104
104
|
"uuid": "^9.0.1",
|
|
105
|
-
"@funkit/api-base": "
|
|
105
|
+
"@funkit/api-base": "3.0.1",
|
|
106
106
|
"@funkit/chains": "1.1.0",
|
|
107
107
|
"@funkit/fun-relay": "2.6.3",
|
|
108
108
|
"@funkit/utils": "1.2.4"
|