@funkit/connect 5.5.21 → 6.0.2

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 (74) hide show
  1. package/CHANGELOG.md +49 -0
  2. package/dist/{chunk-ES634CAR.js → chunk-IOMUPAAW.js} +1 -1
  3. package/dist/{chunk-OV3P5HQK.js → chunk-IVQ57535.js} +5 -3
  4. package/dist/{chunk-K4APSFTL.js → chunk-N6UWLAUQ.js} +1 -1
  5. package/dist/components/Box/Box.d.ts +17 -17
  6. package/dist/components/Dialog/Dialog.css.d.ts +2 -1
  7. package/dist/components/Dialog/hooks.d.ts +11 -0
  8. package/dist/components/FunBottomBar/FunBottomBar.css.d.ts +0 -1
  9. package/dist/components/FunButton/FunButton.d.ts +2 -1
  10. package/dist/components/FunCheckoutHistory/FunCheckoutStatus.css.d.ts +0 -2
  11. package/dist/components/FunCheckoutHistory/FunCheckoutStatus.d.ts +1 -12
  12. package/dist/components/FunCheckoutHistory/FunDirectExecutionStatus.d.ts +1 -1
  13. package/dist/components/FunCountdown/FunCountdown.d.ts +1 -4
  14. package/dist/components/FunInfoBanner/InfoBanner.d.ts +2 -2
  15. package/dist/components/FunPayments/FunPaymentMethods.d.ts +2 -11
  16. package/dist/components/Icons/SpinnerIcon.d.ts +4 -2
  17. package/dist/components/Icons/StatusIcons.css.d.ts +16 -0
  18. package/dist/components/Icons/StatusIcons.d.ts +8 -8
  19. package/dist/components/ReceiveAmount/ReceiveAmount.d.ts +5 -3
  20. package/dist/components/TransactionStatus/TransactionStatus.d.ts +10 -0
  21. package/dist/consts/customers.d.ts +1 -1
  22. package/dist/css/sprinkles.css.d.ts +23 -19
  23. package/dist/domains/fees.d.ts +2 -3
  24. package/dist/domains/meld.d.ts +4 -3
  25. package/dist/domains/paymentMethods.d.ts +1 -8
  26. package/dist/domains/quote.d.ts +2 -3
  27. package/dist/hooks/useCheckoutDirectExecution.d.ts +1 -0
  28. package/dist/hooks/usePaymentSources.d.ts +0 -1
  29. package/dist/index.css +2792 -2767
  30. package/dist/index.js +4228 -5886
  31. package/dist/modals/CheckoutModal/InputAmount/InputAmount.d.ts +0 -1
  32. package/dist/modals/CheckoutModal/InputAmount/InputAmountLoading.d.ts +1 -1
  33. package/dist/modals/CheckoutModal/LoadingAccount.d.ts +0 -1
  34. package/dist/modals/CheckoutModal/SelectAsset.d.ts +0 -1
  35. package/dist/modals/CheckoutModal/SourceChange/SourceChange.d.ts +2 -7
  36. package/dist/modals/CheckoutModal/TransferToken/TransferToken.d.ts +0 -1
  37. package/dist/modals/CheckoutModal/VirtualFiatAccount/FiatAccountDetail.d.ts +0 -1
  38. package/dist/modals/CheckoutModal/stepTransition.d.ts +0 -12
  39. package/dist/modals/CheckoutModal/useSourceAssetConfirm.d.ts +1 -3
  40. package/dist/providers/FunkitCheckoutContext.d.ts +6 -0
  41. package/dist/providers/FunkitConfigContext.d.ts +2 -0
  42. package/dist/providers/FunkitMeshProvider.d.ts +1 -19
  43. package/dist/providers/FunkitThemeProvider.d.ts +9 -3
  44. package/dist/themes/baseTheme.js +1 -1
  45. package/dist/themes/darkTheme.js +2 -2
  46. package/dist/themes/lightTheme.js +2 -2
  47. package/dist/utils/checkout.d.ts +9 -1
  48. package/dist/utils/flags/impl.d.ts +1 -0
  49. package/dist/utils/flags/types.d.ts +3 -2
  50. package/dist/wallets/walletConnectors/bifrostWallet/bifrostWallet.js +2 -2
  51. package/dist/wallets/walletConnectors/bitgetWallet/bitgetWallet.js +2 -2
  52. package/dist/wallets/walletConnectors/bybitWallet/bybitWallet.js +2 -2
  53. package/dist/wallets/walletConnectors/clvWallet/clvWallet.js +2 -2
  54. package/dist/wallets/walletConnectors/coin98Wallet/coin98Wallet.js +2 -2
  55. package/dist/wallets/walletConnectors/coreWallet/coreWallet.js +2 -2
  56. package/dist/wallets/walletConnectors/foxWallet/foxWallet.js +2 -2
  57. package/dist/wallets/walletConnectors/frontierWallet/frontierWallet.js +2 -2
  58. package/dist/wallets/walletConnectors/gateWallet/gateWallet.js +2 -2
  59. package/dist/wallets/walletConnectors/index.js +53 -53
  60. package/dist/wallets/walletConnectors/metaMaskWallet/metaMaskWallet.js +2 -2
  61. package/dist/wallets/walletConnectors/okxWallet/okxWallet.js +2 -2
  62. package/dist/wallets/walletConnectors/rainbowWallet/rainbowWallet.js +2 -2
  63. package/dist/wallets/walletConnectors/roninWallet/roninWallet.js +2 -2
  64. package/dist/wallets/walletConnectors/safepalWallet/safepalWallet.js +2 -2
  65. package/dist/wallets/walletConnectors/subWallet/subWallet.js +2 -2
  66. package/dist/wallets/walletConnectors/tokenPocketWallet/tokenPocketWallet.js +2 -2
  67. package/dist/wallets/walletConnectors/trustWallet/trustWallet.js +2 -2
  68. package/dist/wallets/walletConnectors/zerionWallet/zerionWallet.js +2 -2
  69. package/package.json +6 -6
  70. package/dist/components/Icons/EtherFiIcon.d.ts +0 -4
  71. package/dist/hooks/useMesh.d.ts +0 -19
  72. package/dist/modals/CheckoutModal/ConnectExchange.d.ts +0 -12
  73. package/dist/modals/CheckoutModal/MeshVerification.d.ts +0 -17
  74. package/dist/modals/CheckoutModal/SelectBrokerage.d.ts +0 -14
package/CHANGELOG.md CHANGED
@@ -1,5 +1,54 @@
1
1
  # @funkit/connect
2
2
 
3
+ ## 6.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - 3de98c8: add ipLocation feature flag
8
+ - 9069cc7: hyperbeat dark theme border set
9
+ - e45077e: fix(connect): bug fix on tooltip
10
+ - a31784b: show loading when user switches
11
+ - 11d8dec: feat(connect): fix Safari popup issue by opening window immediately and setting URL async
12
+ - a979dd1: feat(connect): adjust Katana High Cost banner
13
+ - 2dd4ee5: feat(connect): adjust auto-picking of meld provider quotes based on amount relation
14
+ - f4e5d31: remove new user logic
15
+ - a7e8276: Remove obsolete EtherFi API key and integration components
16
+
17
+ This removes all EtherFi-related code including API keys, theme components, customer functions, and UI customizations. The EtherFi integration was marked as obsolete and has been completely removed from the codebase.
18
+
19
+ **Breaking Changes:**
20
+
21
+ - Removed `ETHERFI_API_KEY` constant from `@funkit/api-base`
22
+ - Removed `isEtherFiCustomer` function from `@funkit/connect`
23
+ - Removed `EtherFiIcon` component from `@funkit/connect`
24
+ - Removed EtherFi theme and configuration options
25
+ - Cleaned up EtherFi-specific UI logic from checkout modals
26
+
27
+ - 2bcc68e: preferDestinationWhenSame: when source and destination are the same address, show destination as payment method instead of source
28
+ - a27a6e8: feat(connect): adjust modal bottom padding for Hyperbeat
29
+ - ceb2b3a: fix(connect): inaccurate total time estimate
30
+ - Updated dependencies [f5db915]
31
+ - Updated dependencies [a7e8276]
32
+ - @funkit/chains@0.3.7
33
+ - @funkit/api-base@1.9.11
34
+ - @funkit/core@2.3.35
35
+ - @funkit/wagmi-tools@3.0.57
36
+
37
+ ## 6.0.0
38
+
39
+ ### Major Changes
40
+
41
+ - 3ee48c6: fix items align
42
+
43
+ ### Patch Changes
44
+
45
+ - 254b00e: feat(connect,with-next): QA for Hyperbeat
46
+ - 329cbdc: feat(connect): show received amount from quote
47
+ - 0624afd: feat(connect): use 2-step checkout progress with animations
48
+ - dbd1bd8: quick options added for hyperbeat and hyperswap
49
+ - adfd155: feat(connect, apps): katana theme updates
50
+ - 84f2e27: fix(connect): update snapshots
51
+
3
52
  ## 5.5.21
4
53
 
5
54
  ### Patch Changes
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  baseTheme
4
- } from "./chunk-OV3P5HQK.js";
4
+ } from "./chunk-IVQ57535.js";
5
5
 
6
6
  // src/themes/darkTheme.ts
7
7
  var accentColors = {
@@ -145,8 +145,8 @@ var baseTheme = ({
145
145
  modalOverlay: blurs[overlayBlur].modalOverlay
146
146
  },
147
147
  dimensions: {
148
- modalBottomBarButtonHeight: "unset",
149
- modalTopBarHeight: "unset",
148
+ modalBottomBarButtonHeight: "34px",
149
+ modalTopBarHeight: "56px",
150
150
  ...customDimensions
151
151
  },
152
152
  fonts: {
@@ -155,6 +155,7 @@ var baseTheme = ({
155
155
  fontWeight: {
156
156
  ...DEFAULT_FONT_WEIGHTS,
157
157
  modalTopbarTitle: DEFAULT_FONT_WEIGHTS.medium,
158
+ modalBottomBarButtonText: DEFAULT_FONT_WEIGHTS.medium,
158
159
  ...customFontWeights
159
160
  },
160
161
  fontSize: {
@@ -186,7 +187,8 @@ var baseTheme = ({
186
187
  spacing: {
187
188
  modalBaseHorizontalPadding: "6px",
188
189
  modalBottomHorizontalPadding: "12px",
189
- modalPaddingBottom: "16px",
190
+ modalPaddingBottomUpper: "18px",
191
+ modalPaddingBottomLower: "16px",
190
192
  modalTopBarVerticalTextSpacing: "0px",
191
193
  ...customSpacings
192
194
  }
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  baseTheme
4
- } from "./chunk-OV3P5HQK.js";
4
+ } from "./chunk-IVQ57535.js";
5
5
 
6
6
  // src/themes/lightTheme.ts
7
7
  var accentColors = {
@@ -53,37 +53,37 @@ export declare const Box: React.ForwardRefExoticComponent<{
53
53
  readonly cursor?: "default" | "help" | "not-allowed" | "pointer" | undefined;
54
54
  readonly flexDirection?: "column" | "row" | undefined;
55
55
  readonly fontFamily?: "body" | undefined;
56
- readonly fontSize?: "modalTopbarTitle" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "21" | "40" | "57" | "modalTopbarSubtitle" | "modalBottomBarButtonText" | undefined;
57
- readonly fontWeight?: "medium" | "bold" | "regular" | "semibold" | "heavy" | "modalTopbarTitle" | undefined;
58
- readonly gap?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
56
+ readonly fontSize?: "modalTopbarTitle" | "modalBottomBarButtonText" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "21" | "40" | "57" | "modalTopbarSubtitle" | undefined;
57
+ readonly fontWeight?: "medium" | "bold" | "regular" | "semibold" | "heavy" | "modalTopbarTitle" | "modalBottomBarButtonText" | undefined;
58
+ readonly gap?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
59
59
  readonly height?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
60
60
  readonly justifyContent?: "center" | "space-around" | "space-between" | "flex-end" | "flex-start" | undefined;
61
61
  readonly textAlign?: "inherit" | "left" | "right" | "center" | undefined;
62
- readonly marginBottom?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
63
- readonly marginLeft?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
64
- readonly marginRight?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
65
- readonly marginTop?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
62
+ readonly marginBottom?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
63
+ readonly marginLeft?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
64
+ readonly marginRight?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
65
+ readonly marginTop?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
66
66
  readonly minHeight?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
67
67
  readonly maxHeight?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
68
68
  readonly maxWidth?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
69
69
  readonly minWidth?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
70
70
  readonly overflow?: "hidden" | undefined;
71
- readonly paddingBottom?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
72
- readonly paddingLeft?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
73
- readonly paddingRight?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
74
- readonly paddingTop?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
71
+ readonly paddingBottom?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
72
+ readonly paddingLeft?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
73
+ readonly paddingRight?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
74
+ readonly paddingTop?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
75
75
  readonly position?: "fixed" | "absolute" | "relative" | undefined;
76
76
  readonly right?: "0" | undefined;
77
77
  readonly transition?: "transform" | "default" | undefined;
78
78
  readonly userSelect?: "none" | undefined;
79
79
  readonly width?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
80
80
  readonly backdropFilter?: "modalOverlay" | undefined;
81
- margin?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
82
- marginX?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
83
- marginY?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
84
- padding?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
85
- paddingX?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
86
- paddingY?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
81
+ margin?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
82
+ marginX?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
83
+ marginY?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
84
+ padding?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
85
+ paddingX?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
86
+ paddingY?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
87
87
  } & {
88
88
  reset?: keyof JSX.IntrinsicElements;
89
89
  } & HTMLProperties<HTMLElement> & {
@@ -3,7 +3,6 @@ export declare const DialogAnimationTimeIn = 0.25;
3
3
  export declare const DialogAnimationTimeOut = 0.12;
4
4
  export declare const overlay: string;
5
5
  export declare const content: string;
6
- export declare const dydxTitle: string;
7
6
  export declare const titleContainer: string;
8
7
  /** Content that shouls overflow into topbar */
9
8
  export declare const topbarOverflowContent: string;
@@ -11,3 +10,5 @@ export declare const topbarOverflowContent: string;
11
10
  export declare const topbarFadeWrapper: string;
12
11
  /** Absolute-positioned background behind topbar (lets us modulate background opacity without making text/button transparent) */
13
12
  export declare const topbarFadeBackground: string;
13
+ export declare const itemsAlignCenter: string;
14
+ export declare const itemsAlignEnd: string;
@@ -1,9 +1,20 @@
1
+ export declare const MODAL_BOTTOM_BAR_WRAPPER_ID = "fun-modal-bottom-bar-wrapper";
1
2
  export declare const MODAL_BOTTOM_BAR_IDS: {
2
3
  readonly checkout: "checkout-modal-bottom-bar";
3
4
  readonly withdrawal: "withdrawal-modal-bottom-bar";
4
5
  };
6
+ export declare const MODAL_DIVIDER_ID = "fun-modal-divider";
5
7
  type ModalBottomBarIdType = keyof typeof MODAL_BOTTOM_BAR_IDS;
6
8
  export declare function useBottomSectionRef(modalBottomBarIdType?: ModalBottomBarIdType): HTMLElement | null;
7
9
  export declare const CHECKOUT_MODAL_TITLE_COUNTDOWN_ID = "checkout-modal-title-countdown";
8
10
  export declare function useTitleCountdownRef(): HTMLElement | null;
11
+ export declare function useGeneralBottomBarElement(): HTMLElement | null;
12
+ export declare function useCheckoutBottomBarElement(): HTMLElement | null;
13
+ export declare function useWithdrawalBottomBarElement(): HTMLElement | null;
14
+ /**
15
+ * Hook to observe if a ref's children are empty, with special handling for bottom bar nodes.
16
+ * @param ref - React ref to the DOM node to observe
17
+ * @param setHasNoChildren - Setter to update if the node has no children
18
+ */
19
+ export declare function useBottomBarHasNoChildren(): boolean;
9
20
  export {};
@@ -1,2 +1 @@
1
- export declare const BOTTOM_BAR_PADDING_Y: 18;
2
1
  export declare const topSectionDynamicPadding: string;
@@ -14,5 +14,6 @@ export interface FunButtonProps {
14
14
  borderRadius?: BoxProps['borderRadius'];
15
15
  textSize?: BoxProps['fontSize'];
16
16
  uppercase?: boolean;
17
+ textWeight?: BoxProps['fontWeight'];
17
18
  }
18
- export declare function FunButton({ id, title, customTitleComponent, onClick, isDisabled, type, isLoading, loaderSize, textSize, borderRadius, height, uppercase, }: FunButtonProps): React.JSX.Element;
19
+ export declare function FunButton({ id, title, customTitleComponent, onClick, isDisabled, type, isLoading, loaderSize, textSize, textWeight, borderRadius, height, uppercase, }: FunButtonProps): React.JSX.Element;
@@ -1,3 +1 @@
1
1
  export declare const GradientLoadingBox: string;
2
- export declare const GradientWrapperClass: string;
3
- export declare const GradientPositionClass: string;
@@ -4,16 +4,5 @@ interface FunCheckoutStatusProps {
4
4
  checkoutHistoryItem: CheckoutHistoryItem | undefined;
5
5
  onOrderDelayed?: () => void;
6
6
  }
7
- export declare function FunCheckoutStatus({ checkoutHistoryItem, onOrderDelayed, }: FunCheckoutStatusProps): React.JSX.Element | null;
8
- export declare function StatusInner({ showCompleted, showDelayed, showFailed, pendingComponent, }: {
9
- showCompleted: boolean;
10
- showDelayed: boolean;
11
- showFailed: boolean;
12
- pendingComponent: React.ReactNode;
13
- }): React.JSX.Element;
14
- export declare function PendingStatus({ totalSeconds, estimatedRemainingSeconds, onOrderDelayed, }: {
15
- totalSeconds: number;
16
- estimatedRemainingSeconds: number;
17
- onOrderDelayed?: () => void;
18
- }): React.JSX.Element;
7
+ export declare function FunCheckoutStatus({ checkoutHistoryItem, onOrderDelayed, }: FunCheckoutStatusProps): React.JSX.Element;
19
8
  export {};
@@ -3,5 +3,5 @@ import React from 'react';
3
3
  interface FunDirectExecutionStatusProps {
4
4
  directExecution: DirectExecution | undefined;
5
5
  }
6
- export declare function FunDirectExecutionStatus({ directExecution, }: FunDirectExecutionStatusProps): React.JSX.Element | null;
6
+ export declare function FunDirectExecutionStatus({ directExecution, }: FunDirectExecutionStatusProps): React.JSX.Element;
7
7
  export {};
@@ -1,4 +1,3 @@
1
- import { type AnimationProps } from 'motion/react';
2
1
  import React, { type ReactNode } from 'react';
3
2
  export interface FunCountdownProps {
4
3
  countdownSeconds: number;
@@ -14,7 +13,5 @@ export interface FunCountdownProps {
14
13
  isPaused?: boolean;
15
14
  /** Optional component to be used instead of the countdown after it ends */
16
15
  delayedComponent?: ReactNode;
17
- /** Animation props to controll how the coundown is replaced with the delayedComponent */
18
- motionProps?: AnimationProps;
19
16
  }
20
- export declare const FunCountdown: ({ countdownSeconds, initialRemainingSeconds, counterSize, onCountdownEnded, onBeforeCountdownEnds, onBeforeCountdownEndsSeconds, onCountdownLastSecond, strokeWidth, isHidden, isPaused, children, delayedComponent, motionProps, }: FunCountdownProps) => React.JSX.Element | null;
17
+ export declare const FunCountdown: ({ countdownSeconds, initialRemainingSeconds, counterSize, onCountdownEnded, onBeforeCountdownEnds, onBeforeCountdownEndsSeconds, onCountdownLastSecond, strokeWidth, isHidden, isPaused, children, delayedComponent, }: FunCountdownProps) => React.JSX.Element | null;
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  export type InfoBannerProps = {
3
- /** Contents of the banner, supports HTML markup for more structured announcements (eg. link to a blogpost) */
4
- message: string;
3
+ /** Contents of the banner, supports HTML markup for more structured announcements (eg. link to a blogpost) or a `ReactNode` for more complex content with React components */
4
+ message: string | React.ReactNode;
5
5
  type: 'warning' | 'alert' | 'announcement';
6
6
  expireAtMs?: number;
7
7
  };
@@ -1,19 +1,10 @@
1
1
  import React, { type ReactNode } from 'react';
2
- import { PaymentMethod, type PaymentMethodBrokerageInfo, type PaymentMethodVirtualBankInfo } from '../../domains/paymentMethods';
2
+ import { PaymentMethod, type PaymentMethodVirtualBankInfo } from '../../domains/paymentMethods';
3
3
  export declare const getDynamicValueIconComponent: () => React.JSX.Element;
4
4
  export declare function PaymentMethodIcon({ paymentIcon, keyIconSize, }: {
5
5
  paymentIcon: ReactNode;
6
6
  keyIconSize: number;
7
7
  }): React.JSX.Element;
8
- interface ConnectedMeshPaymentMethodItemProps extends ConnectedPaymentMethodItemProps {
9
- paymentMethodInfo: PaymentMethodBrokerageInfo;
10
- onBrokerageError?: () => void;
11
- }
12
- /** it is different from BrokeragePaymentMethodItem
13
- * this component is for connected mesh brokerage like robinhood
14
- * the other one is for connecting new brokerage button
15
- * */
16
- export declare const ConnectedMeshPaymentMethodItem: ({ paymentMethodInfo, isSelected, onSelect, onBrokerageError, targetChainId, showSelectedCheckmark, }: ConnectedMeshPaymentMethodItemProps) => React.JSX.Element;
17
8
  interface ConnectedPaymentMethodItemProps {
18
9
  isSelected: boolean;
19
10
  showSelectedCheckmark?: boolean;
@@ -33,5 +24,5 @@ type BasePaymentMethodItemProps = {
33
24
  export declare function AddPaymentMethodItem({ paymentMethod, isClickable, isActive, onClick, customValueIcon, }: BasePaymentMethodItemProps & {
34
25
  paymentMethod: PaymentMethod;
35
26
  dynamicLimit?: string;
36
- }): React.JSX.Element | undefined;
27
+ }): React.JSX.Element | null | undefined;
37
28
  export {};
@@ -1,4 +1,6 @@
1
1
  import React from 'react';
2
- export declare const SpinnerIcon: ({ size }: {
2
+ interface SpinnerIconProps {
3
3
  size?: string | number;
4
- }) => React.JSX.Element;
4
+ }
5
+ export declare const SpinnerIcon: ({ size }: SpinnerIconProps) => React.JSX.Element;
6
+ export {};
@@ -0,0 +1,16 @@
1
+ export type StatusIconVariant = keyof typeof variants;
2
+ declare const variants: {
3
+ secondary: {
4
+ color: "secondaryText";
5
+ };
6
+ success: {
7
+ color: "success";
8
+ };
9
+ };
10
+ export declare const slots: {
11
+ container: string;
12
+ icon: Record<"success" | "secondary", string>;
13
+ background: Record<"success" | "secondary", string>;
14
+ innerShadow: string;
15
+ };
16
+ export {};
@@ -1,10 +1,10 @@
1
1
  import React from 'react';
2
- interface IconProps {
3
- size?: number;
4
- }
5
2
  export declare const CompletedGradientSvg: () => React.JSX.Element;
6
- export declare const CompletedStatusIcon: ({ size }: IconProps) => React.JSX.Element;
7
- export declare const FailedGradientSvg: () => React.JSX.Element;
8
- export declare const FailedStatusIcon: ({ size }: IconProps) => React.JSX.Element;
9
- export declare const DelayedStatusIcon: ({ size }: IconProps) => React.JSX.Element;
10
- export {};
3
+ export declare function CompletedStatusIcon(props: StatusIconProps): React.JSX.Element;
4
+ export declare function FailedStatusIcon(props: StatusIconProps): React.JSX.Element;
5
+ export declare function DelayedStatusIcon(props: StatusIconProps): React.JSX.Element;
6
+ export type StatusIconProps = {
7
+ animateEntrance?: boolean;
8
+ backgroundSize?: number;
9
+ iconSize: number;
10
+ };
@@ -1,10 +1,12 @@
1
- import React from 'react';
1
+ import type { ApiFunkitCheckoutQuoteResult } from '@funkit/utils';
2
+ import React, { type ReactNode } from 'react';
2
3
  import type { ServerCheckoutConfig } from '~/domains/clientMetadata';
3
4
  import type { FunkitCheckoutConfig } from '~/providers/FunkitCheckoutContext';
4
5
  interface ReceiveAmountProps {
5
6
  config: ServerCheckoutConfig | FunkitCheckoutConfig;
6
7
  /** To override the default icon if custom one is needed */
7
- icon?: React.ReactNode;
8
+ icon?: ReactNode;
9
+ quote: ApiFunkitCheckoutQuoteResult | null;
8
10
  }
9
- export declare const ReceiveAmount: ({ config, icon }: ReceiveAmountProps) => React.JSX.Element;
11
+ export declare const ReceiveAmount: ({ config, icon, quote }: ReceiveAmountProps) => React.JSX.Element;
10
12
  export {};
@@ -0,0 +1,10 @@
1
+ import React from 'react';
2
+ import type { CheckoutProgressStep } from '~/providers/FunkitCheckoutContext';
3
+ interface TransactionStatusProps {
4
+ onOrderDelayed?: () => void;
5
+ startTimeMs: number;
6
+ status: 'delayed' | 'failed' | 'progress' | 'success';
7
+ step: CheckoutProgressStep;
8
+ }
9
+ export declare function TransactionStatus({ status, step }: TransactionStatusProps): React.JSX.Element;
10
+ export {};
@@ -5,4 +5,4 @@ export declare function isBankrCustomer(apiKey: string): apiKey is "vWe20Dfyui2o
5
5
  export declare function isBsxCustomer(apiKey: string): apiKey is "zN1zrkmLQn4oZtLUW9Qt02uuBI3Jvrgj8Ni40Gf1";
6
6
  export declare function isEtherealCustomer(apiKey: string): apiKey is "M3uox3cw0u8YCPV9cIREA6AugUMvPFTk6qOpm4um";
7
7
  export declare function isKatanaCustomer(apiKey: string): apiKey is "OXLUmejkh9PlNDS4gSvi9gcEWacOpTz2KUVepVf4";
8
- export declare function isEtherFiCustomer(apiKey: string): apiKey is "GyJMyQ3juDarKooebGRu16Ncogwhm59h2DIjCu1p";
8
+ export declare function isHyperbeatCustomer(apiKey: string): apiKey is "lUzTaIRxs95iin3pCAafB1ChA5akBiuQ1tjhXnau";
@@ -115,6 +115,7 @@ declare const themeContractValues: {
115
115
  bold: string;
116
116
  heavy: string;
117
117
  modalTopbarTitle: string;
118
+ modalBottomBarButtonText: string;
118
119
  };
119
120
  fontSize: {
120
121
  '10': {
@@ -201,7 +202,8 @@ declare const themeContractValues: {
201
202
  spacing: {
202
203
  modalBaseHorizontalPadding: string;
203
204
  modalBottomHorizontalPadding: string;
204
- modalPaddingBottom: string;
205
+ modalPaddingBottomUpper: string;
206
+ modalPaddingBottomLower: string;
205
207
  modalTopBarVerticalTextSpacing: string;
206
208
  };
207
209
  blurs: {
@@ -326,6 +328,7 @@ export declare const themeVars: {
326
328
  bold: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
327
329
  heavy: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
328
330
  modalTopbarTitle: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
331
+ modalBottomBarButtonText: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
329
332
  };
330
333
  fontSize: {
331
334
  '10': {
@@ -412,7 +415,8 @@ export declare const themeVars: {
412
415
  spacing: {
413
416
  modalBaseHorizontalPadding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
414
417
  modalBottomHorizontalPadding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
415
- modalPaddingBottom: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
418
+ modalPaddingBottomUpper: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
419
+ modalPaddingBottomLower: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
416
420
  modalTopBarVerticalTextSpacing: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
417
421
  };
418
422
  blurs: {
@@ -668,37 +672,37 @@ export declare const sprinkles: ((props: {
668
672
  readonly cursor?: "default" | "help" | "not-allowed" | "pointer" | undefined;
669
673
  readonly flexDirection?: "column" | "row" | undefined;
670
674
  readonly fontFamily?: "body" | undefined;
671
- readonly fontSize?: "modalTopbarTitle" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "21" | "40" | "57" | "modalTopbarSubtitle" | "modalBottomBarButtonText" | undefined;
672
- readonly fontWeight?: "medium" | "bold" | "regular" | "semibold" | "heavy" | "modalTopbarTitle" | undefined;
673
- readonly gap?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
675
+ readonly fontSize?: "modalTopbarTitle" | "modalBottomBarButtonText" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "21" | "40" | "57" | "modalTopbarSubtitle" | undefined;
676
+ readonly fontWeight?: "medium" | "bold" | "regular" | "semibold" | "heavy" | "modalTopbarTitle" | "modalBottomBarButtonText" | undefined;
677
+ readonly gap?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
674
678
  readonly height?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
675
679
  readonly justifyContent?: "center" | "space-around" | "space-between" | "flex-end" | "flex-start" | undefined;
676
680
  readonly textAlign?: "inherit" | "left" | "right" | "center" | undefined;
677
- readonly marginBottom?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
678
- readonly marginLeft?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
679
- readonly marginRight?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
680
- readonly marginTop?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
681
+ readonly marginBottom?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
682
+ readonly marginLeft?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
683
+ readonly marginRight?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
684
+ readonly marginTop?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
681
685
  readonly minHeight?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
682
686
  readonly maxHeight?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
683
687
  readonly maxWidth?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
684
688
  readonly minWidth?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
685
689
  readonly overflow?: "hidden" | undefined;
686
- readonly paddingBottom?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
687
- readonly paddingLeft?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
688
- readonly paddingRight?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
689
- readonly paddingTop?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
690
+ readonly paddingBottom?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
691
+ readonly paddingLeft?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
692
+ readonly paddingRight?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
693
+ readonly paddingTop?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
690
694
  readonly position?: "fixed" | "absolute" | "relative" | undefined;
691
695
  readonly right?: "0" | undefined;
692
696
  readonly transition?: "transform" | "default" | undefined;
693
697
  readonly userSelect?: "none" | undefined;
694
698
  readonly width?: "1" | "modalBottomBarButtonHeight" | "modalTopBarHeight" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "57" | "2" | "4" | "8" | "11" | "24" | "30" | "full" | "15" | "28" | "32" | "34" | "36" | "44" | "48" | "50" | "54" | "60" | "72" | "93" | "96" | "100" | "108" | "120" | "160" | "180" | "200" | "240" | "half" | "max" | undefined;
695
699
  readonly backdropFilter?: "modalOverlay" | undefined;
696
- margin?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
697
- marginX?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
698
- marginY?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
699
- padding?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
700
- paddingX?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
701
- paddingY?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottom" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
700
+ margin?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
701
+ marginX?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
702
+ marginY?: "auto" | "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | "-18" | "-12" | undefined;
703
+ padding?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
704
+ paddingX?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
705
+ paddingY?: "0" | "1" | "10" | "12" | "13" | "14" | "16" | "18" | "20" | "40" | "modalBaseHorizontalPadding" | "modalBottomHorizontalPadding" | "modalPaddingBottomUpper" | "modalPaddingBottomLower" | "modalTopBarVerticalTextSpacing" | "2" | "3" | "4" | "6" | "8" | "11" | "24" | "30" | "15" | "28" | "32" | "36" | "44" | "-1" | "5" | "7" | "9" | "64" | undefined;
702
706
  }) => string) & {
703
707
  properties: Set<"alignItems" | "alignSelf" | "backdropFilter" | "backgroundSize" | "boxShadow" | "color" | "cursor" | "display" | "flexDirection" | "fontFamily" | "fontSize" | "fontWeight" | "height" | "justifyContent" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "userSelect" | "width" | "background" | "borderColor" | "borderRadius" | "borderStyle" | "borderWidth" | "gap" | "margin" | "overflow" | "padding" | "transition" | "marginX" | "marginY" | "paddingX" | "paddingY">;
704
708
  };
@@ -1,4 +1,4 @@
1
- import { type CheckoutQuoteResponse } from '@funkit/utils';
1
+ import type { CheckoutQuoteResponse } from '@funkit/utils';
2
2
  import type { Config } from 'wagmi';
3
3
  import { LoginType } from '~/providers/GeneralWalletProvider';
4
4
  import type { FunkitActiveCheckoutItem } from '../providers/FunkitCheckoutContext';
@@ -48,8 +48,7 @@ interface EvaluateFeeBreakdownItem {
48
48
  loginType: LoginType;
49
49
  isWithdrawal?: boolean;
50
50
  }
51
- export declare function evaluateFeeBreakdown(evalItem: EvaluateFeeBreakdownItem, enableFrogProxyServer?: boolean): Promise<{
51
+ export declare function evaluateFeeBreakdown(evalItem: EvaluateFeeBreakdownItem): Promise<{
52
52
  fees: CheckoutFees;
53
- brokerage?: BrokerageDetails;
54
53
  }>;
55
54
  export {};
@@ -1,10 +1,11 @@
1
1
  import { type MeldQuote } from '@funkit/api-base';
2
2
  /**
3
3
  * Auto-pick the best quote for the user.
4
- * 1. Pick the quote with the highest customerScore, at least >= 30
4
+ * 1. If a quote has a customerScore >= 30, pick it
5
5
  * 2. If no quote has customerScore >= 30, pick either Coinbase or Binance
6
- * 2a. If both are available, pick the one with the highest destinationAmount
7
- * 2b. If only one is available, pick it
6
+ * 2a. If both are available and they are at least 96% of the highest destinationAmount, pick the one with the best customerScore
7
+ * 2aa. If they're have the same customerScore, pick the one with the highest destinationAmount
8
+ * 2b. If both are available and they are less than 96% of the highest destinationAmount, pick the one with the highest destinationAmount
8
9
  * 3. If no quote has customerScore >= 30 and no Coinbase or Binance is available, pick the quote with the highest destinationAmount
9
10
  * @param quotes - the quotes to pick from
10
11
  * @returns the best quote based on the criteria