@funkit/connect 5.0.4 → 5.0.6

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 (62) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/{chunk-DRTHDG4D.js → chunk-7QFRFB6R.js} +9 -0
  3. package/dist/{chunk-ZHSAPALJ.js → chunk-J2TPZOG7.js} +9 -0
  4. package/dist/components/Box/Box.d.ts +21 -21
  5. package/dist/components/CopyAddress/CopyIconButton.d.ts +1 -0
  6. package/dist/components/Dropdown/BaseActiveDropdownItem.d.ts +3 -1
  7. package/dist/components/Dropdown/BaseDropdown.d.ts +4 -2
  8. package/dist/components/Dropdown/ChainDropdown.d.ts +15 -5
  9. package/dist/components/FunAssetAvatar/FunAssetAvatar.css.d.ts +0 -2
  10. package/dist/components/FunAssetAvatar/FunAssetAvatar.d.ts +1 -2
  11. package/dist/components/FunButton/FunIconButton.d.ts +19 -2
  12. package/dist/components/FunCheckoutBlocked/FunCheckoutBlocked.d.ts +1 -1
  13. package/dist/components/FunOptionBox/FunOptionBox.css.d.ts +1 -1
  14. package/dist/components/FunPaymentMethodItem/FunPaymentMethodItem.d.ts +6 -4
  15. package/dist/components/FunPayments/FunPaymentMethods.d.ts +1 -0
  16. package/dist/components/FunSkeletonLoader/FunSkeletonBlock.d.ts +2 -2
  17. package/dist/components/QRCode/QRCodeSkeletonLoader.d.ts +7 -0
  18. package/dist/components/SourcePaymentMethodItem/SourcePaymentMethodItem.d.ts +7 -0
  19. package/dist/consts/animations.d.ts +1 -0
  20. package/dist/css/sprinkles.css.d.ts +37 -21
  21. package/dist/domains/asset.d.ts +1 -1
  22. package/dist/domains/{checkoutState.d.ts → checkout.d.ts} +3 -0
  23. package/dist/domains/{checkoutFees.d.ts → fees.d.ts} +1 -1
  24. package/dist/domains/paymentMethods.d.ts +1 -1
  25. package/dist/domains/quote.d.ts +1 -1
  26. package/dist/hooks/useCheckoutAccountBalanceTransfer.d.ts +1 -1
  27. package/dist/hooks/useIsBlacklisted.d.ts +6 -0
  28. package/dist/index.css +1495 -999
  29. package/dist/index.js +1050 -896
  30. package/dist/modals/CheckoutModal/CheckoutNotification.d.ts +1 -1
  31. package/dist/modals/CheckoutModal/ConfirmationStep/ConfirmationStep.d.ts +1 -1
  32. package/dist/modals/CheckoutModal/ConfirmationStep/useCheckoutConfirmation.d.ts +6 -0
  33. package/dist/modals/CheckoutModal/stepTransition.d.ts +4 -0
  34. package/dist/providers/FunkitConfigContext.d.ts +1 -0
  35. package/dist/providers/FunkitMoonpayProvider.d.ts +0 -2
  36. package/dist/providers/FunkitThemeProvider.d.ts +24 -0
  37. package/dist/providers/GeneralWalletProvider.d.ts +9 -10
  38. package/dist/themes/darkTheme.js +1 -1
  39. package/dist/themes/lightTheme.js +1 -1
  40. package/dist/utils/checkout.d.ts +1 -1
  41. package/dist/wallets/walletConnectors/bifrostWallet/bifrostWallet.js +2 -2
  42. package/dist/wallets/walletConnectors/bitgetWallet/bitgetWallet.js +2 -2
  43. package/dist/wallets/walletConnectors/bybitWallet/bybitWallet.js +2 -2
  44. package/dist/wallets/walletConnectors/clvWallet/clvWallet.js +2 -2
  45. package/dist/wallets/walletConnectors/coin98Wallet/coin98Wallet.js +2 -2
  46. package/dist/wallets/walletConnectors/coreWallet/coreWallet.js +2 -2
  47. package/dist/wallets/walletConnectors/foxWallet/foxWallet.js +2 -2
  48. package/dist/wallets/walletConnectors/frontierWallet/frontierWallet.js +2 -2
  49. package/dist/wallets/walletConnectors/gateWallet/gateWallet.js +2 -2
  50. package/dist/wallets/walletConnectors/index.js +68 -68
  51. package/dist/wallets/walletConnectors/metaMaskWallet/metaMaskWallet.js +2 -2
  52. package/dist/wallets/walletConnectors/okxWallet/okxWallet.js +2 -2
  53. package/dist/wallets/walletConnectors/rainbowWallet/rainbowWallet.js +2 -2
  54. package/dist/wallets/walletConnectors/roninWallet/roninWallet.js +2 -2
  55. package/dist/wallets/walletConnectors/safepalWallet/safepalWallet.js +2 -2
  56. package/dist/wallets/walletConnectors/subWallet/subWallet.js +2 -2
  57. package/dist/wallets/walletConnectors/tokenPocketWallet/tokenPocketWallet.js +2 -2
  58. package/dist/wallets/walletConnectors/trustWallet/trustWallet.js +2 -2
  59. package/dist/wallets/walletConnectors/zerionWallet/zerionWallet.js +2 -2
  60. package/package.json +4 -4
  61. package/dist/hooks/useIsCheckoutRisky.d.ts +0 -4
  62. /package/dist/components/{FunPaymentMethodItem/FunPaymentMethodItem.css.d.ts → SourcePaymentMethodItem/SourcePaymentMethodItem.css.d.ts} +0 -0
package/dist/index.js CHANGED
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  darkTheme
4
- } from "./chunk-ZHSAPALJ.js";
4
+ } from "./chunk-J2TPZOG7.js";
5
5
  import {
6
6
  lightTheme
7
- } from "./chunk-DRTHDG4D.js";
7
+ } from "./chunk-7QFRFB6R.js";
8
8
  import {
9
9
  systemFontStack
10
10
  } from "./chunk-2T4ZDGAO.js";
@@ -14,9 +14,9 @@ var BASE_DIALOG_PADDING = "6";
14
14
  var SCROLL_BAR_WIDTH = 6;
15
15
  var contentCollapsed = "_1pzt423c";
16
16
  var contentExpanded = "_1pzt423b";
17
- var dialog = "_1pzt4231 _1rsrm2fj3 _1rsrm2fu9 _1rsrm2fu _1rsrm2fz _1rsrm2f13 _1rsrm2f11x _1rsrm2fa _1rsrm2f1d _1rsrm2fbg _1rsrm2fej _1rsrm2fby _1rsrm2fd5 _1rsrm2fce";
18
- var dialogCompact = "_1pzt4232 _1pzt4231 _1rsrm2fj3 _1rsrm2fu9 _1rsrm2fu _1rsrm2fz _1rsrm2f13 _1rsrm2f11x _1rsrm2fa _1rsrm2f1d _1rsrm2fbg _1rsrm2fej _1rsrm2fby _1rsrm2fd5 _1rsrm2fce";
19
- var dialogMedium = "_1pzt4233 _1pzt4231 _1rsrm2fj3 _1rsrm2fu9 _1rsrm2fu _1rsrm2fz _1rsrm2f13 _1rsrm2f11x _1rsrm2fa _1rsrm2f1d _1rsrm2fbg _1rsrm2fej _1rsrm2fby _1rsrm2fd5 _1rsrm2fce";
17
+ var dialog = "_1pzt4231 _1rsrm2fj3 _1rsrm2fvl _1rsrm2fu _1rsrm2fz _1rsrm2f13 _1rsrm2f14l _1rsrm2fa _1rsrm2f1d _1rsrm2fbg _1rsrm2fej _1rsrm2fby _1rsrm2fd5 _1rsrm2fce";
18
+ var dialogCompact = "_1pzt4232 _1pzt4231 _1rsrm2fj3 _1rsrm2fvl _1rsrm2fu _1rsrm2fz _1rsrm2f13 _1rsrm2f14l _1rsrm2fa _1rsrm2f1d _1rsrm2fbg _1rsrm2fej _1rsrm2fby _1rsrm2fd5 _1rsrm2fce";
19
+ var dialogMedium = "_1pzt4233 _1pzt4231 _1rsrm2fj3 _1rsrm2fvl _1rsrm2fu _1rsrm2fz _1rsrm2f13 _1rsrm2f14l _1rsrm2fa _1rsrm2f1d _1rsrm2fbg _1rsrm2fej _1rsrm2fby _1rsrm2fd5 _1rsrm2fce";
20
20
  var dialogMobile = "_1pzt4235 _1rsrm2fv _1rsrm2f13";
21
21
  var dividerTransition = "_1pzt423a";
22
22
  var fullHeightContent = "_1pzt4239";
@@ -43,8 +43,8 @@ import { createNormalizeValueFn as _a49f6 } from "@vanilla-extract/sprinkles/cre
43
43
  import { createSprinkles as _ad221 } from "@vanilla-extract/sprinkles/createRuntimeSprinkles";
44
44
  var mapResponsiveValue = _51c72({ conditions: { defaultCondition: "smallScreen", conditionNames: ["smallScreen", "largeScreen"], responsiveArray: void 0 } });
45
45
  var normalizeResponsiveValue = _a49f6({ conditions: { defaultCondition: "smallScreen", conditionNames: ["smallScreen", "largeScreen"], responsiveArray: void 0 } });
46
- var sprinkles = _ad221({ conditions: { defaultCondition: "base", conditionNames: ["base", "hover", "active", "selection", "focused", "focusedVisible"], responsiveArray: void 0 }, styles: { background: { values: { accentColor: { conditions: { base: "_1rsrm2ffr", hover: "_1rsrm2ffs", active: "_1rsrm2fft", selection: "_1rsrm2ffu", focused: "_1rsrm2ffv", focusedVisible: "_1rsrm2ffw" }, defaultClass: "_1rsrm2ffr" }, accentColorForeground: { conditions: { base: "_1rsrm2ffx", hover: "_1rsrm2ffy", active: "_1rsrm2ffz", selection: "_1rsrm2fg0", focused: "_1rsrm2fg1", focusedVisible: "_1rsrm2fg2" }, defaultClass: "_1rsrm2ffx" }, actionButtonBorder: { conditions: { base: "_1rsrm2fg3", hover: "_1rsrm2fg4", active: "_1rsrm2fg5", selection: "_1rsrm2fg6", focused: "_1rsrm2fg7", focusedVisible: "_1rsrm2fg8" }, defaultClass: "_1rsrm2fg3" }, connectButtonBackground: { conditions: { base: "_1rsrm2fg9", hover: "_1rsrm2fga", active: "_1rsrm2fgb", selection: "_1rsrm2fgc", focused: "_1rsrm2fgd", focusedVisible: "_1rsrm2fge" }, defaultClass: "_1rsrm2fg9" }, connectButtonBackgroundError: { conditions: { base: "_1rsrm2fgf", hover: "_1rsrm2fgg", active: "_1rsrm2fgh", selection: "_1rsrm2fgi", focused: "_1rsrm2fgj", focusedVisible: "_1rsrm2fgk" }, defaultClass: "_1rsrm2fgf" }, connectButtonText: { conditions: { base: "_1rsrm2fgl", hover: "_1rsrm2fgm", active: "_1rsrm2fgn", selection: "_1rsrm2fgo", focused: "_1rsrm2fgp", focusedVisible: "_1rsrm2fgq" }, defaultClass: "_1rsrm2fgl" }, connectButtonTextError: { conditions: { base: "_1rsrm2fgr", hover: "_1rsrm2fgs", active: "_1rsrm2fgt", selection: "_1rsrm2fgu", focused: "_1rsrm2fgv", focusedVisible: "_1rsrm2fgw" }, defaultClass: "_1rsrm2fgr" }, connectionIndicator: { conditions: { base: "_1rsrm2fgx", hover: "_1rsrm2fgy", active: "_1rsrm2fgz", selection: "_1rsrm2fh0", focused: "_1rsrm2fh1", focusedVisible: "_1rsrm2fh2" }, defaultClass: "_1rsrm2fgx" }, error: { conditions: { base: "_1rsrm2fh3", hover: "_1rsrm2fh4", active: "_1rsrm2fh5", selection: "_1rsrm2fh6", focused: "_1rsrm2fh7", focusedVisible: "_1rsrm2fh8" }, defaultClass: "_1rsrm2fh3" }, errorBackground: { conditions: { base: "_1rsrm2fh9", hover: "_1rsrm2fha", active: "_1rsrm2fhb", selection: "_1rsrm2fhc", focused: "_1rsrm2fhd", focusedVisible: "_1rsrm2fhe" }, defaultClass: "_1rsrm2fh9" }, errorBorder: { conditions: { base: "_1rsrm2fhf", hover: "_1rsrm2fhg", active: "_1rsrm2fhh", selection: "_1rsrm2fhi", focused: "_1rsrm2fhj", focusedVisible: "_1rsrm2fhk" }, defaultClass: "_1rsrm2fhf" }, generalBorder: { conditions: { base: "_1rsrm2fhl", hover: "_1rsrm2fhm", active: "_1rsrm2fhn", selection: "_1rsrm2fho", focused: "_1rsrm2fhp", focusedVisible: "_1rsrm2fhq" }, defaultClass: "_1rsrm2fhl" }, generalBorderDim: { conditions: { base: "_1rsrm2fhr", hover: "_1rsrm2fhs", active: "_1rsrm2fht", selection: "_1rsrm2fhu", focused: "_1rsrm2fhv", focusedVisible: "_1rsrm2fhw" }, defaultClass: "_1rsrm2fhr" }, menuItemBackground: { conditions: { base: "_1rsrm2fhx", hover: "_1rsrm2fhy", active: "_1rsrm2fhz", selection: "_1rsrm2fi0", focused: "_1rsrm2fi1", focusedVisible: "_1rsrm2fi2" }, defaultClass: "_1rsrm2fhx" }, selectedOptionBorder: { conditions: { base: "_1rsrm2fi3", hover: "_1rsrm2fi4", active: "_1rsrm2fi5", selection: "_1rsrm2fi6", focused: "_1rsrm2fi7", focusedVisible: "_1rsrm2fi8" }, defaultClass: "_1rsrm2fi3" }, focusedOptionBorder: { conditions: { base: "_1rsrm2fi9", hover: "_1rsrm2fia", active: "_1rsrm2fib", selection: "_1rsrm2fic", focused: "_1rsrm2fid", focusedVisible: "_1rsrm2fie" }, defaultClass: "_1rsrm2fi9" }, standby: { conditions: { base: "_1rsrm2fif", hover: "_1rsrm2fig", active: "_1rsrm2fih", selection: "_1rsrm2fii", focused: "_1rsrm2fij", focusedVisible: "_1rsrm2fik" }, defaultClass: "_1rsrm2fif" }, success: { conditions: { base: "_1rsrm2fil", hover: "_1rsrm2fim", active: "_1rsrm2fin", selection: "_1rsrm2fio", focused: "_1rsrm2fip", focusedVisible: "_1rsrm2fiq" }, defaultClass: "_1rsrm2fil" }, chainIconBorder: { conditions: { base: "_1rsrm2fir", hover: "_1rsrm2fis", active: "_1rsrm2fit", selection: "_1rsrm2fiu", focused: "_1rsrm2fiv", focusedVisible: "_1rsrm2fiw" }, defaultClass: "_1rsrm2fir" }, modalBackdrop: { conditions: { base: "_1rsrm2fix", hover: "_1rsrm2fiy", active: "_1rsrm2fiz", selection: "_1rsrm2fj0", focused: "_1rsrm2fj1", focusedVisible: "_1rsrm2fj2" }, defaultClass: "_1rsrm2fix" }, modalBackground: { conditions: { base: "_1rsrm2fj3", hover: "_1rsrm2fj4", active: "_1rsrm2fj5", selection: "_1rsrm2fj6", focused: "_1rsrm2fj7", focusedVisible: "_1rsrm2fj8" }, defaultClass: "_1rsrm2fj3" }, modalBorder: { conditions: { base: "_1rsrm2fj9", hover: "_1rsrm2fja", active: "_1rsrm2fjb", selection: "_1rsrm2fjc", focused: "_1rsrm2fjd", focusedVisible: "_1rsrm2fje" }, defaultClass: "_1rsrm2fj9" }, offBackground: { conditions: { base: "_1rsrm2fjf", hover: "_1rsrm2fjg", active: "_1rsrm2fjh", selection: "_1rsrm2fji", focused: "_1rsrm2fjj", focusedVisible: "_1rsrm2fjk" }, defaultClass: "_1rsrm2fjf" }, offBackgroundComplimentary: { conditions: { base: "_1rsrm2fjl", hover: "_1rsrm2fjm", active: "_1rsrm2fjn", selection: "_1rsrm2fjo", focused: "_1rsrm2fjp", focusedVisible: "_1rsrm2fjq" }, defaultClass: "_1rsrm2fjl" }, hoverState: { conditions: { base: "_1rsrm2fjr", hover: "_1rsrm2fjs", active: "_1rsrm2fjt", selection: "_1rsrm2fju", focused: "_1rsrm2fjv", focusedVisible: "_1rsrm2fjw" }, defaultClass: "_1rsrm2fjr" }, lightStroke: { conditions: { base: "_1rsrm2fjx", hover: "_1rsrm2fjy", active: "_1rsrm2fjz", selection: "_1rsrm2fk0", focused: "_1rsrm2fk1", focusedVisible: "_1rsrm2fk2" }, defaultClass: "_1rsrm2fjx" }, mediumStroke: { conditions: { base: "_1rsrm2fk3", hover: "_1rsrm2fk4", active: "_1rsrm2fk5", selection: "_1rsrm2fk6", focused: "_1rsrm2fk7", focusedVisible: "_1rsrm2fk8" }, defaultClass: "_1rsrm2fk3" }, heavyStroke: { conditions: { base: "_1rsrm2fk9", hover: "_1rsrm2fka", active: "_1rsrm2fkb", selection: "_1rsrm2fkc", focused: "_1rsrm2fkd", focusedVisible: "_1rsrm2fke" }, defaultClass: "_1rsrm2fk9" }, strokeColor: { conditions: { base: "_1rsrm2fkf", hover: "_1rsrm2fkg", active: "_1rsrm2fkh", selection: "_1rsrm2fki", focused: "_1rsrm2fkj", focusedVisible: "_1rsrm2fkk" }, defaultClass: "_1rsrm2fkf" }, dydxSwitchActiveBackground: { conditions: { base: "_1rsrm2fkl", hover: "_1rsrm2fkm", active: "_1rsrm2fkn", selection: "_1rsrm2fko", focused: "_1rsrm2fkp", focusedVisible: "_1rsrm2fkq" }, defaultClass: "_1rsrm2fkl" }, primaryText: { conditions: { base: "_1rsrm2fkr", hover: "_1rsrm2fks", active: "_1rsrm2fkt", selection: "_1rsrm2fku", focused: "_1rsrm2fkv", focusedVisible: "_1rsrm2fkw" }, defaultClass: "_1rsrm2fkr" }, secondaryText: { conditions: { base: "_1rsrm2fkx", hover: "_1rsrm2fky", active: "_1rsrm2fkz", selection: "_1rsrm2fl0", focused: "_1rsrm2fl1", focusedVisible: "_1rsrm2fl2" }, defaultClass: "_1rsrm2fkx" }, tertiaryText: { conditions: { base: "_1rsrm2fl3", hover: "_1rsrm2fl4", active: "_1rsrm2fl5", selection: "_1rsrm2fl6", focused: "_1rsrm2fl7", focusedVisible: "_1rsrm2fl8" }, defaultClass: "_1rsrm2fl3" }, textSelection: { conditions: { base: "_1rsrm2fl9", hover: "_1rsrm2fla", active: "_1rsrm2flb", selection: "_1rsrm2flc", focused: "_1rsrm2fld", focusedVisible: "_1rsrm2fle" }, defaultClass: "_1rsrm2fl9" }, inputBackground: { conditions: { base: "_1rsrm2flf", hover: "_1rsrm2flg", active: "_1rsrm2flh", selection: "_1rsrm2fli", focused: "_1rsrm2flj", focusedVisible: "_1rsrm2flk" }, defaultClass: "_1rsrm2flf" }, inputBorderBase: { conditions: { base: "_1rsrm2fll", hover: "_1rsrm2flm", active: "_1rsrm2fln", selection: "_1rsrm2flo", focused: "_1rsrm2flp", focusedVisible: "_1rsrm2flq" }, defaultClass: "_1rsrm2fll" }, inputBorderHover: { conditions: { base: "_1rsrm2flr", hover: "_1rsrm2fls", active: "_1rsrm2flt", selection: "_1rsrm2flu", focused: "_1rsrm2flv", focusedVisible: "_1rsrm2flw" }, defaultClass: "_1rsrm2flr" }, actionColor: { conditions: { base: "_1rsrm2flx", hover: "_1rsrm2fly", active: "_1rsrm2flz", selection: "_1rsrm2fm0", focused: "_1rsrm2fm1", focusedVisible: "_1rsrm2fm2" }, defaultClass: "_1rsrm2flx" }, actionColorHover: { conditions: { base: "_1rsrm2fm3", hover: "_1rsrm2fm4", active: "_1rsrm2fm5", selection: "_1rsrm2fm6", focused: "_1rsrm2fm7", focusedVisible: "_1rsrm2fm8" }, defaultClass: "_1rsrm2fm3" }, actionColorDisabled: { conditions: { base: "_1rsrm2fm9", hover: "_1rsrm2fma", active: "_1rsrm2fmb", selection: "_1rsrm2fmc", focused: "_1rsrm2fmd", focusedVisible: "_1rsrm2fme" }, defaultClass: "_1rsrm2fm9" }, buttonPrimary: { conditions: { base: "_1rsrm2fmf", hover: "_1rsrm2fmg", active: "_1rsrm2fmh", selection: "_1rsrm2fmi", focused: "_1rsrm2fmj", focusedVisible: "_1rsrm2fmk" }, defaultClass: "_1rsrm2fmf" }, buttonDisabled: { conditions: { base: "_1rsrm2fml", hover: "_1rsrm2fmm", active: "_1rsrm2fmn", selection: "_1rsrm2fmo", focused: "_1rsrm2fmp", focusedVisible: "_1rsrm2fmq" }, defaultClass: "_1rsrm2fml" }, buttonWarning: { conditions: { base: "_1rsrm2fmr", hover: "_1rsrm2fms", active: "_1rsrm2fmt", selection: "_1rsrm2fmu", focused: "_1rsrm2fmv", focusedVisible: "_1rsrm2fmw" }, defaultClass: "_1rsrm2fmr" }, buttonSuccess: { conditions: { base: "_1rsrm2fmx", hover: "_1rsrm2fmy", active: "_1rsrm2fmz", selection: "_1rsrm2fn0", focused: "_1rsrm2fn1", focusedVisible: "_1rsrm2fn2" }, defaultClass: "_1rsrm2fmx" }, buttonTextPrimary: { conditions: { base: "_1rsrm2fn3", hover: "_1rsrm2fn4", active: "_1rsrm2fn5", selection: "_1rsrm2fn6", focused: "_1rsrm2fn7", focusedVisible: "_1rsrm2fn8" }, defaultClass: "_1rsrm2fn3" }, buttonTextDisabled: { conditions: { base: "_1rsrm2fn9", hover: "_1rsrm2fna", active: "_1rsrm2fnb", selection: "_1rsrm2fnc", focused: "_1rsrm2fnd", focusedVisible: "_1rsrm2fne" }, defaultClass: "_1rsrm2fn9" }, transparent: { conditions: { base: "_1rsrm2fnf", hover: "_1rsrm2fng", active: "_1rsrm2fnh", selection: "_1rsrm2fni", focused: "_1rsrm2fnj", focusedVisible: "_1rsrm2fnk" }, defaultClass: "_1rsrm2fnf" }, buttonBackgroundTertiary: { conditions: { base: "_1rsrm2fnl", hover: "_1rsrm2fnm", active: "_1rsrm2fnn", selection: "_1rsrm2fno", focused: "_1rsrm2fnp", focusedVisible: "_1rsrm2fnq" }, defaultClass: "_1rsrm2fnl" }, buttonBackgroundHoverTertiary: { conditions: { base: "_1rsrm2fnr", hover: "_1rsrm2fns", active: "_1rsrm2fnt", selection: "_1rsrm2fnu", focused: "_1rsrm2fnv", focusedVisible: "_1rsrm2fnw" }, defaultClass: "_1rsrm2fnr" }, buttonTextTertiary: { conditions: { base: "_1rsrm2fnx", hover: "_1rsrm2fny", active: "_1rsrm2fnz", selection: "_1rsrm2fo0", focused: "_1rsrm2fo1", focusedVisible: "_1rsrm2fo2" }, defaultClass: "_1rsrm2fnx" }, buttonTextDisabledTertiary: { conditions: { base: "_1rsrm2fo3", hover: "_1rsrm2fo4", active: "_1rsrm2fo5", selection: "_1rsrm2fo6", focused: "_1rsrm2fo7", focusedVisible: "_1rsrm2fo8" }, defaultClass: "_1rsrm2fo3" }, buttonStrokeTertiary: { conditions: { base: "_1rsrm2fo9", hover: "_1rsrm2foa", active: "_1rsrm2fob", selection: "_1rsrm2foc", focused: "_1rsrm2fod", focusedVisible: "_1rsrm2foe" }, defaultClass: "_1rsrm2fo9" }, buttonBackground: { conditions: { base: "_1rsrm2fof", hover: "_1rsrm2fog", active: "_1rsrm2foh", selection: "_1rsrm2foi", focused: "_1rsrm2foj", focusedVisible: "_1rsrm2fok" }, defaultClass: "_1rsrm2fof" }, buttonBackgroundHover: { conditions: { base: "_1rsrm2fol", hover: "_1rsrm2fom", active: "_1rsrm2fon", selection: "_1rsrm2foo", focused: "_1rsrm2fop", focusedVisible: "_1rsrm2foq" }, defaultClass: "_1rsrm2fol" }, buttonBackgroundDisabled: { conditions: { base: "_1rsrm2for", hover: "_1rsrm2fos", active: "_1rsrm2fot", selection: "_1rsrm2fou", focused: "_1rsrm2fov", focusedVisible: "_1rsrm2fow" }, defaultClass: "_1rsrm2for" }, buttonStroke: { conditions: { base: "_1rsrm2fox", hover: "_1rsrm2foy", active: "_1rsrm2foz", selection: "_1rsrm2fp0", focused: "_1rsrm2fp1", focusedVisible: "_1rsrm2fp2" }, defaultClass: "_1rsrm2fox" }, buttonTextSecondaryDisabled: { conditions: { base: "_1rsrm2fp3", hover: "_1rsrm2fp4", active: "_1rsrm2fp5", selection: "_1rsrm2fp6", focused: "_1rsrm2fp7", focusedVisible: "_1rsrm2fp8" }, defaultClass: "_1rsrm2fp3" }, buttonTextSecondary: { conditions: { base: "_1rsrm2fp9", hover: "_1rsrm2fpa", active: "_1rsrm2fpb", selection: "_1rsrm2fpc", focused: "_1rsrm2fpd", focusedVisible: "_1rsrm2fpe" }, defaultClass: "_1rsrm2fp9" }, buttonIconBackgroundHover: { conditions: { base: "_1rsrm2fpf", hover: "_1rsrm2fpg", active: "_1rsrm2fph", selection: "_1rsrm2fpi", focused: "_1rsrm2fpj", focusedVisible: "_1rsrm2fpk" }, defaultClass: "_1rsrm2fpf" }, buttonIconBackgroundPressed: { conditions: { base: "_1rsrm2fpl", hover: "_1rsrm2fpm", active: "_1rsrm2fpn", selection: "_1rsrm2fpo", focused: "_1rsrm2fpp", focusedVisible: "_1rsrm2fpq" }, defaultClass: "_1rsrm2fpl" }, buttonIconStroke: { conditions: { base: "_1rsrm2fpr", hover: "_1rsrm2fps", active: "_1rsrm2fpt", selection: "_1rsrm2fpu", focused: "_1rsrm2fpv", focusedVisible: "_1rsrm2fpw" }, defaultClass: "_1rsrm2fpr" }, badgeBackgroundSuccess: { conditions: { base: "_1rsrm2fpx", hover: "_1rsrm2fpy", active: "_1rsrm2fpz", selection: "_1rsrm2fq0", focused: "_1rsrm2fq1", focusedVisible: "_1rsrm2fq2" }, defaultClass: "_1rsrm2fpx" }, badgeBorderSuccess: { conditions: { base: "_1rsrm2fq3", hover: "_1rsrm2fq4", active: "_1rsrm2fq5", selection: "_1rsrm2fq6", focused: "_1rsrm2fq7", focusedVisible: "_1rsrm2fq8" }, defaultClass: "_1rsrm2fq3" }, badgeTextSuccess: { conditions: { base: "_1rsrm2fq9", hover: "_1rsrm2fqa", active: "_1rsrm2fqb", selection: "_1rsrm2fqc", focused: "_1rsrm2fqd", focusedVisible: "_1rsrm2fqe" }, defaultClass: "_1rsrm2fq9" }, announceGradientFrom: { conditions: { base: "_1rsrm2fqf", hover: "_1rsrm2fqg", active: "_1rsrm2fqh", selection: "_1rsrm2fqi", focused: "_1rsrm2fqj", focusedVisible: "_1rsrm2fqk" }, defaultClass: "_1rsrm2fqf" }, announceGradientTo: { conditions: { base: "_1rsrm2fql", hover: "_1rsrm2fqm", active: "_1rsrm2fqn", selection: "_1rsrm2fqo", focused: "_1rsrm2fqp", focusedVisible: "_1rsrm2fqq" }, defaultClass: "_1rsrm2fql" } } }, borderColor: { values: { accentColor: { conditions: { base: "_1rsrm2fqr", hover: "_1rsrm2fqs", active: "_1rsrm2fqt", selection: "_1rsrm2fqu", focused: "_1rsrm2fqv", focusedVisible: "_1rsrm2fqw" }, defaultClass: "_1rsrm2fqr" }, accentColorForeground: { conditions: { base: "_1rsrm2fqx", hover: "_1rsrm2fqy", active: "_1rsrm2fqz", selection: "_1rsrm2fr0", focused: "_1rsrm2fr1", focusedVisible: "_1rsrm2fr2" }, defaultClass: "_1rsrm2fqx" }, actionButtonBorder: { conditions: { base: "_1rsrm2fr3", hover: "_1rsrm2fr4", active: "_1rsrm2fr5", selection: "_1rsrm2fr6", focused: "_1rsrm2fr7", focusedVisible: "_1rsrm2fr8" }, defaultClass: "_1rsrm2fr3" }, connectButtonBackground: { conditions: { base: "_1rsrm2fr9", hover: "_1rsrm2fra", active: "_1rsrm2frb", selection: "_1rsrm2frc", focused: "_1rsrm2frd", focusedVisible: "_1rsrm2fre" }, defaultClass: "_1rsrm2fr9" }, connectButtonBackgroundError: { conditions: { base: "_1rsrm2frf", hover: "_1rsrm2frg", active: "_1rsrm2frh", selection: "_1rsrm2fri", focused: "_1rsrm2frj", focusedVisible: "_1rsrm2frk" }, defaultClass: "_1rsrm2frf" }, connectButtonText: { conditions: { base: "_1rsrm2frl", hover: "_1rsrm2frm", active: "_1rsrm2frn", selection: "_1rsrm2fro", focused: "_1rsrm2frp", focusedVisible: "_1rsrm2frq" }, defaultClass: "_1rsrm2frl" }, connectButtonTextError: { conditions: { base: "_1rsrm2frr", hover: "_1rsrm2frs", active: "_1rsrm2frt", selection: "_1rsrm2fru", focused: "_1rsrm2frv", focusedVisible: "_1rsrm2frw" }, defaultClass: "_1rsrm2frr" }, connectionIndicator: { conditions: { base: "_1rsrm2frx", hover: "_1rsrm2fry", active: "_1rsrm2frz", selection: "_1rsrm2fs0", focused: "_1rsrm2fs1", focusedVisible: "_1rsrm2fs2" }, defaultClass: "_1rsrm2frx" }, error: { conditions: { base: "_1rsrm2fs3", hover: "_1rsrm2fs4", active: "_1rsrm2fs5", selection: "_1rsrm2fs6", focused: "_1rsrm2fs7", focusedVisible: "_1rsrm2fs8" }, defaultClass: "_1rsrm2fs3" }, errorBackground: { conditions: { base: "_1rsrm2fs9", hover: "_1rsrm2fsa", active: "_1rsrm2fsb", selection: "_1rsrm2fsc", focused: "_1rsrm2fsd", focusedVisible: "_1rsrm2fse" }, defaultClass: "_1rsrm2fs9" }, errorBorder: { conditions: { base: "_1rsrm2fsf", hover: "_1rsrm2fsg", active: "_1rsrm2fsh", selection: "_1rsrm2fsi", focused: "_1rsrm2fsj", focusedVisible: "_1rsrm2fsk" }, defaultClass: "_1rsrm2fsf" }, generalBorder: { conditions: { base: "_1rsrm2fsl", hover: "_1rsrm2fsm", active: "_1rsrm2fsn", selection: "_1rsrm2fso", focused: "_1rsrm2fsp", focusedVisible: "_1rsrm2fsq" }, defaultClass: "_1rsrm2fsl" }, generalBorderDim: { conditions: { base: "_1rsrm2fsr", hover: "_1rsrm2fss", active: "_1rsrm2fst", selection: "_1rsrm2fsu", focused: "_1rsrm2fsv", focusedVisible: "_1rsrm2fsw" }, defaultClass: "_1rsrm2fsr" }, menuItemBackground: { conditions: { base: "_1rsrm2fsx", hover: "_1rsrm2fsy", active: "_1rsrm2fsz", selection: "_1rsrm2ft0", focused: "_1rsrm2ft1", focusedVisible: "_1rsrm2ft2" }, defaultClass: "_1rsrm2fsx" }, selectedOptionBorder: { conditions: { base: "_1rsrm2ft3", hover: "_1rsrm2ft4", active: "_1rsrm2ft5", selection: "_1rsrm2ft6", focused: "_1rsrm2ft7", focusedVisible: "_1rsrm2ft8" }, defaultClass: "_1rsrm2ft3" }, focusedOptionBorder: { conditions: { base: "_1rsrm2ft9", hover: "_1rsrm2fta", active: "_1rsrm2ftb", selection: "_1rsrm2ftc", focused: "_1rsrm2ftd", focusedVisible: "_1rsrm2fte" }, defaultClass: "_1rsrm2ft9" }, standby: { conditions: { base: "_1rsrm2ftf", hover: "_1rsrm2ftg", active: "_1rsrm2fth", selection: "_1rsrm2fti", focused: "_1rsrm2ftj", focusedVisible: "_1rsrm2ftk" }, defaultClass: "_1rsrm2ftf" }, success: { conditions: { base: "_1rsrm2ftl", hover: "_1rsrm2ftm", active: "_1rsrm2ftn", selection: "_1rsrm2fto", focused: "_1rsrm2ftp", focusedVisible: "_1rsrm2ftq" }, defaultClass: "_1rsrm2ftl" }, chainIconBorder: { conditions: { base: "_1rsrm2ftr", hover: "_1rsrm2fts", active: "_1rsrm2ftt", selection: "_1rsrm2ftu", focused: "_1rsrm2ftv", focusedVisible: "_1rsrm2ftw" }, defaultClass: "_1rsrm2ftr" }, modalBackdrop: { conditions: { base: "_1rsrm2ftx", hover: "_1rsrm2fty", active: "_1rsrm2ftz", selection: "_1rsrm2fu0", focused: "_1rsrm2fu1", focusedVisible: "_1rsrm2fu2" }, defaultClass: "_1rsrm2ftx" }, modalBackground: { conditions: { base: "_1rsrm2fu3", hover: "_1rsrm2fu4", active: "_1rsrm2fu5", selection: "_1rsrm2fu6", focused: "_1rsrm2fu7", focusedVisible: "_1rsrm2fu8" }, defaultClass: "_1rsrm2fu3" }, modalBorder: { conditions: { base: "_1rsrm2fu9", hover: "_1rsrm2fua", active: "_1rsrm2fub", selection: "_1rsrm2fuc", focused: "_1rsrm2fud", focusedVisible: "_1rsrm2fue" }, defaultClass: "_1rsrm2fu9" }, offBackground: { conditions: { base: "_1rsrm2fuf", hover: "_1rsrm2fug", active: "_1rsrm2fuh", selection: "_1rsrm2fui", focused: "_1rsrm2fuj", focusedVisible: "_1rsrm2fuk" }, defaultClass: "_1rsrm2fuf" }, offBackgroundComplimentary: { conditions: { base: "_1rsrm2ful", hover: "_1rsrm2fum", active: "_1rsrm2fun", selection: "_1rsrm2fuo", focused: "_1rsrm2fup", focusedVisible: "_1rsrm2fuq" }, defaultClass: "_1rsrm2ful" }, hoverState: { conditions: { base: "_1rsrm2fur", hover: "_1rsrm2fus", active: "_1rsrm2fut", selection: "_1rsrm2fuu", focused: "_1rsrm2fuv", focusedVisible: "_1rsrm2fuw" }, defaultClass: "_1rsrm2fur" }, lightStroke: { conditions: { base: "_1rsrm2fux", hover: "_1rsrm2fuy", active: "_1rsrm2fuz", selection: "_1rsrm2fv0", focused: "_1rsrm2fv1", focusedVisible: "_1rsrm2fv2" }, defaultClass: "_1rsrm2fux" }, mediumStroke: { conditions: { base: "_1rsrm2fv3", hover: "_1rsrm2fv4", active: "_1rsrm2fv5", selection: "_1rsrm2fv6", focused: "_1rsrm2fv7", focusedVisible: "_1rsrm2fv8" }, defaultClass: "_1rsrm2fv3" }, heavyStroke: { conditions: { base: "_1rsrm2fv9", hover: "_1rsrm2fva", active: "_1rsrm2fvb", selection: "_1rsrm2fvc", focused: "_1rsrm2fvd", focusedVisible: "_1rsrm2fve" }, defaultClass: "_1rsrm2fv9" }, strokeColor: { conditions: { base: "_1rsrm2fvf", hover: "_1rsrm2fvg", active: "_1rsrm2fvh", selection: "_1rsrm2fvi", focused: "_1rsrm2fvj", focusedVisible: "_1rsrm2fvk" }, defaultClass: "_1rsrm2fvf" }, dydxSwitchActiveBackground: { conditions: { base: "_1rsrm2fvl", hover: "_1rsrm2fvm", active: "_1rsrm2fvn", selection: "_1rsrm2fvo", focused: "_1rsrm2fvp", focusedVisible: "_1rsrm2fvq" }, defaultClass: "_1rsrm2fvl" }, primaryText: { conditions: { base: "_1rsrm2fvr", hover: "_1rsrm2fvs", active: "_1rsrm2fvt", selection: "_1rsrm2fvu", focused: "_1rsrm2fvv", focusedVisible: "_1rsrm2fvw" }, defaultClass: "_1rsrm2fvr" }, secondaryText: { conditions: { base: "_1rsrm2fvx", hover: "_1rsrm2fvy", active: "_1rsrm2fvz", selection: "_1rsrm2fw0", focused: "_1rsrm2fw1", focusedVisible: "_1rsrm2fw2" }, defaultClass: "_1rsrm2fvx" }, tertiaryText: { conditions: { base: "_1rsrm2fw3", hover: "_1rsrm2fw4", active: "_1rsrm2fw5", selection: "_1rsrm2fw6", focused: "_1rsrm2fw7", focusedVisible: "_1rsrm2fw8" }, defaultClass: "_1rsrm2fw3" }, textSelection: { conditions: { base: "_1rsrm2fw9", hover: "_1rsrm2fwa", active: "_1rsrm2fwb", selection: "_1rsrm2fwc", focused: "_1rsrm2fwd", focusedVisible: "_1rsrm2fwe" }, defaultClass: "_1rsrm2fw9" }, inputBackground: { conditions: { base: "_1rsrm2fwf", hover: "_1rsrm2fwg", active: "_1rsrm2fwh", selection: "_1rsrm2fwi", focused: "_1rsrm2fwj", focusedVisible: "_1rsrm2fwk" }, defaultClass: "_1rsrm2fwf" }, inputBorderBase: { conditions: { base: "_1rsrm2fwl", hover: "_1rsrm2fwm", active: "_1rsrm2fwn", selection: "_1rsrm2fwo", focused: "_1rsrm2fwp", focusedVisible: "_1rsrm2fwq" }, defaultClass: "_1rsrm2fwl" }, inputBorderHover: { conditions: { base: "_1rsrm2fwr", hover: "_1rsrm2fws", active: "_1rsrm2fwt", selection: "_1rsrm2fwu", focused: "_1rsrm2fwv", focusedVisible: "_1rsrm2fww" }, defaultClass: "_1rsrm2fwr" }, actionColor: { conditions: { base: "_1rsrm2fwx", hover: "_1rsrm2fwy", active: "_1rsrm2fwz", selection: "_1rsrm2fx0", focused: "_1rsrm2fx1", focusedVisible: "_1rsrm2fx2" }, defaultClass: "_1rsrm2fwx" }, actionColorHover: { conditions: { base: "_1rsrm2fx3", hover: "_1rsrm2fx4", active: "_1rsrm2fx5", selection: "_1rsrm2fx6", focused: "_1rsrm2fx7", focusedVisible: "_1rsrm2fx8" }, defaultClass: "_1rsrm2fx3" }, actionColorDisabled: { conditions: { base: "_1rsrm2fx9", hover: "_1rsrm2fxa", active: "_1rsrm2fxb", selection: "_1rsrm2fxc", focused: "_1rsrm2fxd", focusedVisible: "_1rsrm2fxe" }, defaultClass: "_1rsrm2fx9" }, buttonPrimary: { conditions: { base: "_1rsrm2fxf", hover: "_1rsrm2fxg", active: "_1rsrm2fxh", selection: "_1rsrm2fxi", focused: "_1rsrm2fxj", focusedVisible: "_1rsrm2fxk" }, defaultClass: "_1rsrm2fxf" }, buttonDisabled: { conditions: { base: "_1rsrm2fxl", hover: "_1rsrm2fxm", active: "_1rsrm2fxn", selection: "_1rsrm2fxo", focused: "_1rsrm2fxp", focusedVisible: "_1rsrm2fxq" }, defaultClass: "_1rsrm2fxl" }, buttonWarning: { conditions: { base: "_1rsrm2fxr", hover: "_1rsrm2fxs", active: "_1rsrm2fxt", selection: "_1rsrm2fxu", focused: "_1rsrm2fxv", focusedVisible: "_1rsrm2fxw" }, defaultClass: "_1rsrm2fxr" }, buttonSuccess: { conditions: { base: "_1rsrm2fxx", hover: "_1rsrm2fxy", active: "_1rsrm2fxz", selection: "_1rsrm2fy0", focused: "_1rsrm2fy1", focusedVisible: "_1rsrm2fy2" }, defaultClass: "_1rsrm2fxx" }, buttonTextPrimary: { conditions: { base: "_1rsrm2fy3", hover: "_1rsrm2fy4", active: "_1rsrm2fy5", selection: "_1rsrm2fy6", focused: "_1rsrm2fy7", focusedVisible: "_1rsrm2fy8" }, defaultClass: "_1rsrm2fy3" }, buttonTextDisabled: { conditions: { base: "_1rsrm2fy9", hover: "_1rsrm2fya", active: "_1rsrm2fyb", selection: "_1rsrm2fyc", focused: "_1rsrm2fyd", focusedVisible: "_1rsrm2fye" }, defaultClass: "_1rsrm2fy9" }, transparent: { conditions: { base: "_1rsrm2fyf", hover: "_1rsrm2fyg", active: "_1rsrm2fyh", selection: "_1rsrm2fyi", focused: "_1rsrm2fyj", focusedVisible: "_1rsrm2fyk" }, defaultClass: "_1rsrm2fyf" }, buttonBackgroundTertiary: { conditions: { base: "_1rsrm2fyl", hover: "_1rsrm2fym", active: "_1rsrm2fyn", selection: "_1rsrm2fyo", focused: "_1rsrm2fyp", focusedVisible: "_1rsrm2fyq" }, defaultClass: "_1rsrm2fyl" }, buttonBackgroundHoverTertiary: { conditions: { base: "_1rsrm2fyr", hover: "_1rsrm2fys", active: "_1rsrm2fyt", selection: "_1rsrm2fyu", focused: "_1rsrm2fyv", focusedVisible: "_1rsrm2fyw" }, defaultClass: "_1rsrm2fyr" }, buttonTextTertiary: { conditions: { base: "_1rsrm2fyx", hover: "_1rsrm2fyy", active: "_1rsrm2fyz", selection: "_1rsrm2fz0", focused: "_1rsrm2fz1", focusedVisible: "_1rsrm2fz2" }, defaultClass: "_1rsrm2fyx" }, buttonTextDisabledTertiary: { conditions: { base: "_1rsrm2fz3", hover: "_1rsrm2fz4", active: "_1rsrm2fz5", selection: "_1rsrm2fz6", focused: "_1rsrm2fz7", focusedVisible: "_1rsrm2fz8" }, defaultClass: "_1rsrm2fz3" }, buttonStrokeTertiary: { conditions: { base: "_1rsrm2fz9", hover: "_1rsrm2fza", active: "_1rsrm2fzb", selection: "_1rsrm2fzc", focused: "_1rsrm2fzd", focusedVisible: "_1rsrm2fze" }, defaultClass: "_1rsrm2fz9" }, buttonBackground: { conditions: { base: "_1rsrm2fzf", hover: "_1rsrm2fzg", active: "_1rsrm2fzh", selection: "_1rsrm2fzi", focused: "_1rsrm2fzj", focusedVisible: "_1rsrm2fzk" }, defaultClass: "_1rsrm2fzf" }, buttonBackgroundHover: { conditions: { base: "_1rsrm2fzl", hover: "_1rsrm2fzm", active: "_1rsrm2fzn", selection: "_1rsrm2fzo", focused: "_1rsrm2fzp", focusedVisible: "_1rsrm2fzq" }, defaultClass: "_1rsrm2fzl" }, buttonBackgroundDisabled: { conditions: { base: "_1rsrm2fzr", hover: "_1rsrm2fzs", active: "_1rsrm2fzt", selection: "_1rsrm2fzu", focused: "_1rsrm2fzv", focusedVisible: "_1rsrm2fzw" }, defaultClass: "_1rsrm2fzr" }, buttonStroke: { conditions: { base: "_1rsrm2fzx", hover: "_1rsrm2fzy", active: "_1rsrm2fzz", selection: "_1rsrm2f100", focused: "_1rsrm2f101", focusedVisible: "_1rsrm2f102" }, defaultClass: "_1rsrm2fzx" }, buttonTextSecondaryDisabled: { conditions: { base: "_1rsrm2f103", hover: "_1rsrm2f104", active: "_1rsrm2f105", selection: "_1rsrm2f106", focused: "_1rsrm2f107", focusedVisible: "_1rsrm2f108" }, defaultClass: "_1rsrm2f103" }, buttonTextSecondary: { conditions: { base: "_1rsrm2f109", hover: "_1rsrm2f10a", active: "_1rsrm2f10b", selection: "_1rsrm2f10c", focused: "_1rsrm2f10d", focusedVisible: "_1rsrm2f10e" }, defaultClass: "_1rsrm2f109" }, buttonIconBackgroundHover: { conditions: { base: "_1rsrm2f10f", hover: "_1rsrm2f10g", active: "_1rsrm2f10h", selection: "_1rsrm2f10i", focused: "_1rsrm2f10j", focusedVisible: "_1rsrm2f10k" }, defaultClass: "_1rsrm2f10f" }, buttonIconBackgroundPressed: { conditions: { base: "_1rsrm2f10l", hover: "_1rsrm2f10m", active: "_1rsrm2f10n", selection: "_1rsrm2f10o", focused: "_1rsrm2f10p", focusedVisible: "_1rsrm2f10q" }, defaultClass: "_1rsrm2f10l" }, buttonIconStroke: { conditions: { base: "_1rsrm2f10r", hover: "_1rsrm2f10s", active: "_1rsrm2f10t", selection: "_1rsrm2f10u", focused: "_1rsrm2f10v", focusedVisible: "_1rsrm2f10w" }, defaultClass: "_1rsrm2f10r" }, badgeBackgroundSuccess: { conditions: { base: "_1rsrm2f10x", hover: "_1rsrm2f10y", active: "_1rsrm2f10z", selection: "_1rsrm2f110", focused: "_1rsrm2f111", focusedVisible: "_1rsrm2f112" }, defaultClass: "_1rsrm2f10x" }, badgeBorderSuccess: { conditions: { base: "_1rsrm2f113", hover: "_1rsrm2f114", active: "_1rsrm2f115", selection: "_1rsrm2f116", focused: "_1rsrm2f117", focusedVisible: "_1rsrm2f118" }, defaultClass: "_1rsrm2f113" }, badgeTextSuccess: { conditions: { base: "_1rsrm2f119", hover: "_1rsrm2f11a", active: "_1rsrm2f11b", selection: "_1rsrm2f11c", focused: "_1rsrm2f11d", focusedVisible: "_1rsrm2f11e" }, defaultClass: "_1rsrm2f119" }, announceGradientFrom: { conditions: { base: "_1rsrm2f11f", hover: "_1rsrm2f11g", active: "_1rsrm2f11h", selection: "_1rsrm2f11i", focused: "_1rsrm2f11j", focusedVisible: "_1rsrm2f11k" }, defaultClass: "_1rsrm2f11f" }, announceGradientTo: { conditions: { base: "_1rsrm2f11l", hover: "_1rsrm2f11m", active: "_1rsrm2f11n", selection: "_1rsrm2f11o", focused: "_1rsrm2f11p", focusedVisible: "_1rsrm2f11q" }, defaultClass: "_1rsrm2f11l" } } }, boxShadow: { values: { connectButton: { conditions: { base: "_1rsrm2f11r", hover: "_1rsrm2f11s", active: "_1rsrm2f11t", selection: "_1rsrm2f11u", focused: "_1rsrm2f11v", focusedVisible: "_1rsrm2f11w" }, defaultClass: "_1rsrm2f11r" }, dialog: { conditions: { base: "_1rsrm2f11x", hover: "_1rsrm2f11y", active: "_1rsrm2f11z", selection: "_1rsrm2f120", focused: "_1rsrm2f121", focusedVisible: "_1rsrm2f122" }, defaultClass: "_1rsrm2f11x" }, selectedOption: { conditions: { base: "_1rsrm2f123", hover: "_1rsrm2f124", active: "_1rsrm2f125", selection: "_1rsrm2f126", focused: "_1rsrm2f127", focusedVisible: "_1rsrm2f128" }, defaultClass: "_1rsrm2f123" }, selectedWallet: { conditions: { base: "_1rsrm2f129", hover: "_1rsrm2f12a", active: "_1rsrm2f12b", selection: "_1rsrm2f12c", focused: "_1rsrm2f12d", focusedVisible: "_1rsrm2f12e" }, defaultClass: "_1rsrm2f129" }, dropdown: { conditions: { base: "_1rsrm2f12f", hover: "_1rsrm2f12g", active: "_1rsrm2f12h", selection: "_1rsrm2f12i", focused: "_1rsrm2f12j", focusedVisible: "_1rsrm2f12k" }, defaultClass: "_1rsrm2f12f" }, notification: { conditions: { base: "_1rsrm2f12l", hover: "_1rsrm2f12m", active: "_1rsrm2f12n", selection: "_1rsrm2f12o", focused: "_1rsrm2f12p", focusedVisible: "_1rsrm2f12q" }, defaultClass: "_1rsrm2f12l" }, vertexDropdown: { conditions: { base: "_1rsrm2f12r", hover: "_1rsrm2f12s", active: "_1rsrm2f12t", selection: "_1rsrm2f12u", focused: "_1rsrm2f12v", focusedVisible: "_1rsrm2f12w" }, defaultClass: "_1rsrm2f12r" } } }, color: { values: { accentColor: { conditions: { base: "_1rsrm2f12x", hover: "_1rsrm2f12y", active: "_1rsrm2f12z", selection: "_1rsrm2f130", focused: "_1rsrm2f131", focusedVisible: "_1rsrm2f132" }, defaultClass: "_1rsrm2f12x" }, accentColorForeground: { conditions: { base: "_1rsrm2f133", hover: "_1rsrm2f134", active: "_1rsrm2f135", selection: "_1rsrm2f136", focused: "_1rsrm2f137", focusedVisible: "_1rsrm2f138" }, defaultClass: "_1rsrm2f133" }, actionButtonBorder: { conditions: { base: "_1rsrm2f139", hover: "_1rsrm2f13a", active: "_1rsrm2f13b", selection: "_1rsrm2f13c", focused: "_1rsrm2f13d", focusedVisible: "_1rsrm2f13e" }, defaultClass: "_1rsrm2f139" }, connectButtonBackground: { conditions: { base: "_1rsrm2f13f", hover: "_1rsrm2f13g", active: "_1rsrm2f13h", selection: "_1rsrm2f13i", focused: "_1rsrm2f13j", focusedVisible: "_1rsrm2f13k" }, defaultClass: "_1rsrm2f13f" }, connectButtonBackgroundError: { conditions: { base: "_1rsrm2f13l", hover: "_1rsrm2f13m", active: "_1rsrm2f13n", selection: "_1rsrm2f13o", focused: "_1rsrm2f13p", focusedVisible: "_1rsrm2f13q" }, defaultClass: "_1rsrm2f13l" }, connectButtonText: { conditions: { base: "_1rsrm2f13r", hover: "_1rsrm2f13s", active: "_1rsrm2f13t", selection: "_1rsrm2f13u", focused: "_1rsrm2f13v", focusedVisible: "_1rsrm2f13w" }, defaultClass: "_1rsrm2f13r" }, connectButtonTextError: { conditions: { base: "_1rsrm2f13x", hover: "_1rsrm2f13y", active: "_1rsrm2f13z", selection: "_1rsrm2f140", focused: "_1rsrm2f141", focusedVisible: "_1rsrm2f142" }, defaultClass: "_1rsrm2f13x" }, connectionIndicator: { conditions: { base: "_1rsrm2f143", hover: "_1rsrm2f144", active: "_1rsrm2f145", selection: "_1rsrm2f146", focused: "_1rsrm2f147", focusedVisible: "_1rsrm2f148" }, defaultClass: "_1rsrm2f143" }, error: { conditions: { base: "_1rsrm2f149", hover: "_1rsrm2f14a", active: "_1rsrm2f14b", selection: "_1rsrm2f14c", focused: "_1rsrm2f14d", focusedVisible: "_1rsrm2f14e" }, defaultClass: "_1rsrm2f149" }, errorBackground: { conditions: { base: "_1rsrm2f14f", hover: "_1rsrm2f14g", active: "_1rsrm2f14h", selection: "_1rsrm2f14i", focused: "_1rsrm2f14j", focusedVisible: "_1rsrm2f14k" }, defaultClass: "_1rsrm2f14f" }, errorBorder: { conditions: { base: "_1rsrm2f14l", hover: "_1rsrm2f14m", active: "_1rsrm2f14n", selection: "_1rsrm2f14o", focused: "_1rsrm2f14p", focusedVisible: "_1rsrm2f14q" }, defaultClass: "_1rsrm2f14l" }, generalBorder: { conditions: { base: "_1rsrm2f14r", hover: "_1rsrm2f14s", active: "_1rsrm2f14t", selection: "_1rsrm2f14u", focused: "_1rsrm2f14v", focusedVisible: "_1rsrm2f14w" }, defaultClass: "_1rsrm2f14r" }, generalBorderDim: { conditions: { base: "_1rsrm2f14x", hover: "_1rsrm2f14y", active: "_1rsrm2f14z", selection: "_1rsrm2f150", focused: "_1rsrm2f151", focusedVisible: "_1rsrm2f152" }, defaultClass: "_1rsrm2f14x" }, menuItemBackground: { conditions: { base: "_1rsrm2f153", hover: "_1rsrm2f154", active: "_1rsrm2f155", selection: "_1rsrm2f156", focused: "_1rsrm2f157", focusedVisible: "_1rsrm2f158" }, defaultClass: "_1rsrm2f153" }, selectedOptionBorder: { conditions: { base: "_1rsrm2f159", hover: "_1rsrm2f15a", active: "_1rsrm2f15b", selection: "_1rsrm2f15c", focused: "_1rsrm2f15d", focusedVisible: "_1rsrm2f15e" }, defaultClass: "_1rsrm2f159" }, focusedOptionBorder: { conditions: { base: "_1rsrm2f15f", hover: "_1rsrm2f15g", active: "_1rsrm2f15h", selection: "_1rsrm2f15i", focused: "_1rsrm2f15j", focusedVisible: "_1rsrm2f15k" }, defaultClass: "_1rsrm2f15f" }, standby: { conditions: { base: "_1rsrm2f15l", hover: "_1rsrm2f15m", active: "_1rsrm2f15n", selection: "_1rsrm2f15o", focused: "_1rsrm2f15p", focusedVisible: "_1rsrm2f15q" }, defaultClass: "_1rsrm2f15l" }, success: { conditions: { base: "_1rsrm2f15r", hover: "_1rsrm2f15s", active: "_1rsrm2f15t", selection: "_1rsrm2f15u", focused: "_1rsrm2f15v", focusedVisible: "_1rsrm2f15w" }, defaultClass: "_1rsrm2f15r" }, chainIconBorder: { conditions: { base: "_1rsrm2f15x", hover: "_1rsrm2f15y", active: "_1rsrm2f15z", selection: "_1rsrm2f160", focused: "_1rsrm2f161", focusedVisible: "_1rsrm2f162" }, defaultClass: "_1rsrm2f15x" }, modalBackdrop: { conditions: { base: "_1rsrm2f163", hover: "_1rsrm2f164", active: "_1rsrm2f165", selection: "_1rsrm2f166", focused: "_1rsrm2f167", focusedVisible: "_1rsrm2f168" }, defaultClass: "_1rsrm2f163" }, modalBackground: { conditions: { base: "_1rsrm2f169", hover: "_1rsrm2f16a", active: "_1rsrm2f16b", selection: "_1rsrm2f16c", focused: "_1rsrm2f16d", focusedVisible: "_1rsrm2f16e" }, defaultClass: "_1rsrm2f169" }, modalBorder: { conditions: { base: "_1rsrm2f16f", hover: "_1rsrm2f16g", active: "_1rsrm2f16h", selection: "_1rsrm2f16i", focused: "_1rsrm2f16j", focusedVisible: "_1rsrm2f16k" }, defaultClass: "_1rsrm2f16f" }, offBackground: { conditions: { base: "_1rsrm2f16l", hover: "_1rsrm2f16m", active: "_1rsrm2f16n", selection: "_1rsrm2f16o", focused: "_1rsrm2f16p", focusedVisible: "_1rsrm2f16q" }, defaultClass: "_1rsrm2f16l" }, offBackgroundComplimentary: { conditions: { base: "_1rsrm2f16r", hover: "_1rsrm2f16s", active: "_1rsrm2f16t", selection: "_1rsrm2f16u", focused: "_1rsrm2f16v", focusedVisible: "_1rsrm2f16w" }, defaultClass: "_1rsrm2f16r" }, hoverState: { conditions: { base: "_1rsrm2f16x", hover: "_1rsrm2f16y", active: "_1rsrm2f16z", selection: "_1rsrm2f170", focused: "_1rsrm2f171", focusedVisible: "_1rsrm2f172" }, defaultClass: "_1rsrm2f16x" }, lightStroke: { conditions: { base: "_1rsrm2f173", hover: "_1rsrm2f174", active: "_1rsrm2f175", selection: "_1rsrm2f176", focused: "_1rsrm2f177", focusedVisible: "_1rsrm2f178" }, defaultClass: "_1rsrm2f173" }, mediumStroke: { conditions: { base: "_1rsrm2f179", hover: "_1rsrm2f17a", active: "_1rsrm2f17b", selection: "_1rsrm2f17c", focused: "_1rsrm2f17d", focusedVisible: "_1rsrm2f17e" }, defaultClass: "_1rsrm2f179" }, heavyStroke: { conditions: { base: "_1rsrm2f17f", hover: "_1rsrm2f17g", active: "_1rsrm2f17h", selection: "_1rsrm2f17i", focused: "_1rsrm2f17j", focusedVisible: "_1rsrm2f17k" }, defaultClass: "_1rsrm2f17f" }, strokeColor: { conditions: { base: "_1rsrm2f17l", hover: "_1rsrm2f17m", active: "_1rsrm2f17n", selection: "_1rsrm2f17o", focused: "_1rsrm2f17p", focusedVisible: "_1rsrm2f17q" }, defaultClass: "_1rsrm2f17l" }, dydxSwitchActiveBackground: { conditions: { base: "_1rsrm2f17r", hover: "_1rsrm2f17s", active: "_1rsrm2f17t", selection: "_1rsrm2f17u", focused: "_1rsrm2f17v", focusedVisible: "_1rsrm2f17w" }, defaultClass: "_1rsrm2f17r" }, primaryText: { conditions: { base: "_1rsrm2f17x", hover: "_1rsrm2f17y", active: "_1rsrm2f17z", selection: "_1rsrm2f180", focused: "_1rsrm2f181", focusedVisible: "_1rsrm2f182" }, defaultClass: "_1rsrm2f17x" }, secondaryText: { conditions: { base: "_1rsrm2f183", hover: "_1rsrm2f184", active: "_1rsrm2f185", selection: "_1rsrm2f186", focused: "_1rsrm2f187", focusedVisible: "_1rsrm2f188" }, defaultClass: "_1rsrm2f183" }, tertiaryText: { conditions: { base: "_1rsrm2f189", hover: "_1rsrm2f18a", active: "_1rsrm2f18b", selection: "_1rsrm2f18c", focused: "_1rsrm2f18d", focusedVisible: "_1rsrm2f18e" }, defaultClass: "_1rsrm2f189" }, textSelection: { conditions: { base: "_1rsrm2f18f", hover: "_1rsrm2f18g", active: "_1rsrm2f18h", selection: "_1rsrm2f18i", focused: "_1rsrm2f18j", focusedVisible: "_1rsrm2f18k" }, defaultClass: "_1rsrm2f18f" }, inputBackground: { conditions: { base: "_1rsrm2f18l", hover: "_1rsrm2f18m", active: "_1rsrm2f18n", selection: "_1rsrm2f18o", focused: "_1rsrm2f18p", focusedVisible: "_1rsrm2f18q" }, defaultClass: "_1rsrm2f18l" }, inputBorderBase: { conditions: { base: "_1rsrm2f18r", hover: "_1rsrm2f18s", active: "_1rsrm2f18t", selection: "_1rsrm2f18u", focused: "_1rsrm2f18v", focusedVisible: "_1rsrm2f18w" }, defaultClass: "_1rsrm2f18r" }, inputBorderHover: { conditions: { base: "_1rsrm2f18x", hover: "_1rsrm2f18y", active: "_1rsrm2f18z", selection: "_1rsrm2f190", focused: "_1rsrm2f191", focusedVisible: "_1rsrm2f192" }, defaultClass: "_1rsrm2f18x" }, actionColor: { conditions: { base: "_1rsrm2f193", hover: "_1rsrm2f194", active: "_1rsrm2f195", selection: "_1rsrm2f196", focused: "_1rsrm2f197", focusedVisible: "_1rsrm2f198" }, defaultClass: "_1rsrm2f193" }, actionColorHover: { conditions: { base: "_1rsrm2f199", hover: "_1rsrm2f19a", active: "_1rsrm2f19b", selection: "_1rsrm2f19c", focused: "_1rsrm2f19d", focusedVisible: "_1rsrm2f19e" }, defaultClass: "_1rsrm2f199" }, actionColorDisabled: { conditions: { base: "_1rsrm2f19f", hover: "_1rsrm2f19g", active: "_1rsrm2f19h", selection: "_1rsrm2f19i", focused: "_1rsrm2f19j", focusedVisible: "_1rsrm2f19k" }, defaultClass: "_1rsrm2f19f" }, buttonPrimary: { conditions: { base: "_1rsrm2f19l", hover: "_1rsrm2f19m", active: "_1rsrm2f19n", selection: "_1rsrm2f19o", focused: "_1rsrm2f19p", focusedVisible: "_1rsrm2f19q" }, defaultClass: "_1rsrm2f19l" }, buttonDisabled: { conditions: { base: "_1rsrm2f19r", hover: "_1rsrm2f19s", active: "_1rsrm2f19t", selection: "_1rsrm2f19u", focused: "_1rsrm2f19v", focusedVisible: "_1rsrm2f19w" }, defaultClass: "_1rsrm2f19r" }, buttonWarning: { conditions: { base: "_1rsrm2f19x", hover: "_1rsrm2f19y", active: "_1rsrm2f19z", selection: "_1rsrm2f1a0", focused: "_1rsrm2f1a1", focusedVisible: "_1rsrm2f1a2" }, defaultClass: "_1rsrm2f19x" }, buttonSuccess: { conditions: { base: "_1rsrm2f1a3", hover: "_1rsrm2f1a4", active: "_1rsrm2f1a5", selection: "_1rsrm2f1a6", focused: "_1rsrm2f1a7", focusedVisible: "_1rsrm2f1a8" }, defaultClass: "_1rsrm2f1a3" }, buttonTextPrimary: { conditions: { base: "_1rsrm2f1a9", hover: "_1rsrm2f1aa", active: "_1rsrm2f1ab", selection: "_1rsrm2f1ac", focused: "_1rsrm2f1ad", focusedVisible: "_1rsrm2f1ae" }, defaultClass: "_1rsrm2f1a9" }, buttonTextDisabled: { conditions: { base: "_1rsrm2f1af", hover: "_1rsrm2f1ag", active: "_1rsrm2f1ah", selection: "_1rsrm2f1ai", focused: "_1rsrm2f1aj", focusedVisible: "_1rsrm2f1ak" }, defaultClass: "_1rsrm2f1af" }, transparent: { conditions: { base: "_1rsrm2f1al", hover: "_1rsrm2f1am", active: "_1rsrm2f1an", selection: "_1rsrm2f1ao", focused: "_1rsrm2f1ap", focusedVisible: "_1rsrm2f1aq" }, defaultClass: "_1rsrm2f1al" }, buttonBackgroundTertiary: { conditions: { base: "_1rsrm2f1ar", hover: "_1rsrm2f1as", active: "_1rsrm2f1at", selection: "_1rsrm2f1au", focused: "_1rsrm2f1av", focusedVisible: "_1rsrm2f1aw" }, defaultClass: "_1rsrm2f1ar" }, buttonBackgroundHoverTertiary: { conditions: { base: "_1rsrm2f1ax", hover: "_1rsrm2f1ay", active: "_1rsrm2f1az", selection: "_1rsrm2f1b0", focused: "_1rsrm2f1b1", focusedVisible: "_1rsrm2f1b2" }, defaultClass: "_1rsrm2f1ax" }, buttonTextTertiary: { conditions: { base: "_1rsrm2f1b3", hover: "_1rsrm2f1b4", active: "_1rsrm2f1b5", selection: "_1rsrm2f1b6", focused: "_1rsrm2f1b7", focusedVisible: "_1rsrm2f1b8" }, defaultClass: "_1rsrm2f1b3" }, buttonTextDisabledTertiary: { conditions: { base: "_1rsrm2f1b9", hover: "_1rsrm2f1ba", active: "_1rsrm2f1bb", selection: "_1rsrm2f1bc", focused: "_1rsrm2f1bd", focusedVisible: "_1rsrm2f1be" }, defaultClass: "_1rsrm2f1b9" }, buttonStrokeTertiary: { conditions: { base: "_1rsrm2f1bf", hover: "_1rsrm2f1bg", active: "_1rsrm2f1bh", selection: "_1rsrm2f1bi", focused: "_1rsrm2f1bj", focusedVisible: "_1rsrm2f1bk" }, defaultClass: "_1rsrm2f1bf" }, buttonBackground: { conditions: { base: "_1rsrm2f1bl", hover: "_1rsrm2f1bm", active: "_1rsrm2f1bn", selection: "_1rsrm2f1bo", focused: "_1rsrm2f1bp", focusedVisible: "_1rsrm2f1bq" }, defaultClass: "_1rsrm2f1bl" }, buttonBackgroundHover: { conditions: { base: "_1rsrm2f1br", hover: "_1rsrm2f1bs", active: "_1rsrm2f1bt", selection: "_1rsrm2f1bu", focused: "_1rsrm2f1bv", focusedVisible: "_1rsrm2f1bw" }, defaultClass: "_1rsrm2f1br" }, buttonBackgroundDisabled: { conditions: { base: "_1rsrm2f1bx", hover: "_1rsrm2f1by", active: "_1rsrm2f1bz", selection: "_1rsrm2f1c0", focused: "_1rsrm2f1c1", focusedVisible: "_1rsrm2f1c2" }, defaultClass: "_1rsrm2f1bx" }, buttonStroke: { conditions: { base: "_1rsrm2f1c3", hover: "_1rsrm2f1c4", active: "_1rsrm2f1c5", selection: "_1rsrm2f1c6", focused: "_1rsrm2f1c7", focusedVisible: "_1rsrm2f1c8" }, defaultClass: "_1rsrm2f1c3" }, buttonTextSecondaryDisabled: { conditions: { base: "_1rsrm2f1c9", hover: "_1rsrm2f1ca", active: "_1rsrm2f1cb", selection: "_1rsrm2f1cc", focused: "_1rsrm2f1cd", focusedVisible: "_1rsrm2f1ce" }, defaultClass: "_1rsrm2f1c9" }, buttonTextSecondary: { conditions: { base: "_1rsrm2f1cf", hover: "_1rsrm2f1cg", active: "_1rsrm2f1ch", selection: "_1rsrm2f1ci", focused: "_1rsrm2f1cj", focusedVisible: "_1rsrm2f1ck" }, defaultClass: "_1rsrm2f1cf" }, buttonIconBackgroundHover: { conditions: { base: "_1rsrm2f1cl", hover: "_1rsrm2f1cm", active: "_1rsrm2f1cn", selection: "_1rsrm2f1co", focused: "_1rsrm2f1cp", focusedVisible: "_1rsrm2f1cq" }, defaultClass: "_1rsrm2f1cl" }, buttonIconBackgroundPressed: { conditions: { base: "_1rsrm2f1cr", hover: "_1rsrm2f1cs", active: "_1rsrm2f1ct", selection: "_1rsrm2f1cu", focused: "_1rsrm2f1cv", focusedVisible: "_1rsrm2f1cw" }, defaultClass: "_1rsrm2f1cr" }, buttonIconStroke: { conditions: { base: "_1rsrm2f1cx", hover: "_1rsrm2f1cy", active: "_1rsrm2f1cz", selection: "_1rsrm2f1d0", focused: "_1rsrm2f1d1", focusedVisible: "_1rsrm2f1d2" }, defaultClass: "_1rsrm2f1cx" }, badgeBackgroundSuccess: { conditions: { base: "_1rsrm2f1d3", hover: "_1rsrm2f1d4", active: "_1rsrm2f1d5", selection: "_1rsrm2f1d6", focused: "_1rsrm2f1d7", focusedVisible: "_1rsrm2f1d8" }, defaultClass: "_1rsrm2f1d3" }, badgeBorderSuccess: { conditions: { base: "_1rsrm2f1d9", hover: "_1rsrm2f1da", active: "_1rsrm2f1db", selection: "_1rsrm2f1dc", focused: "_1rsrm2f1dd", focusedVisible: "_1rsrm2f1de" }, defaultClass: "_1rsrm2f1d9" }, badgeTextSuccess: { conditions: { base: "_1rsrm2f1df", hover: "_1rsrm2f1dg", active: "_1rsrm2f1dh", selection: "_1rsrm2f1di", focused: "_1rsrm2f1dj", focusedVisible: "_1rsrm2f1dk" }, defaultClass: "_1rsrm2f1df" }, announceGradientFrom: { conditions: { base: "_1rsrm2f1dl", hover: "_1rsrm2f1dm", active: "_1rsrm2f1dn", selection: "_1rsrm2f1do", focused: "_1rsrm2f1dp", focusedVisible: "_1rsrm2f1dq" }, defaultClass: "_1rsrm2f1dl" }, announceGradientTo: { conditions: { base: "_1rsrm2f1dr", hover: "_1rsrm2f1ds", active: "_1rsrm2f1dt", selection: "_1rsrm2f1du", focused: "_1rsrm2f1dv", focusedVisible: "_1rsrm2f1dw" }, defaultClass: "_1rsrm2f1dr" } } } } }, { conditions: { defaultCondition: "smallScreen", conditionNames: ["smallScreen", "largeScreen"], responsiveArray: void 0 }, styles: { alignItems: { values: { "flex-start": { conditions: { smallScreen: "_1rsrm2f0", largeScreen: "_1rsrm2f1" }, defaultClass: "_1rsrm2f0" }, "flex-end": { conditions: { smallScreen: "_1rsrm2f2", largeScreen: "_1rsrm2f3" }, defaultClass: "_1rsrm2f2" }, center: { conditions: { smallScreen: "_1rsrm2f4", largeScreen: "_1rsrm2f5" }, defaultClass: "_1rsrm2f4" } } }, display: { values: { none: { conditions: { smallScreen: "_1rsrm2f6", largeScreen: "_1rsrm2f7" }, defaultClass: "_1rsrm2f6" }, block: { conditions: { smallScreen: "_1rsrm2f8", largeScreen: "_1rsrm2f9" }, defaultClass: "_1rsrm2f8" }, flex: { conditions: { smallScreen: "_1rsrm2fa", largeScreen: "_1rsrm2fb" }, defaultClass: "_1rsrm2fa" }, inline: { conditions: { smallScreen: "_1rsrm2fc", largeScreen: "_1rsrm2fd" }, defaultClass: "_1rsrm2fc" } } } } }, { conditions: void 0, styles: { margin: { mappings: ["marginTop", "marginBottom", "marginLeft", "marginRight"] }, marginX: { mappings: ["marginLeft", "marginRight"] }, marginY: { mappings: ["marginTop", "marginBottom"] }, padding: { mappings: ["paddingTop", "paddingBottom", "paddingLeft", "paddingRight"] }, paddingX: { mappings: ["paddingLeft", "paddingRight"] }, paddingY: { mappings: ["paddingTop", "paddingBottom"] }, alignSelf: { values: { "flex-start": { defaultClass: "_1rsrm2fe" }, "flex-end": { defaultClass: "_1rsrm2ff" }, center: { defaultClass: "_1rsrm2fg" } } }, backgroundSize: { values: { cover: { defaultClass: "_1rsrm2fh" } } }, borderRadius: { values: { "1": { defaultClass: "_1rsrm2fi" }, "4": { defaultClass: "_1rsrm2fj" }, "6": { defaultClass: "_1rsrm2fk" }, "8": { defaultClass: "_1rsrm2fl" }, "10": { defaultClass: "_1rsrm2fm" }, "11": { defaultClass: "_1rsrm2fn" }, "13": { defaultClass: "_1rsrm2fo" }, "16": { defaultClass: "_1rsrm2fp" }, "24": { defaultClass: "_1rsrm2fq" }, actionButton: { defaultClass: "_1rsrm2fr" }, connectButton: { defaultClass: "_1rsrm2fs" }, menuButton: { defaultClass: "_1rsrm2ft" }, modal: { defaultClass: "_1rsrm2fu" }, modalMobile: { defaultClass: "_1rsrm2fv" }, modalActionButton: { defaultClass: "_1rsrm2fw" }, modalActionButtonMobile: { defaultClass: "_1rsrm2fx" }, full: { defaultClass: "_1rsrm2fy" } } }, borderStyle: { values: { solid: { defaultClass: "_1rsrm2fz" }, dotted: { defaultClass: "_1rsrm2f10" }, hidden: { defaultClass: "_1rsrm2f11" } } }, borderWidth: { values: { "0": { defaultClass: "_1rsrm2f12" }, "1": { defaultClass: "_1rsrm2f13" }, "2": { defaultClass: "_1rsrm2f14" }, "3": { defaultClass: "_1rsrm2f15" }, "4": { defaultClass: "_1rsrm2f16" }, "0.5": { defaultClass: "_1rsrm2f17" } } }, cursor: { values: { help: { defaultClass: "_1rsrm2f18" }, pointer: { defaultClass: "_1rsrm2f19" }, "not-allowed": { defaultClass: "_1rsrm2f1a" }, "default": { defaultClass: "_1rsrm2f1b" } } }, flexDirection: { values: { row: { defaultClass: "_1rsrm2f1c" }, column: { defaultClass: "_1rsrm2f1d" } } }, fontFamily: { values: { body: { defaultClass: "_1rsrm2f1e" } } }, fontSize: { values: { "10": { defaultClass: "_1rsrm2f1f" }, "12": { defaultClass: "_1rsrm2f1g" }, "13": { defaultClass: "_1rsrm2f1h" }, "14": { defaultClass: "_1rsrm2f1i" }, "16": { defaultClass: "_1rsrm2f1j" }, "18": { defaultClass: "_1rsrm2f1k" }, "20": { defaultClass: "_1rsrm2f1l" }, "21": { defaultClass: "_1rsrm2f1m" }, "40": { defaultClass: "_1rsrm2f1n" }, "57": { defaultClass: "_1rsrm2f1o" } } }, fontWeight: { values: { regular: { defaultClass: "_1rsrm2f1p" }, medium: { defaultClass: "_1rsrm2f1q" }, semibold: { defaultClass: "_1rsrm2f1r" }, bold: { defaultClass: "_1rsrm2f1s" }, heavy: { defaultClass: "_1rsrm2f1t" } } }, gap: { values: { "0": { defaultClass: "_1rsrm2f1u" }, "1": { defaultClass: "_1rsrm2f1v" }, "2": { defaultClass: "_1rsrm2f1w" }, "3": { defaultClass: "_1rsrm2f1x" }, "4": { defaultClass: "_1rsrm2f1y" }, "5": { defaultClass: "_1rsrm2f1z" }, "6": { defaultClass: "_1rsrm2f20" }, "7": { defaultClass: "_1rsrm2f21" }, "8": { defaultClass: "_1rsrm2f22" }, "9": { defaultClass: "_1rsrm2f23" }, "10": { defaultClass: "_1rsrm2f24" }, "11": { defaultClass: "_1rsrm2f25" }, "12": { defaultClass: "_1rsrm2f26" }, "13": { defaultClass: "_1rsrm2f27" }, "14": { defaultClass: "_1rsrm2f28" }, "15": { defaultClass: "_1rsrm2f29" }, "16": { defaultClass: "_1rsrm2f2a" }, "18": { defaultClass: "_1rsrm2f2b" }, "20": { defaultClass: "_1rsrm2f2c" }, "24": { defaultClass: "_1rsrm2f2d" }, "28": { defaultClass: "_1rsrm2f2e" }, "30": { defaultClass: "_1rsrm2f2f" }, "32": { defaultClass: "_1rsrm2f2g" }, "36": { defaultClass: "_1rsrm2f2h" }, "44": { defaultClass: "_1rsrm2f2i" }, "64": { defaultClass: "_1rsrm2f2j" }, "-1": { defaultClass: "_1rsrm2f2k" } } }, height: { values: { "1": { defaultClass: "_1rsrm2f2l" }, "2": { defaultClass: "_1rsrm2f2m" }, "4": { defaultClass: "_1rsrm2f2n" }, "8": { defaultClass: "_1rsrm2f2o" }, "10": { defaultClass: "_1rsrm2f2p" }, "11": { defaultClass: "_1rsrm2f2q" }, "12": { defaultClass: "_1rsrm2f2r" }, "13": { defaultClass: "_1rsrm2f2s" }, "14": { defaultClass: "_1rsrm2f2t" }, "15": { defaultClass: "_1rsrm2f2u" }, "16": { defaultClass: "_1rsrm2f2v" }, "18": { defaultClass: "_1rsrm2f2w" }, "20": { defaultClass: "_1rsrm2f2x" }, "24": { defaultClass: "_1rsrm2f2y" }, "28": { defaultClass: "_1rsrm2f2z" }, "30": { defaultClass: "_1rsrm2f30" }, "32": { defaultClass: "_1rsrm2f31" }, "34": { defaultClass: "_1rsrm2f32" }, "36": { defaultClass: "_1rsrm2f33" }, "40": { defaultClass: "_1rsrm2f34" }, "44": { defaultClass: "_1rsrm2f35" }, "48": { defaultClass: "_1rsrm2f36" }, "50": { defaultClass: "_1rsrm2f37" }, "54": { defaultClass: "_1rsrm2f38" }, "57": { defaultClass: "_1rsrm2f39" }, "60": { defaultClass: "_1rsrm2f3a" }, "72": { defaultClass: "_1rsrm2f3b" }, "93": { defaultClass: "_1rsrm2f3c" }, "96": { defaultClass: "_1rsrm2f3d" }, "100": { defaultClass: "_1rsrm2f3e" }, "108": { defaultClass: "_1rsrm2f3f" }, "120": { defaultClass: "_1rsrm2f3g" }, "180": { defaultClass: "_1rsrm2f3h" }, "200": { defaultClass: "_1rsrm2f3i" }, "240": { defaultClass: "_1rsrm2f3j" }, half: { defaultClass: "_1rsrm2f3k" }, full: { defaultClass: "_1rsrm2f3l" }, max: { defaultClass: "_1rsrm2f3m" } } }, justifyContent: { values: { "flex-start": { defaultClass: "_1rsrm2f3n" }, "flex-end": { defaultClass: "_1rsrm2f3o" }, center: { defaultClass: "_1rsrm2f3p" }, "space-between": { defaultClass: "_1rsrm2f3q" }, "space-around": { defaultClass: "_1rsrm2f3r" } } }, textAlign: { values: { left: { defaultClass: "_1rsrm2f3s" }, center: { defaultClass: "_1rsrm2f3t" }, right: { defaultClass: "_1rsrm2f3u" }, inherit: { defaultClass: "_1rsrm2f3v" } } }, marginBottom: { values: { "0": { defaultClass: "_1rsrm2f3w" }, "1": { defaultClass: "_1rsrm2f3x" }, "2": { defaultClass: "_1rsrm2f3y" }, "3": { defaultClass: "_1rsrm2f3z" }, "4": { defaultClass: "_1rsrm2f40" }, "5": { defaultClass: "_1rsrm2f41" }, "6": { defaultClass: "_1rsrm2f42" }, "7": { defaultClass: "_1rsrm2f43" }, "8": { defaultClass: "_1rsrm2f44" }, "9": { defaultClass: "_1rsrm2f45" }, "10": { defaultClass: "_1rsrm2f46" }, "11": { defaultClass: "_1rsrm2f47" }, "12": { defaultClass: "_1rsrm2f48" }, "13": { defaultClass: "_1rsrm2f49" }, "14": { defaultClass: "_1rsrm2f4a" }, "15": { defaultClass: "_1rsrm2f4b" }, "16": { defaultClass: "_1rsrm2f4c" }, "18": { defaultClass: "_1rsrm2f4d" }, "20": { defaultClass: "_1rsrm2f4e" }, "24": { defaultClass: "_1rsrm2f4f" }, "28": { defaultClass: "_1rsrm2f4g" }, "30": { defaultClass: "_1rsrm2f4h" }, "32": { defaultClass: "_1rsrm2f4i" }, "36": { defaultClass: "_1rsrm2f4j" }, "44": { defaultClass: "_1rsrm2f4k" }, "64": { defaultClass: "_1rsrm2f4l" }, auto: { defaultClass: "_1rsrm2f4m" }, "-18": { defaultClass: "_1rsrm2f4n" }, "-12": { defaultClass: "_1rsrm2f4o" }, "-1": { defaultClass: "_1rsrm2f4p" } } }, marginLeft: { values: { "0": { defaultClass: "_1rsrm2f4q" }, "1": { defaultClass: "_1rsrm2f4r" }, "2": { defaultClass: "_1rsrm2f4s" }, "3": { defaultClass: "_1rsrm2f4t" }, "4": { defaultClass: "_1rsrm2f4u" }, "5": { defaultClass: "_1rsrm2f4v" }, "6": { defaultClass: "_1rsrm2f4w" }, "7": { defaultClass: "_1rsrm2f4x" }, "8": { defaultClass: "_1rsrm2f4y" }, "9": { defaultClass: "_1rsrm2f4z" }, "10": { defaultClass: "_1rsrm2f50" }, "11": { defaultClass: "_1rsrm2f51" }, "12": { defaultClass: "_1rsrm2f52" }, "13": { defaultClass: "_1rsrm2f53" }, "14": { defaultClass: "_1rsrm2f54" }, "15": { defaultClass: "_1rsrm2f55" }, "16": { defaultClass: "_1rsrm2f56" }, "18": { defaultClass: "_1rsrm2f57" }, "20": { defaultClass: "_1rsrm2f58" }, "24": { defaultClass: "_1rsrm2f59" }, "28": { defaultClass: "_1rsrm2f5a" }, "30": { defaultClass: "_1rsrm2f5b" }, "32": { defaultClass: "_1rsrm2f5c" }, "36": { defaultClass: "_1rsrm2f5d" }, "44": { defaultClass: "_1rsrm2f5e" }, "64": { defaultClass: "_1rsrm2f5f" }, auto: { defaultClass: "_1rsrm2f5g" }, "-18": { defaultClass: "_1rsrm2f5h" }, "-12": { defaultClass: "_1rsrm2f5i" }, "-1": { defaultClass: "_1rsrm2f5j" } } }, marginRight: { values: { "0": { defaultClass: "_1rsrm2f5k" }, "1": { defaultClass: "_1rsrm2f5l" }, "2": { defaultClass: "_1rsrm2f5m" }, "3": { defaultClass: "_1rsrm2f5n" }, "4": { defaultClass: "_1rsrm2f5o" }, "5": { defaultClass: "_1rsrm2f5p" }, "6": { defaultClass: "_1rsrm2f5q" }, "7": { defaultClass: "_1rsrm2f5r" }, "8": { defaultClass: "_1rsrm2f5s" }, "9": { defaultClass: "_1rsrm2f5t" }, "10": { defaultClass: "_1rsrm2f5u" }, "11": { defaultClass: "_1rsrm2f5v" }, "12": { defaultClass: "_1rsrm2f5w" }, "13": { defaultClass: "_1rsrm2f5x" }, "14": { defaultClass: "_1rsrm2f5y" }, "15": { defaultClass: "_1rsrm2f5z" }, "16": { defaultClass: "_1rsrm2f60" }, "18": { defaultClass: "_1rsrm2f61" }, "20": { defaultClass: "_1rsrm2f62" }, "24": { defaultClass: "_1rsrm2f63" }, "28": { defaultClass: "_1rsrm2f64" }, "30": { defaultClass: "_1rsrm2f65" }, "32": { defaultClass: "_1rsrm2f66" }, "36": { defaultClass: "_1rsrm2f67" }, "44": { defaultClass: "_1rsrm2f68" }, "64": { defaultClass: "_1rsrm2f69" }, auto: { defaultClass: "_1rsrm2f6a" }, "-18": { defaultClass: "_1rsrm2f6b" }, "-12": { defaultClass: "_1rsrm2f6c" }, "-1": { defaultClass: "_1rsrm2f6d" } } }, marginTop: { values: { "0": { defaultClass: "_1rsrm2f6e" }, "1": { defaultClass: "_1rsrm2f6f" }, "2": { defaultClass: "_1rsrm2f6g" }, "3": { defaultClass: "_1rsrm2f6h" }, "4": { defaultClass: "_1rsrm2f6i" }, "5": { defaultClass: "_1rsrm2f6j" }, "6": { defaultClass: "_1rsrm2f6k" }, "7": { defaultClass: "_1rsrm2f6l" }, "8": { defaultClass: "_1rsrm2f6m" }, "9": { defaultClass: "_1rsrm2f6n" }, "10": { defaultClass: "_1rsrm2f6o" }, "11": { defaultClass: "_1rsrm2f6p" }, "12": { defaultClass: "_1rsrm2f6q" }, "13": { defaultClass: "_1rsrm2f6r" }, "14": { defaultClass: "_1rsrm2f6s" }, "15": { defaultClass: "_1rsrm2f6t" }, "16": { defaultClass: "_1rsrm2f6u" }, "18": { defaultClass: "_1rsrm2f6v" }, "20": { defaultClass: "_1rsrm2f6w" }, "24": { defaultClass: "_1rsrm2f6x" }, "28": { defaultClass: "_1rsrm2f6y" }, "30": { defaultClass: "_1rsrm2f6z" }, "32": { defaultClass: "_1rsrm2f70" }, "36": { defaultClass: "_1rsrm2f71" }, "44": { defaultClass: "_1rsrm2f72" }, "64": { defaultClass: "_1rsrm2f73" }, auto: { defaultClass: "_1rsrm2f74" }, "-18": { defaultClass: "_1rsrm2f75" }, "-12": { defaultClass: "_1rsrm2f76" }, "-1": { defaultClass: "_1rsrm2f77" } } }, minHeight: { values: { "1": { defaultClass: "_1rsrm2f78" }, "2": { defaultClass: "_1rsrm2f79" }, "4": { defaultClass: "_1rsrm2f7a" }, "8": { defaultClass: "_1rsrm2f7b" }, "10": { defaultClass: "_1rsrm2f7c" }, "11": { defaultClass: "_1rsrm2f7d" }, "12": { defaultClass: "_1rsrm2f7e" }, "13": { defaultClass: "_1rsrm2f7f" }, "14": { defaultClass: "_1rsrm2f7g" }, "15": { defaultClass: "_1rsrm2f7h" }, "16": { defaultClass: "_1rsrm2f7i" }, "18": { defaultClass: "_1rsrm2f7j" }, "20": { defaultClass: "_1rsrm2f7k" }, "24": { defaultClass: "_1rsrm2f7l" }, "28": { defaultClass: "_1rsrm2f7m" }, "30": { defaultClass: "_1rsrm2f7n" }, "32": { defaultClass: "_1rsrm2f7o" }, "34": { defaultClass: "_1rsrm2f7p" }, "36": { defaultClass: "_1rsrm2f7q" }, "40": { defaultClass: "_1rsrm2f7r" }, "44": { defaultClass: "_1rsrm2f7s" }, "48": { defaultClass: "_1rsrm2f7t" }, "50": { defaultClass: "_1rsrm2f7u" }, "54": { defaultClass: "_1rsrm2f7v" }, "57": { defaultClass: "_1rsrm2f7w" }, "60": { defaultClass: "_1rsrm2f7x" }, "72": { defaultClass: "_1rsrm2f7y" }, "93": { defaultClass: "_1rsrm2f7z" }, "96": { defaultClass: "_1rsrm2f80" }, "100": { defaultClass: "_1rsrm2f81" }, "108": { defaultClass: "_1rsrm2f82" }, "120": { defaultClass: "_1rsrm2f83" }, "180": { defaultClass: "_1rsrm2f84" }, "200": { defaultClass: "_1rsrm2f85" }, "240": { defaultClass: "_1rsrm2f86" }, half: { defaultClass: "_1rsrm2f87" }, full: { defaultClass: "_1rsrm2f88" }, max: { defaultClass: "_1rsrm2f89" } } }, maxHeight: { values: { "1": { defaultClass: "_1rsrm2f8a" }, "2": { defaultClass: "_1rsrm2f8b" }, "4": { defaultClass: "_1rsrm2f8c" }, "8": { defaultClass: "_1rsrm2f8d" }, "10": { defaultClass: "_1rsrm2f8e" }, "11": { defaultClass: "_1rsrm2f8f" }, "12": { defaultClass: "_1rsrm2f8g" }, "13": { defaultClass: "_1rsrm2f8h" }, "14": { defaultClass: "_1rsrm2f8i" }, "15": { defaultClass: "_1rsrm2f8j" }, "16": { defaultClass: "_1rsrm2f8k" }, "18": { defaultClass: "_1rsrm2f8l" }, "20": { defaultClass: "_1rsrm2f8m" }, "24": { defaultClass: "_1rsrm2f8n" }, "28": { defaultClass: "_1rsrm2f8o" }, "30": { defaultClass: "_1rsrm2f8p" }, "32": { defaultClass: "_1rsrm2f8q" }, "34": { defaultClass: "_1rsrm2f8r" }, "36": { defaultClass: "_1rsrm2f8s" }, "40": { defaultClass: "_1rsrm2f8t" }, "44": { defaultClass: "_1rsrm2f8u" }, "48": { defaultClass: "_1rsrm2f8v" }, "50": { defaultClass: "_1rsrm2f8w" }, "54": { defaultClass: "_1rsrm2f8x" }, "57": { defaultClass: "_1rsrm2f8y" }, "60": { defaultClass: "_1rsrm2f8z" }, "72": { defaultClass: "_1rsrm2f90" }, "93": { defaultClass: "_1rsrm2f91" }, "96": { defaultClass: "_1rsrm2f92" }, "100": { defaultClass: "_1rsrm2f93" }, "108": { defaultClass: "_1rsrm2f94" }, "120": { defaultClass: "_1rsrm2f95" }, "180": { defaultClass: "_1rsrm2f96" }, "200": { defaultClass: "_1rsrm2f97" }, "240": { defaultClass: "_1rsrm2f98" }, half: { defaultClass: "_1rsrm2f99" }, full: { defaultClass: "_1rsrm2f9a" }, max: { defaultClass: "_1rsrm2f9b" } } }, maxWidth: { values: { "1": { defaultClass: "_1rsrm2f9c" }, "2": { defaultClass: "_1rsrm2f9d" }, "4": { defaultClass: "_1rsrm2f9e" }, "8": { defaultClass: "_1rsrm2f9f" }, "10": { defaultClass: "_1rsrm2f9g" }, "11": { defaultClass: "_1rsrm2f9h" }, "12": { defaultClass: "_1rsrm2f9i" }, "13": { defaultClass: "_1rsrm2f9j" }, "14": { defaultClass: "_1rsrm2f9k" }, "15": { defaultClass: "_1rsrm2f9l" }, "16": { defaultClass: "_1rsrm2f9m" }, "18": { defaultClass: "_1rsrm2f9n" }, "20": { defaultClass: "_1rsrm2f9o" }, "24": { defaultClass: "_1rsrm2f9p" }, "28": { defaultClass: "_1rsrm2f9q" }, "30": { defaultClass: "_1rsrm2f9r" }, "32": { defaultClass: "_1rsrm2f9s" }, "34": { defaultClass: "_1rsrm2f9t" }, "36": { defaultClass: "_1rsrm2f9u" }, "40": { defaultClass: "_1rsrm2f9v" }, "44": { defaultClass: "_1rsrm2f9w" }, "48": { defaultClass: "_1rsrm2f9x" }, "50": { defaultClass: "_1rsrm2f9y" }, "54": { defaultClass: "_1rsrm2f9z" }, "57": { defaultClass: "_1rsrm2fa0" }, "60": { defaultClass: "_1rsrm2fa1" }, "72": { defaultClass: "_1rsrm2fa2" }, "93": { defaultClass: "_1rsrm2fa3" }, "96": { defaultClass: "_1rsrm2fa4" }, "100": { defaultClass: "_1rsrm2fa5" }, "108": { defaultClass: "_1rsrm2fa6" }, "120": { defaultClass: "_1rsrm2fa7" }, "180": { defaultClass: "_1rsrm2fa8" }, "200": { defaultClass: "_1rsrm2fa9" }, "240": { defaultClass: "_1rsrm2faa" }, half: { defaultClass: "_1rsrm2fab" }, full: { defaultClass: "_1rsrm2fac" }, max: { defaultClass: "_1rsrm2fad" } } }, minWidth: { values: { "1": { defaultClass: "_1rsrm2fae" }, "2": { defaultClass: "_1rsrm2faf" }, "4": { defaultClass: "_1rsrm2fag" }, "8": { defaultClass: "_1rsrm2fah" }, "10": { defaultClass: "_1rsrm2fai" }, "11": { defaultClass: "_1rsrm2faj" }, "12": { defaultClass: "_1rsrm2fak" }, "13": { defaultClass: "_1rsrm2fal" }, "14": { defaultClass: "_1rsrm2fam" }, "15": { defaultClass: "_1rsrm2fan" }, "16": { defaultClass: "_1rsrm2fao" }, "18": { defaultClass: "_1rsrm2fap" }, "20": { defaultClass: "_1rsrm2faq" }, "24": { defaultClass: "_1rsrm2far" }, "28": { defaultClass: "_1rsrm2fas" }, "30": { defaultClass: "_1rsrm2fat" }, "32": { defaultClass: "_1rsrm2fau" }, "34": { defaultClass: "_1rsrm2fav" }, "36": { defaultClass: "_1rsrm2faw" }, "40": { defaultClass: "_1rsrm2fax" }, "44": { defaultClass: "_1rsrm2fay" }, "48": { defaultClass: "_1rsrm2faz" }, "50": { defaultClass: "_1rsrm2fb0" }, "54": { defaultClass: "_1rsrm2fb1" }, "57": { defaultClass: "_1rsrm2fb2" }, "60": { defaultClass: "_1rsrm2fb3" }, "72": { defaultClass: "_1rsrm2fb4" }, "93": { defaultClass: "_1rsrm2fb5" }, "96": { defaultClass: "_1rsrm2fb6" }, "100": { defaultClass: "_1rsrm2fb7" }, "108": { defaultClass: "_1rsrm2fb8" }, "120": { defaultClass: "_1rsrm2fb9" }, "180": { defaultClass: "_1rsrm2fba" }, "200": { defaultClass: "_1rsrm2fbb" }, "240": { defaultClass: "_1rsrm2fbc" }, half: { defaultClass: "_1rsrm2fbd" }, full: { defaultClass: "_1rsrm2fbe" }, max: { defaultClass: "_1rsrm2fbf" } } }, overflow: { values: { hidden: { defaultClass: "_1rsrm2fbg" } } }, paddingBottom: { values: { "0": { defaultClass: "_1rsrm2fbh" }, "1": { defaultClass: "_1rsrm2fbi" }, "2": { defaultClass: "_1rsrm2fbj" }, "3": { defaultClass: "_1rsrm2fbk" }, "4": { defaultClass: "_1rsrm2fbl" }, "5": { defaultClass: "_1rsrm2fbm" }, "6": { defaultClass: "_1rsrm2fbn" }, "7": { defaultClass: "_1rsrm2fbo" }, "8": { defaultClass: "_1rsrm2fbp" }, "9": { defaultClass: "_1rsrm2fbq" }, "10": { defaultClass: "_1rsrm2fbr" }, "11": { defaultClass: "_1rsrm2fbs" }, "12": { defaultClass: "_1rsrm2fbt" }, "13": { defaultClass: "_1rsrm2fbu" }, "14": { defaultClass: "_1rsrm2fbv" }, "15": { defaultClass: "_1rsrm2fbw" }, "16": { defaultClass: "_1rsrm2fbx" }, "18": { defaultClass: "_1rsrm2fby" }, "20": { defaultClass: "_1rsrm2fbz" }, "24": { defaultClass: "_1rsrm2fc0" }, "28": { defaultClass: "_1rsrm2fc1" }, "30": { defaultClass: "_1rsrm2fc2" }, "32": { defaultClass: "_1rsrm2fc3" }, "36": { defaultClass: "_1rsrm2fc4" }, "44": { defaultClass: "_1rsrm2fc5" }, "64": { defaultClass: "_1rsrm2fc6" }, "-1": { defaultClass: "_1rsrm2fc7" } } }, paddingLeft: { values: { "0": { defaultClass: "_1rsrm2fc8" }, "1": { defaultClass: "_1rsrm2fc9" }, "2": { defaultClass: "_1rsrm2fca" }, "3": { defaultClass: "_1rsrm2fcb" }, "4": { defaultClass: "_1rsrm2fcc" }, "5": { defaultClass: "_1rsrm2fcd" }, "6": { defaultClass: "_1rsrm2fce" }, "7": { defaultClass: "_1rsrm2fcf" }, "8": { defaultClass: "_1rsrm2fcg" }, "9": { defaultClass: "_1rsrm2fch" }, "10": { defaultClass: "_1rsrm2fci" }, "11": { defaultClass: "_1rsrm2fcj" }, "12": { defaultClass: "_1rsrm2fck" }, "13": { defaultClass: "_1rsrm2fcl" }, "14": { defaultClass: "_1rsrm2fcm" }, "15": { defaultClass: "_1rsrm2fcn" }, "16": { defaultClass: "_1rsrm2fco" }, "18": { defaultClass: "_1rsrm2fcp" }, "20": { defaultClass: "_1rsrm2fcq" }, "24": { defaultClass: "_1rsrm2fcr" }, "28": { defaultClass: "_1rsrm2fcs" }, "30": { defaultClass: "_1rsrm2fct" }, "32": { defaultClass: "_1rsrm2fcu" }, "36": { defaultClass: "_1rsrm2fcv" }, "44": { defaultClass: "_1rsrm2fcw" }, "64": { defaultClass: "_1rsrm2fcx" }, "-1": { defaultClass: "_1rsrm2fcy" } } }, paddingRight: { values: { "0": { defaultClass: "_1rsrm2fcz" }, "1": { defaultClass: "_1rsrm2fd0" }, "2": { defaultClass: "_1rsrm2fd1" }, "3": { defaultClass: "_1rsrm2fd2" }, "4": { defaultClass: "_1rsrm2fd3" }, "5": { defaultClass: "_1rsrm2fd4" }, "6": { defaultClass: "_1rsrm2fd5" }, "7": { defaultClass: "_1rsrm2fd6" }, "8": { defaultClass: "_1rsrm2fd7" }, "9": { defaultClass: "_1rsrm2fd8" }, "10": { defaultClass: "_1rsrm2fd9" }, "11": { defaultClass: "_1rsrm2fda" }, "12": { defaultClass: "_1rsrm2fdb" }, "13": { defaultClass: "_1rsrm2fdc" }, "14": { defaultClass: "_1rsrm2fdd" }, "15": { defaultClass: "_1rsrm2fde" }, "16": { defaultClass: "_1rsrm2fdf" }, "18": { defaultClass: "_1rsrm2fdg" }, "20": { defaultClass: "_1rsrm2fdh" }, "24": { defaultClass: "_1rsrm2fdi" }, "28": { defaultClass: "_1rsrm2fdj" }, "30": { defaultClass: "_1rsrm2fdk" }, "32": { defaultClass: "_1rsrm2fdl" }, "36": { defaultClass: "_1rsrm2fdm" }, "44": { defaultClass: "_1rsrm2fdn" }, "64": { defaultClass: "_1rsrm2fdo" }, "-1": { defaultClass: "_1rsrm2fdp" } } }, paddingTop: { values: { "0": { defaultClass: "_1rsrm2fdq" }, "1": { defaultClass: "_1rsrm2fdr" }, "2": { defaultClass: "_1rsrm2fds" }, "3": { defaultClass: "_1rsrm2fdt" }, "4": { defaultClass: "_1rsrm2fdu" }, "5": { defaultClass: "_1rsrm2fdv" }, "6": { defaultClass: "_1rsrm2fdw" }, "7": { defaultClass: "_1rsrm2fdx" }, "8": { defaultClass: "_1rsrm2fdy" }, "9": { defaultClass: "_1rsrm2fdz" }, "10": { defaultClass: "_1rsrm2fe0" }, "11": { defaultClass: "_1rsrm2fe1" }, "12": { defaultClass: "_1rsrm2fe2" }, "13": { defaultClass: "_1rsrm2fe3" }, "14": { defaultClass: "_1rsrm2fe4" }, "15": { defaultClass: "_1rsrm2fe5" }, "16": { defaultClass: "_1rsrm2fe6" }, "18": { defaultClass: "_1rsrm2fe7" }, "20": { defaultClass: "_1rsrm2fe8" }, "24": { defaultClass: "_1rsrm2fe9" }, "28": { defaultClass: "_1rsrm2fea" }, "30": { defaultClass: "_1rsrm2feb" }, "32": { defaultClass: "_1rsrm2fec" }, "36": { defaultClass: "_1rsrm2fed" }, "44": { defaultClass: "_1rsrm2fee" }, "64": { defaultClass: "_1rsrm2fef" }, "-1": { defaultClass: "_1rsrm2feg" } } }, position: { values: { absolute: { defaultClass: "_1rsrm2feh" }, fixed: { defaultClass: "_1rsrm2fei" }, relative: { defaultClass: "_1rsrm2fej" } } }, right: { values: { "0": { defaultClass: "_1rsrm2fek" } } }, transition: { values: { "default": { defaultClass: "_1rsrm2fel" }, transform: { defaultClass: "_1rsrm2fem" } } }, userSelect: { values: { none: { defaultClass: "_1rsrm2fen" } } }, width: { values: { "1": { defaultClass: "_1rsrm2feo" }, "2": { defaultClass: "_1rsrm2fep" }, "4": { defaultClass: "_1rsrm2feq" }, "8": { defaultClass: "_1rsrm2fer" }, "10": { defaultClass: "_1rsrm2fes" }, "11": { defaultClass: "_1rsrm2fet" }, "12": { defaultClass: "_1rsrm2feu" }, "13": { defaultClass: "_1rsrm2fev" }, "14": { defaultClass: "_1rsrm2few" }, "15": { defaultClass: "_1rsrm2fex" }, "16": { defaultClass: "_1rsrm2fey" }, "18": { defaultClass: "_1rsrm2fez" }, "20": { defaultClass: "_1rsrm2ff0" }, "24": { defaultClass: "_1rsrm2ff1" }, "28": { defaultClass: "_1rsrm2ff2" }, "30": { defaultClass: "_1rsrm2ff3" }, "32": { defaultClass: "_1rsrm2ff4" }, "34": { defaultClass: "_1rsrm2ff5" }, "36": { defaultClass: "_1rsrm2ff6" }, "40": { defaultClass: "_1rsrm2ff7" }, "44": { defaultClass: "_1rsrm2ff8" }, "48": { defaultClass: "_1rsrm2ff9" }, "50": { defaultClass: "_1rsrm2ffa" }, "54": { defaultClass: "_1rsrm2ffb" }, "57": { defaultClass: "_1rsrm2ffc" }, "60": { defaultClass: "_1rsrm2ffd" }, "72": { defaultClass: "_1rsrm2ffe" }, "93": { defaultClass: "_1rsrm2fff" }, "96": { defaultClass: "_1rsrm2ffg" }, "100": { defaultClass: "_1rsrm2ffh" }, "108": { defaultClass: "_1rsrm2ffi" }, "120": { defaultClass: "_1rsrm2ffj" }, "180": { defaultClass: "_1rsrm2ffk" }, "200": { defaultClass: "_1rsrm2ffl" }, "240": { defaultClass: "_1rsrm2ffm" }, half: { defaultClass: "_1rsrm2ffn" }, full: { defaultClass: "_1rsrm2ffo" }, max: { defaultClass: "_1rsrm2ffp" } } }, backdropFilter: { values: { modalOverlay: { defaultClass: "_1rsrm2ffq" } } } } });
47
- var themeVars = { colors: { accentColor: "var(--rk-colors-accentColor)", accentColorForeground: "var(--rk-colors-accentColorForeground)", actionButtonBorder: "var(--rk-colors-actionButtonBorder)", connectButtonBackground: "var(--rk-colors-connectButtonBackground)", connectButtonBackgroundError: "var(--rk-colors-connectButtonBackgroundError)", connectButtonText: "var(--rk-colors-connectButtonText)", connectButtonTextError: "var(--rk-colors-connectButtonTextError)", connectionIndicator: "var(--rk-colors-connectionIndicator)", error: "var(--rk-colors-error)", errorBackground: "var(--rk-colors-errorBackground)", errorBorder: "var(--rk-colors-errorBorder)", generalBorder: "var(--rk-colors-generalBorder)", generalBorderDim: "var(--rk-colors-generalBorderDim)", menuItemBackground: "var(--rk-colors-menuItemBackground)", selectedOptionBorder: "var(--rk-colors-selectedOptionBorder)", focusedOptionBorder: "var(--rk-colors-focusedOptionBorder)", standby: "var(--rk-colors-standby)", success: "var(--rk-colors-success)", chainIconBorder: "var(--rk-colors-chainIconBorder)", modalBackdrop: "var(--rk-colors-modalBackdrop)", modalBackground: "var(--rk-colors-modalBackground)", modalBorder: "var(--rk-colors-modalBorder)", offBackground: "var(--rk-colors-offBackground)", offBackgroundComplimentary: "var(--rk-colors-offBackgroundComplimentary)", hoverState: "var(--rk-colors-hoverState)", lightStroke: "var(--rk-colors-lightStroke)", mediumStroke: "var(--rk-colors-mediumStroke)", heavyStroke: "var(--rk-colors-heavyStroke)", strokeColor: "var(--rk-colors-strokeColor)", dydxSwitchActiveBackground: "var(--rk-colors-dydxSwitchActiveBackground)", primaryText: "var(--rk-colors-primaryText)", secondaryText: "var(--rk-colors-secondaryText)", tertiaryText: "var(--rk-colors-tertiaryText)", textSelection: "var(--rk-colors-textSelection)", inputBackground: "var(--rk-colors-inputBackground)", inputBorderBase: "var(--rk-colors-inputBorderBase)", inputBorderHover: "var(--rk-colors-inputBorderHover)", actionColor: "var(--rk-colors-actionColor)", actionColorHover: "var(--rk-colors-actionColorHover)", actionColorDisabled: "var(--rk-colors-actionColorDisabled)", buttonPrimary: "var(--rk-colors-buttonPrimary)", buttonDisabled: "var(--rk-colors-buttonDisabled)", buttonWarning: "var(--rk-colors-buttonWarning)", buttonSuccess: "var(--rk-colors-buttonSuccess)", buttonTextPrimary: "var(--rk-colors-buttonTextPrimary)", buttonTextDisabled: "var(--rk-colors-buttonTextDisabled)", transparent: "var(--rk-colors-transparent)", buttonBackgroundTertiary: "var(--rk-colors-buttonBackgroundTertiary)", buttonBackgroundHoverTertiary: "var(--rk-colors-buttonBackgroundHoverTertiary)", buttonTextTertiary: "var(--rk-colors-buttonTextTertiary)", buttonTextDisabledTertiary: "var(--rk-colors-buttonTextDisabledTertiary)", buttonStrokeTertiary: "var(--rk-colors-buttonStrokeTertiary)", buttonBackground: "var(--rk-colors-buttonBackground)", buttonBackgroundHover: "var(--rk-colors-buttonBackgroundHover)", buttonBackgroundDisabled: "var(--rk-colors-buttonBackgroundDisabled)", buttonStroke: "var(--rk-colors-buttonStroke)", buttonTextSecondaryDisabled: "var(--rk-colors-buttonTextSecondaryDisabled)", buttonTextSecondary: "var(--rk-colors-buttonTextSecondary)", buttonIconBackgroundHover: "var(--rk-colors-buttonIconBackgroundHover)", buttonIconBackgroundPressed: "var(--rk-colors-buttonIconBackgroundPressed)", buttonIconStroke: "var(--rk-colors-buttonIconStroke)", badgeBackgroundSuccess: "var(--rk-colors-badgeBackgroundSuccess)", badgeBorderSuccess: "var(--rk-colors-badgeBorderSuccess)", badgeTextSuccess: "var(--rk-colors-badgeTextSuccess)", announceGradientFrom: "var(--rk-colors-announceGradientFrom)", announceGradientTo: "var(--rk-colors-announceGradientTo)" }, fonts: { body: "var(--rk-fonts-body)" }, fontWeight: { regular: "var(--rk-fontWeight-regular)", medium: "var(--rk-fontWeight-medium)", semibold: "var(--rk-fontWeight-semibold)", bold: "var(--rk-fontWeight-bold)", heavy: "var(--rk-fontWeight-heavy)" }, fontSize: { "10": { fontSize: "var(--rk-fontSize-10-fontSize)", lineHeight: "var(--rk-fontSize-10-lineHeight)" }, "12": { fontSize: "var(--rk-fontSize-12-fontSize)", lineHeight: "var(--rk-fontSize-12-lineHeight)" }, "13": { fontSize: "var(--rk-fontSize-13-fontSize)", lineHeight: "var(--rk-fontSize-13-lineHeight)" }, "14": { fontSize: "var(--rk-fontSize-14-fontSize)", lineHeight: "var(--rk-fontSize-14-lineHeight)" }, "16": { fontSize: "var(--rk-fontSize-16-fontSize)", lineHeight: "var(--rk-fontSize-16-lineHeight)" }, "18": { fontSize: "var(--rk-fontSize-18-fontSize)", lineHeight: "var(--rk-fontSize-18-lineHeight)" }, "20": { fontSize: "var(--rk-fontSize-20-fontSize)", lineHeight: "var(--rk-fontSize-20-lineHeight)" }, "21": { fontSize: "var(--rk-fontSize-21-fontSize)", lineHeight: "var(--rk-fontSize-21-lineHeight)" }, "40": { fontSize: "var(--rk-fontSize-40-fontSize)", lineHeight: "var(--rk-fontSize-40-lineHeight)" }, "57": { fontSize: "var(--rk-fontSize-57-fontSize)", lineHeight: "var(--rk-fontSize-57-lineHeight)" } }, radii: { actionButton: "var(--rk-radii-actionButton)", connectButton: "var(--rk-radii-connectButton)", menuButton: "var(--rk-radii-menuButton)", modal: "var(--rk-radii-modal)", modalMobile: "var(--rk-radii-modalMobile)", modalActionButton: "var(--rk-radii-modalActionButton)", modalActionButtonMobile: "var(--rk-radii-modalActionButtonMobile)" }, shadows: { connectButton: "var(--rk-shadows-connectButton)", dialog: "var(--rk-shadows-dialog)", selectedOption: "var(--rk-shadows-selectedOption)", selectedWallet: "var(--rk-shadows-selectedWallet)", dropdown: "var(--rk-shadows-dropdown)", notification: "var(--rk-shadows-notification)", vertexDropdown: "var(--rk-shadows-vertexDropdown)" }, blurs: { modalOverlay: "var(--rk-blurs-modalOverlay)" }, moonpayTheme: "var(--rk-moonpayTheme)" };
46
+ var sprinkles = _ad221({ conditions: { defaultCondition: "base", conditionNames: ["base", "hover", "active", "selection", "focused", "focusedVisible"], responsiveArray: void 0 }, styles: { background: { values: { accentColor: { conditions: { base: "_1rsrm2ffr", hover: "_1rsrm2ffs", active: "_1rsrm2fft", selection: "_1rsrm2ffu", focused: "_1rsrm2ffv", focusedVisible: "_1rsrm2ffw" }, defaultClass: "_1rsrm2ffr" }, accentColorForeground: { conditions: { base: "_1rsrm2ffx", hover: "_1rsrm2ffy", active: "_1rsrm2ffz", selection: "_1rsrm2fg0", focused: "_1rsrm2fg1", focusedVisible: "_1rsrm2fg2" }, defaultClass: "_1rsrm2ffx" }, actionButtonBorder: { conditions: { base: "_1rsrm2fg3", hover: "_1rsrm2fg4", active: "_1rsrm2fg5", selection: "_1rsrm2fg6", focused: "_1rsrm2fg7", focusedVisible: "_1rsrm2fg8" }, defaultClass: "_1rsrm2fg3" }, connectButtonBackground: { conditions: { base: "_1rsrm2fg9", hover: "_1rsrm2fga", active: "_1rsrm2fgb", selection: "_1rsrm2fgc", focused: "_1rsrm2fgd", focusedVisible: "_1rsrm2fge" }, defaultClass: "_1rsrm2fg9" }, connectButtonBackgroundError: { conditions: { base: "_1rsrm2fgf", hover: "_1rsrm2fgg", active: "_1rsrm2fgh", selection: "_1rsrm2fgi", focused: "_1rsrm2fgj", focusedVisible: "_1rsrm2fgk" }, defaultClass: "_1rsrm2fgf" }, connectButtonText: { conditions: { base: "_1rsrm2fgl", hover: "_1rsrm2fgm", active: "_1rsrm2fgn", selection: "_1rsrm2fgo", focused: "_1rsrm2fgp", focusedVisible: "_1rsrm2fgq" }, defaultClass: "_1rsrm2fgl" }, connectButtonTextError: { conditions: { base: "_1rsrm2fgr", hover: "_1rsrm2fgs", active: "_1rsrm2fgt", selection: "_1rsrm2fgu", focused: "_1rsrm2fgv", focusedVisible: "_1rsrm2fgw" }, defaultClass: "_1rsrm2fgr" }, connectionIndicator: { conditions: { base: "_1rsrm2fgx", hover: "_1rsrm2fgy", active: "_1rsrm2fgz", selection: "_1rsrm2fh0", focused: "_1rsrm2fh1", focusedVisible: "_1rsrm2fh2" }, defaultClass: "_1rsrm2fgx" }, error: { conditions: { base: "_1rsrm2fh3", hover: "_1rsrm2fh4", active: "_1rsrm2fh5", selection: "_1rsrm2fh6", focused: "_1rsrm2fh7", focusedVisible: "_1rsrm2fh8" }, defaultClass: "_1rsrm2fh3" }, errorBackground: { conditions: { base: "_1rsrm2fh9", hover: "_1rsrm2fha", active: "_1rsrm2fhb", selection: "_1rsrm2fhc", focused: "_1rsrm2fhd", focusedVisible: "_1rsrm2fhe" }, defaultClass: "_1rsrm2fh9" }, errorBorder: { conditions: { base: "_1rsrm2fhf", hover: "_1rsrm2fhg", active: "_1rsrm2fhh", selection: "_1rsrm2fhi", focused: "_1rsrm2fhj", focusedVisible: "_1rsrm2fhk" }, defaultClass: "_1rsrm2fhf" }, generalBorder: { conditions: { base: "_1rsrm2fhl", hover: "_1rsrm2fhm", active: "_1rsrm2fhn", selection: "_1rsrm2fho", focused: "_1rsrm2fhp", focusedVisible: "_1rsrm2fhq" }, defaultClass: "_1rsrm2fhl" }, generalBorderDim: { conditions: { base: "_1rsrm2fhr", hover: "_1rsrm2fhs", active: "_1rsrm2fht", selection: "_1rsrm2fhu", focused: "_1rsrm2fhv", focusedVisible: "_1rsrm2fhw" }, defaultClass: "_1rsrm2fhr" }, menuItemBackground: { conditions: { base: "_1rsrm2fhx", hover: "_1rsrm2fhy", active: "_1rsrm2fhz", selection: "_1rsrm2fi0", focused: "_1rsrm2fi1", focusedVisible: "_1rsrm2fi2" }, defaultClass: "_1rsrm2fhx" }, selectedOptionBorder: { conditions: { base: "_1rsrm2fi3", hover: "_1rsrm2fi4", active: "_1rsrm2fi5", selection: "_1rsrm2fi6", focused: "_1rsrm2fi7", focusedVisible: "_1rsrm2fi8" }, defaultClass: "_1rsrm2fi3" }, focusedOptionBorder: { conditions: { base: "_1rsrm2fi9", hover: "_1rsrm2fia", active: "_1rsrm2fib", selection: "_1rsrm2fic", focused: "_1rsrm2fid", focusedVisible: "_1rsrm2fie" }, defaultClass: "_1rsrm2fi9" }, standby: { conditions: { base: "_1rsrm2fif", hover: "_1rsrm2fig", active: "_1rsrm2fih", selection: "_1rsrm2fii", focused: "_1rsrm2fij", focusedVisible: "_1rsrm2fik" }, defaultClass: "_1rsrm2fif" }, success: { conditions: { base: "_1rsrm2fil", hover: "_1rsrm2fim", active: "_1rsrm2fin", selection: "_1rsrm2fio", focused: "_1rsrm2fip", focusedVisible: "_1rsrm2fiq" }, defaultClass: "_1rsrm2fil" }, chainIconBorder: { conditions: { base: "_1rsrm2fir", hover: "_1rsrm2fis", active: "_1rsrm2fit", selection: "_1rsrm2fiu", focused: "_1rsrm2fiv", focusedVisible: "_1rsrm2fiw" }, defaultClass: "_1rsrm2fir" }, modalBackdrop: { conditions: { base: "_1rsrm2fix", hover: "_1rsrm2fiy", active: "_1rsrm2fiz", selection: "_1rsrm2fj0", focused: "_1rsrm2fj1", focusedVisible: "_1rsrm2fj2" }, defaultClass: "_1rsrm2fix" }, modalBackground: { conditions: { base: "_1rsrm2fj3", hover: "_1rsrm2fj4", active: "_1rsrm2fj5", selection: "_1rsrm2fj6", focused: "_1rsrm2fj7", focusedVisible: "_1rsrm2fj8" }, defaultClass: "_1rsrm2fj3" }, modalBorder: { conditions: { base: "_1rsrm2fj9", hover: "_1rsrm2fja", active: "_1rsrm2fjb", selection: "_1rsrm2fjc", focused: "_1rsrm2fjd", focusedVisible: "_1rsrm2fje" }, defaultClass: "_1rsrm2fj9" }, offBackground: { conditions: { base: "_1rsrm2fjf", hover: "_1rsrm2fjg", active: "_1rsrm2fjh", selection: "_1rsrm2fji", focused: "_1rsrm2fjj", focusedVisible: "_1rsrm2fjk" }, defaultClass: "_1rsrm2fjf" }, offBackgroundComplimentary: { conditions: { base: "_1rsrm2fjl", hover: "_1rsrm2fjm", active: "_1rsrm2fjn", selection: "_1rsrm2fjo", focused: "_1rsrm2fjp", focusedVisible: "_1rsrm2fjq" }, defaultClass: "_1rsrm2fjl" }, hoverState: { conditions: { base: "_1rsrm2fjr", hover: "_1rsrm2fjs", active: "_1rsrm2fjt", selection: "_1rsrm2fju", focused: "_1rsrm2fjv", focusedVisible: "_1rsrm2fjw" }, defaultClass: "_1rsrm2fjr" }, lightStroke: { conditions: { base: "_1rsrm2fjx", hover: "_1rsrm2fjy", active: "_1rsrm2fjz", selection: "_1rsrm2fk0", focused: "_1rsrm2fk1", focusedVisible: "_1rsrm2fk2" }, defaultClass: "_1rsrm2fjx" }, mediumStroke: { conditions: { base: "_1rsrm2fk3", hover: "_1rsrm2fk4", active: "_1rsrm2fk5", selection: "_1rsrm2fk6", focused: "_1rsrm2fk7", focusedVisible: "_1rsrm2fk8" }, defaultClass: "_1rsrm2fk3" }, heavyStroke: { conditions: { base: "_1rsrm2fk9", hover: "_1rsrm2fka", active: "_1rsrm2fkb", selection: "_1rsrm2fkc", focused: "_1rsrm2fkd", focusedVisible: "_1rsrm2fke" }, defaultClass: "_1rsrm2fk9" }, strokeColor: { conditions: { base: "_1rsrm2fkf", hover: "_1rsrm2fkg", active: "_1rsrm2fkh", selection: "_1rsrm2fki", focused: "_1rsrm2fkj", focusedVisible: "_1rsrm2fkk" }, defaultClass: "_1rsrm2fkf" }, dydxSwitchActiveBackground: { conditions: { base: "_1rsrm2fkl", hover: "_1rsrm2fkm", active: "_1rsrm2fkn", selection: "_1rsrm2fko", focused: "_1rsrm2fkp", focusedVisible: "_1rsrm2fkq" }, defaultClass: "_1rsrm2fkl" }, primaryText: { conditions: { base: "_1rsrm2fkr", hover: "_1rsrm2fks", active: "_1rsrm2fkt", selection: "_1rsrm2fku", focused: "_1rsrm2fkv", focusedVisible: "_1rsrm2fkw" }, defaultClass: "_1rsrm2fkr" }, secondaryText: { conditions: { base: "_1rsrm2fkx", hover: "_1rsrm2fky", active: "_1rsrm2fkz", selection: "_1rsrm2fl0", focused: "_1rsrm2fl1", focusedVisible: "_1rsrm2fl2" }, defaultClass: "_1rsrm2fkx" }, tertiaryText: { conditions: { base: "_1rsrm2fl3", hover: "_1rsrm2fl4", active: "_1rsrm2fl5", selection: "_1rsrm2fl6", focused: "_1rsrm2fl7", focusedVisible: "_1rsrm2fl8" }, defaultClass: "_1rsrm2fl3" }, textSelection: { conditions: { base: "_1rsrm2fl9", hover: "_1rsrm2fla", active: "_1rsrm2flb", selection: "_1rsrm2flc", focused: "_1rsrm2fld", focusedVisible: "_1rsrm2fle" }, defaultClass: "_1rsrm2fl9" }, inputBackground: { conditions: { base: "_1rsrm2flf", hover: "_1rsrm2flg", active: "_1rsrm2flh", selection: "_1rsrm2fli", focused: "_1rsrm2flj", focusedVisible: "_1rsrm2flk" }, defaultClass: "_1rsrm2flf" }, inputBorderBase: { conditions: { base: "_1rsrm2fll", hover: "_1rsrm2flm", active: "_1rsrm2fln", selection: "_1rsrm2flo", focused: "_1rsrm2flp", focusedVisible: "_1rsrm2flq" }, defaultClass: "_1rsrm2fll" }, inputBorderHover: { conditions: { base: "_1rsrm2flr", hover: "_1rsrm2fls", active: "_1rsrm2flt", selection: "_1rsrm2flu", focused: "_1rsrm2flv", focusedVisible: "_1rsrm2flw" }, defaultClass: "_1rsrm2flr" }, actionColor: { conditions: { base: "_1rsrm2flx", hover: "_1rsrm2fly", active: "_1rsrm2flz", selection: "_1rsrm2fm0", focused: "_1rsrm2fm1", focusedVisible: "_1rsrm2fm2" }, defaultClass: "_1rsrm2flx" }, actionColorHover: { conditions: { base: "_1rsrm2fm3", hover: "_1rsrm2fm4", active: "_1rsrm2fm5", selection: "_1rsrm2fm6", focused: "_1rsrm2fm7", focusedVisible: "_1rsrm2fm8" }, defaultClass: "_1rsrm2fm3" }, actionColorDisabled: { conditions: { base: "_1rsrm2fm9", hover: "_1rsrm2fma", active: "_1rsrm2fmb", selection: "_1rsrm2fmc", focused: "_1rsrm2fmd", focusedVisible: "_1rsrm2fme" }, defaultClass: "_1rsrm2fm9" }, buttonPrimary: { conditions: { base: "_1rsrm2fmf", hover: "_1rsrm2fmg", active: "_1rsrm2fmh", selection: "_1rsrm2fmi", focused: "_1rsrm2fmj", focusedVisible: "_1rsrm2fmk" }, defaultClass: "_1rsrm2fmf" }, buttonDisabled: { conditions: { base: "_1rsrm2fml", hover: "_1rsrm2fmm", active: "_1rsrm2fmn", selection: "_1rsrm2fmo", focused: "_1rsrm2fmp", focusedVisible: "_1rsrm2fmq" }, defaultClass: "_1rsrm2fml" }, buttonWarning: { conditions: { base: "_1rsrm2fmr", hover: "_1rsrm2fms", active: "_1rsrm2fmt", selection: "_1rsrm2fmu", focused: "_1rsrm2fmv", focusedVisible: "_1rsrm2fmw" }, defaultClass: "_1rsrm2fmr" }, buttonSuccess: { conditions: { base: "_1rsrm2fmx", hover: "_1rsrm2fmy", active: "_1rsrm2fmz", selection: "_1rsrm2fn0", focused: "_1rsrm2fn1", focusedVisible: "_1rsrm2fn2" }, defaultClass: "_1rsrm2fmx" }, buttonTextPrimary: { conditions: { base: "_1rsrm2fn3", hover: "_1rsrm2fn4", active: "_1rsrm2fn5", selection: "_1rsrm2fn6", focused: "_1rsrm2fn7", focusedVisible: "_1rsrm2fn8" }, defaultClass: "_1rsrm2fn3" }, buttonTextDisabled: { conditions: { base: "_1rsrm2fn9", hover: "_1rsrm2fna", active: "_1rsrm2fnb", selection: "_1rsrm2fnc", focused: "_1rsrm2fnd", focusedVisible: "_1rsrm2fne" }, defaultClass: "_1rsrm2fn9" }, transparent: { conditions: { base: "_1rsrm2fnf", hover: "_1rsrm2fng", active: "_1rsrm2fnh", selection: "_1rsrm2fni", focused: "_1rsrm2fnj", focusedVisible: "_1rsrm2fnk" }, defaultClass: "_1rsrm2fnf" }, buttonBackgroundTertiary: { conditions: { base: "_1rsrm2fnl", hover: "_1rsrm2fnm", active: "_1rsrm2fnn", selection: "_1rsrm2fno", focused: "_1rsrm2fnp", focusedVisible: "_1rsrm2fnq" }, defaultClass: "_1rsrm2fnl" }, buttonBackgroundHoverTertiary: { conditions: { base: "_1rsrm2fnr", hover: "_1rsrm2fns", active: "_1rsrm2fnt", selection: "_1rsrm2fnu", focused: "_1rsrm2fnv", focusedVisible: "_1rsrm2fnw" }, defaultClass: "_1rsrm2fnr" }, buttonTextTertiary: { conditions: { base: "_1rsrm2fnx", hover: "_1rsrm2fny", active: "_1rsrm2fnz", selection: "_1rsrm2fo0", focused: "_1rsrm2fo1", focusedVisible: "_1rsrm2fo2" }, defaultClass: "_1rsrm2fnx" }, buttonTextDisabledTertiary: { conditions: { base: "_1rsrm2fo3", hover: "_1rsrm2fo4", active: "_1rsrm2fo5", selection: "_1rsrm2fo6", focused: "_1rsrm2fo7", focusedVisible: "_1rsrm2fo8" }, defaultClass: "_1rsrm2fo3" }, buttonStrokeTertiary: { conditions: { base: "_1rsrm2fo9", hover: "_1rsrm2foa", active: "_1rsrm2fob", selection: "_1rsrm2foc", focused: "_1rsrm2fod", focusedVisible: "_1rsrm2foe" }, defaultClass: "_1rsrm2fo9" }, buttonBackground: { conditions: { base: "_1rsrm2fof", hover: "_1rsrm2fog", active: "_1rsrm2foh", selection: "_1rsrm2foi", focused: "_1rsrm2foj", focusedVisible: "_1rsrm2fok" }, defaultClass: "_1rsrm2fof" }, buttonBackgroundHover: { conditions: { base: "_1rsrm2fol", hover: "_1rsrm2fom", active: "_1rsrm2fon", selection: "_1rsrm2foo", focused: "_1rsrm2fop", focusedVisible: "_1rsrm2foq" }, defaultClass: "_1rsrm2fol" }, buttonBackgroundDisabled: { conditions: { base: "_1rsrm2for", hover: "_1rsrm2fos", active: "_1rsrm2fot", selection: "_1rsrm2fou", focused: "_1rsrm2fov", focusedVisible: "_1rsrm2fow" }, defaultClass: "_1rsrm2for" }, buttonStroke: { conditions: { base: "_1rsrm2fox", hover: "_1rsrm2foy", active: "_1rsrm2foz", selection: "_1rsrm2fp0", focused: "_1rsrm2fp1", focusedVisible: "_1rsrm2fp2" }, defaultClass: "_1rsrm2fox" }, buttonTextSecondaryDisabled: { conditions: { base: "_1rsrm2fp3", hover: "_1rsrm2fp4", active: "_1rsrm2fp5", selection: "_1rsrm2fp6", focused: "_1rsrm2fp7", focusedVisible: "_1rsrm2fp8" }, defaultClass: "_1rsrm2fp3" }, buttonTextSecondary: { conditions: { base: "_1rsrm2fp9", hover: "_1rsrm2fpa", active: "_1rsrm2fpb", selection: "_1rsrm2fpc", focused: "_1rsrm2fpd", focusedVisible: "_1rsrm2fpe" }, defaultClass: "_1rsrm2fp9" }, buttonIconBackgroundHover: { conditions: { base: "_1rsrm2fpf", hover: "_1rsrm2fpg", active: "_1rsrm2fph", selection: "_1rsrm2fpi", focused: "_1rsrm2fpj", focusedVisible: "_1rsrm2fpk" }, defaultClass: "_1rsrm2fpf" }, buttonIconBackgroundPressed: { conditions: { base: "_1rsrm2fpl", hover: "_1rsrm2fpm", active: "_1rsrm2fpn", selection: "_1rsrm2fpo", focused: "_1rsrm2fpp", focusedVisible: "_1rsrm2fpq" }, defaultClass: "_1rsrm2fpl" }, buttonIconStroke: { conditions: { base: "_1rsrm2fpr", hover: "_1rsrm2fps", active: "_1rsrm2fpt", selection: "_1rsrm2fpu", focused: "_1rsrm2fpv", focusedVisible: "_1rsrm2fpw" }, defaultClass: "_1rsrm2fpr" }, badgeBackgroundSuccess: { conditions: { base: "_1rsrm2fpx", hover: "_1rsrm2fpy", active: "_1rsrm2fpz", selection: "_1rsrm2fq0", focused: "_1rsrm2fq1", focusedVisible: "_1rsrm2fq2" }, defaultClass: "_1rsrm2fpx" }, badgeBorderSuccess: { conditions: { base: "_1rsrm2fq3", hover: "_1rsrm2fq4", active: "_1rsrm2fq5", selection: "_1rsrm2fq6", focused: "_1rsrm2fq7", focusedVisible: "_1rsrm2fq8" }, defaultClass: "_1rsrm2fq3" }, badgeTextSuccess: { conditions: { base: "_1rsrm2fq9", hover: "_1rsrm2fqa", active: "_1rsrm2fqb", selection: "_1rsrm2fqc", focused: "_1rsrm2fqd", focusedVisible: "_1rsrm2fqe" }, defaultClass: "_1rsrm2fq9" }, inputAmountQuickOptionBaseBackground: { conditions: { base: "_1rsrm2fqf", hover: "_1rsrm2fqg", active: "_1rsrm2fqh", selection: "_1rsrm2fqi", focused: "_1rsrm2fqj", focusedVisible: "_1rsrm2fqk" }, defaultClass: "_1rsrm2fqf" }, inputAmountQuickOptionHoverBackground: { conditions: { base: "_1rsrm2fql", hover: "_1rsrm2fqm", active: "_1rsrm2fqn", selection: "_1rsrm2fqo", focused: "_1rsrm2fqp", focusedVisible: "_1rsrm2fqq" }, defaultClass: "_1rsrm2fql" }, inputAmountQuickOptionActiveBackground: { conditions: { base: "_1rsrm2fqr", hover: "_1rsrm2fqs", active: "_1rsrm2fqt", selection: "_1rsrm2fqu", focused: "_1rsrm2fqv", focusedVisible: "_1rsrm2fqw" }, defaultClass: "_1rsrm2fqr" }, inputAmountQuickOptionDisabledBackground: { conditions: { base: "_1rsrm2fqx", hover: "_1rsrm2fqy", active: "_1rsrm2fqz", selection: "_1rsrm2fr0", focused: "_1rsrm2fr1", focusedVisible: "_1rsrm2fr2" }, defaultClass: "_1rsrm2fqx" }, inputAmountQuickOptionBaseBorder: { conditions: { base: "_1rsrm2fr3", hover: "_1rsrm2fr4", active: "_1rsrm2fr5", selection: "_1rsrm2fr6", focused: "_1rsrm2fr7", focusedVisible: "_1rsrm2fr8" }, defaultClass: "_1rsrm2fr3" }, inputAmountQuickOptionHoverBorder: { conditions: { base: "_1rsrm2fr9", hover: "_1rsrm2fra", active: "_1rsrm2frb", selection: "_1rsrm2frc", focused: "_1rsrm2frd", focusedVisible: "_1rsrm2fre" }, defaultClass: "_1rsrm2fr9" }, inputAmountQuickOptionActiveBorder: { conditions: { base: "_1rsrm2frf", hover: "_1rsrm2frg", active: "_1rsrm2frh", selection: "_1rsrm2fri", focused: "_1rsrm2frj", focusedVisible: "_1rsrm2frk" }, defaultClass: "_1rsrm2frf" }, inputAmountQuickOptionFocusedBorder: { conditions: { base: "_1rsrm2frl", hover: "_1rsrm2frm", active: "_1rsrm2frn", selection: "_1rsrm2fro", focused: "_1rsrm2frp", focusedVisible: "_1rsrm2frq" }, defaultClass: "_1rsrm2frl" }, announceGradientFrom: { conditions: { base: "_1rsrm2frr", hover: "_1rsrm2frs", active: "_1rsrm2frt", selection: "_1rsrm2fru", focused: "_1rsrm2frv", focusedVisible: "_1rsrm2frw" }, defaultClass: "_1rsrm2frr" }, announceGradientTo: { conditions: { base: "_1rsrm2frx", hover: "_1rsrm2fry", active: "_1rsrm2frz", selection: "_1rsrm2fs0", focused: "_1rsrm2fs1", focusedVisible: "_1rsrm2fs2" }, defaultClass: "_1rsrm2frx" } } }, borderColor: { values: { accentColor: { conditions: { base: "_1rsrm2fs3", hover: "_1rsrm2fs4", active: "_1rsrm2fs5", selection: "_1rsrm2fs6", focused: "_1rsrm2fs7", focusedVisible: "_1rsrm2fs8" }, defaultClass: "_1rsrm2fs3" }, accentColorForeground: { conditions: { base: "_1rsrm2fs9", hover: "_1rsrm2fsa", active: "_1rsrm2fsb", selection: "_1rsrm2fsc", focused: "_1rsrm2fsd", focusedVisible: "_1rsrm2fse" }, defaultClass: "_1rsrm2fs9" }, actionButtonBorder: { conditions: { base: "_1rsrm2fsf", hover: "_1rsrm2fsg", active: "_1rsrm2fsh", selection: "_1rsrm2fsi", focused: "_1rsrm2fsj", focusedVisible: "_1rsrm2fsk" }, defaultClass: "_1rsrm2fsf" }, connectButtonBackground: { conditions: { base: "_1rsrm2fsl", hover: "_1rsrm2fsm", active: "_1rsrm2fsn", selection: "_1rsrm2fso", focused: "_1rsrm2fsp", focusedVisible: "_1rsrm2fsq" }, defaultClass: "_1rsrm2fsl" }, connectButtonBackgroundError: { conditions: { base: "_1rsrm2fsr", hover: "_1rsrm2fss", active: "_1rsrm2fst", selection: "_1rsrm2fsu", focused: "_1rsrm2fsv", focusedVisible: "_1rsrm2fsw" }, defaultClass: "_1rsrm2fsr" }, connectButtonText: { conditions: { base: "_1rsrm2fsx", hover: "_1rsrm2fsy", active: "_1rsrm2fsz", selection: "_1rsrm2ft0", focused: "_1rsrm2ft1", focusedVisible: "_1rsrm2ft2" }, defaultClass: "_1rsrm2fsx" }, connectButtonTextError: { conditions: { base: "_1rsrm2ft3", hover: "_1rsrm2ft4", active: "_1rsrm2ft5", selection: "_1rsrm2ft6", focused: "_1rsrm2ft7", focusedVisible: "_1rsrm2ft8" }, defaultClass: "_1rsrm2ft3" }, connectionIndicator: { conditions: { base: "_1rsrm2ft9", hover: "_1rsrm2fta", active: "_1rsrm2ftb", selection: "_1rsrm2ftc", focused: "_1rsrm2ftd", focusedVisible: "_1rsrm2fte" }, defaultClass: "_1rsrm2ft9" }, error: { conditions: { base: "_1rsrm2ftf", hover: "_1rsrm2ftg", active: "_1rsrm2fth", selection: "_1rsrm2fti", focused: "_1rsrm2ftj", focusedVisible: "_1rsrm2ftk" }, defaultClass: "_1rsrm2ftf" }, errorBackground: { conditions: { base: "_1rsrm2ftl", hover: "_1rsrm2ftm", active: "_1rsrm2ftn", selection: "_1rsrm2fto", focused: "_1rsrm2ftp", focusedVisible: "_1rsrm2ftq" }, defaultClass: "_1rsrm2ftl" }, errorBorder: { conditions: { base: "_1rsrm2ftr", hover: "_1rsrm2fts", active: "_1rsrm2ftt", selection: "_1rsrm2ftu", focused: "_1rsrm2ftv", focusedVisible: "_1rsrm2ftw" }, defaultClass: "_1rsrm2ftr" }, generalBorder: { conditions: { base: "_1rsrm2ftx", hover: "_1rsrm2fty", active: "_1rsrm2ftz", selection: "_1rsrm2fu0", focused: "_1rsrm2fu1", focusedVisible: "_1rsrm2fu2" }, defaultClass: "_1rsrm2ftx" }, generalBorderDim: { conditions: { base: "_1rsrm2fu3", hover: "_1rsrm2fu4", active: "_1rsrm2fu5", selection: "_1rsrm2fu6", focused: "_1rsrm2fu7", focusedVisible: "_1rsrm2fu8" }, defaultClass: "_1rsrm2fu3" }, menuItemBackground: { conditions: { base: "_1rsrm2fu9", hover: "_1rsrm2fua", active: "_1rsrm2fub", selection: "_1rsrm2fuc", focused: "_1rsrm2fud", focusedVisible: "_1rsrm2fue" }, defaultClass: "_1rsrm2fu9" }, selectedOptionBorder: { conditions: { base: "_1rsrm2fuf", hover: "_1rsrm2fug", active: "_1rsrm2fuh", selection: "_1rsrm2fui", focused: "_1rsrm2fuj", focusedVisible: "_1rsrm2fuk" }, defaultClass: "_1rsrm2fuf" }, focusedOptionBorder: { conditions: { base: "_1rsrm2ful", hover: "_1rsrm2fum", active: "_1rsrm2fun", selection: "_1rsrm2fuo", focused: "_1rsrm2fup", focusedVisible: "_1rsrm2fuq" }, defaultClass: "_1rsrm2ful" }, standby: { conditions: { base: "_1rsrm2fur", hover: "_1rsrm2fus", active: "_1rsrm2fut", selection: "_1rsrm2fuu", focused: "_1rsrm2fuv", focusedVisible: "_1rsrm2fuw" }, defaultClass: "_1rsrm2fur" }, success: { conditions: { base: "_1rsrm2fux", hover: "_1rsrm2fuy", active: "_1rsrm2fuz", selection: "_1rsrm2fv0", focused: "_1rsrm2fv1", focusedVisible: "_1rsrm2fv2" }, defaultClass: "_1rsrm2fux" }, chainIconBorder: { conditions: { base: "_1rsrm2fv3", hover: "_1rsrm2fv4", active: "_1rsrm2fv5", selection: "_1rsrm2fv6", focused: "_1rsrm2fv7", focusedVisible: "_1rsrm2fv8" }, defaultClass: "_1rsrm2fv3" }, modalBackdrop: { conditions: { base: "_1rsrm2fv9", hover: "_1rsrm2fva", active: "_1rsrm2fvb", selection: "_1rsrm2fvc", focused: "_1rsrm2fvd", focusedVisible: "_1rsrm2fve" }, defaultClass: "_1rsrm2fv9" }, modalBackground: { conditions: { base: "_1rsrm2fvf", hover: "_1rsrm2fvg", active: "_1rsrm2fvh", selection: "_1rsrm2fvi", focused: "_1rsrm2fvj", focusedVisible: "_1rsrm2fvk" }, defaultClass: "_1rsrm2fvf" }, modalBorder: { conditions: { base: "_1rsrm2fvl", hover: "_1rsrm2fvm", active: "_1rsrm2fvn", selection: "_1rsrm2fvo", focused: "_1rsrm2fvp", focusedVisible: "_1rsrm2fvq" }, defaultClass: "_1rsrm2fvl" }, offBackground: { conditions: { base: "_1rsrm2fvr", hover: "_1rsrm2fvs", active: "_1rsrm2fvt", selection: "_1rsrm2fvu", focused: "_1rsrm2fvv", focusedVisible: "_1rsrm2fvw" }, defaultClass: "_1rsrm2fvr" }, offBackgroundComplimentary: { conditions: { base: "_1rsrm2fvx", hover: "_1rsrm2fvy", active: "_1rsrm2fvz", selection: "_1rsrm2fw0", focused: "_1rsrm2fw1", focusedVisible: "_1rsrm2fw2" }, defaultClass: "_1rsrm2fvx" }, hoverState: { conditions: { base: "_1rsrm2fw3", hover: "_1rsrm2fw4", active: "_1rsrm2fw5", selection: "_1rsrm2fw6", focused: "_1rsrm2fw7", focusedVisible: "_1rsrm2fw8" }, defaultClass: "_1rsrm2fw3" }, lightStroke: { conditions: { base: "_1rsrm2fw9", hover: "_1rsrm2fwa", active: "_1rsrm2fwb", selection: "_1rsrm2fwc", focused: "_1rsrm2fwd", focusedVisible: "_1rsrm2fwe" }, defaultClass: "_1rsrm2fw9" }, mediumStroke: { conditions: { base: "_1rsrm2fwf", hover: "_1rsrm2fwg", active: "_1rsrm2fwh", selection: "_1rsrm2fwi", focused: "_1rsrm2fwj", focusedVisible: "_1rsrm2fwk" }, defaultClass: "_1rsrm2fwf" }, heavyStroke: { conditions: { base: "_1rsrm2fwl", hover: "_1rsrm2fwm", active: "_1rsrm2fwn", selection: "_1rsrm2fwo", focused: "_1rsrm2fwp", focusedVisible: "_1rsrm2fwq" }, defaultClass: "_1rsrm2fwl" }, strokeColor: { conditions: { base: "_1rsrm2fwr", hover: "_1rsrm2fws", active: "_1rsrm2fwt", selection: "_1rsrm2fwu", focused: "_1rsrm2fwv", focusedVisible: "_1rsrm2fww" }, defaultClass: "_1rsrm2fwr" }, dydxSwitchActiveBackground: { conditions: { base: "_1rsrm2fwx", hover: "_1rsrm2fwy", active: "_1rsrm2fwz", selection: "_1rsrm2fx0", focused: "_1rsrm2fx1", focusedVisible: "_1rsrm2fx2" }, defaultClass: "_1rsrm2fwx" }, primaryText: { conditions: { base: "_1rsrm2fx3", hover: "_1rsrm2fx4", active: "_1rsrm2fx5", selection: "_1rsrm2fx6", focused: "_1rsrm2fx7", focusedVisible: "_1rsrm2fx8" }, defaultClass: "_1rsrm2fx3" }, secondaryText: { conditions: { base: "_1rsrm2fx9", hover: "_1rsrm2fxa", active: "_1rsrm2fxb", selection: "_1rsrm2fxc", focused: "_1rsrm2fxd", focusedVisible: "_1rsrm2fxe" }, defaultClass: "_1rsrm2fx9" }, tertiaryText: { conditions: { base: "_1rsrm2fxf", hover: "_1rsrm2fxg", active: "_1rsrm2fxh", selection: "_1rsrm2fxi", focused: "_1rsrm2fxj", focusedVisible: "_1rsrm2fxk" }, defaultClass: "_1rsrm2fxf" }, textSelection: { conditions: { base: "_1rsrm2fxl", hover: "_1rsrm2fxm", active: "_1rsrm2fxn", selection: "_1rsrm2fxo", focused: "_1rsrm2fxp", focusedVisible: "_1rsrm2fxq" }, defaultClass: "_1rsrm2fxl" }, inputBackground: { conditions: { base: "_1rsrm2fxr", hover: "_1rsrm2fxs", active: "_1rsrm2fxt", selection: "_1rsrm2fxu", focused: "_1rsrm2fxv", focusedVisible: "_1rsrm2fxw" }, defaultClass: "_1rsrm2fxr" }, inputBorderBase: { conditions: { base: "_1rsrm2fxx", hover: "_1rsrm2fxy", active: "_1rsrm2fxz", selection: "_1rsrm2fy0", focused: "_1rsrm2fy1", focusedVisible: "_1rsrm2fy2" }, defaultClass: "_1rsrm2fxx" }, inputBorderHover: { conditions: { base: "_1rsrm2fy3", hover: "_1rsrm2fy4", active: "_1rsrm2fy5", selection: "_1rsrm2fy6", focused: "_1rsrm2fy7", focusedVisible: "_1rsrm2fy8" }, defaultClass: "_1rsrm2fy3" }, actionColor: { conditions: { base: "_1rsrm2fy9", hover: "_1rsrm2fya", active: "_1rsrm2fyb", selection: "_1rsrm2fyc", focused: "_1rsrm2fyd", focusedVisible: "_1rsrm2fye" }, defaultClass: "_1rsrm2fy9" }, actionColorHover: { conditions: { base: "_1rsrm2fyf", hover: "_1rsrm2fyg", active: "_1rsrm2fyh", selection: "_1rsrm2fyi", focused: "_1rsrm2fyj", focusedVisible: "_1rsrm2fyk" }, defaultClass: "_1rsrm2fyf" }, actionColorDisabled: { conditions: { base: "_1rsrm2fyl", hover: "_1rsrm2fym", active: "_1rsrm2fyn", selection: "_1rsrm2fyo", focused: "_1rsrm2fyp", focusedVisible: "_1rsrm2fyq" }, defaultClass: "_1rsrm2fyl" }, buttonPrimary: { conditions: { base: "_1rsrm2fyr", hover: "_1rsrm2fys", active: "_1rsrm2fyt", selection: "_1rsrm2fyu", focused: "_1rsrm2fyv", focusedVisible: "_1rsrm2fyw" }, defaultClass: "_1rsrm2fyr" }, buttonDisabled: { conditions: { base: "_1rsrm2fyx", hover: "_1rsrm2fyy", active: "_1rsrm2fyz", selection: "_1rsrm2fz0", focused: "_1rsrm2fz1", focusedVisible: "_1rsrm2fz2" }, defaultClass: "_1rsrm2fyx" }, buttonWarning: { conditions: { base: "_1rsrm2fz3", hover: "_1rsrm2fz4", active: "_1rsrm2fz5", selection: "_1rsrm2fz6", focused: "_1rsrm2fz7", focusedVisible: "_1rsrm2fz8" }, defaultClass: "_1rsrm2fz3" }, buttonSuccess: { conditions: { base: "_1rsrm2fz9", hover: "_1rsrm2fza", active: "_1rsrm2fzb", selection: "_1rsrm2fzc", focused: "_1rsrm2fzd", focusedVisible: "_1rsrm2fze" }, defaultClass: "_1rsrm2fz9" }, buttonTextPrimary: { conditions: { base: "_1rsrm2fzf", hover: "_1rsrm2fzg", active: "_1rsrm2fzh", selection: "_1rsrm2fzi", focused: "_1rsrm2fzj", focusedVisible: "_1rsrm2fzk" }, defaultClass: "_1rsrm2fzf" }, buttonTextDisabled: { conditions: { base: "_1rsrm2fzl", hover: "_1rsrm2fzm", active: "_1rsrm2fzn", selection: "_1rsrm2fzo", focused: "_1rsrm2fzp", focusedVisible: "_1rsrm2fzq" }, defaultClass: "_1rsrm2fzl" }, transparent: { conditions: { base: "_1rsrm2fzr", hover: "_1rsrm2fzs", active: "_1rsrm2fzt", selection: "_1rsrm2fzu", focused: "_1rsrm2fzv", focusedVisible: "_1rsrm2fzw" }, defaultClass: "_1rsrm2fzr" }, buttonBackgroundTertiary: { conditions: { base: "_1rsrm2fzx", hover: "_1rsrm2fzy", active: "_1rsrm2fzz", selection: "_1rsrm2f100", focused: "_1rsrm2f101", focusedVisible: "_1rsrm2f102" }, defaultClass: "_1rsrm2fzx" }, buttonBackgroundHoverTertiary: { conditions: { base: "_1rsrm2f103", hover: "_1rsrm2f104", active: "_1rsrm2f105", selection: "_1rsrm2f106", focused: "_1rsrm2f107", focusedVisible: "_1rsrm2f108" }, defaultClass: "_1rsrm2f103" }, buttonTextTertiary: { conditions: { base: "_1rsrm2f109", hover: "_1rsrm2f10a", active: "_1rsrm2f10b", selection: "_1rsrm2f10c", focused: "_1rsrm2f10d", focusedVisible: "_1rsrm2f10e" }, defaultClass: "_1rsrm2f109" }, buttonTextDisabledTertiary: { conditions: { base: "_1rsrm2f10f", hover: "_1rsrm2f10g", active: "_1rsrm2f10h", selection: "_1rsrm2f10i", focused: "_1rsrm2f10j", focusedVisible: "_1rsrm2f10k" }, defaultClass: "_1rsrm2f10f" }, buttonStrokeTertiary: { conditions: { base: "_1rsrm2f10l", hover: "_1rsrm2f10m", active: "_1rsrm2f10n", selection: "_1rsrm2f10o", focused: "_1rsrm2f10p", focusedVisible: "_1rsrm2f10q" }, defaultClass: "_1rsrm2f10l" }, buttonBackground: { conditions: { base: "_1rsrm2f10r", hover: "_1rsrm2f10s", active: "_1rsrm2f10t", selection: "_1rsrm2f10u", focused: "_1rsrm2f10v", focusedVisible: "_1rsrm2f10w" }, defaultClass: "_1rsrm2f10r" }, buttonBackgroundHover: { conditions: { base: "_1rsrm2f10x", hover: "_1rsrm2f10y", active: "_1rsrm2f10z", selection: "_1rsrm2f110", focused: "_1rsrm2f111", focusedVisible: "_1rsrm2f112" }, defaultClass: "_1rsrm2f10x" }, buttonBackgroundDisabled: { conditions: { base: "_1rsrm2f113", hover: "_1rsrm2f114", active: "_1rsrm2f115", selection: "_1rsrm2f116", focused: "_1rsrm2f117", focusedVisible: "_1rsrm2f118" }, defaultClass: "_1rsrm2f113" }, buttonStroke: { conditions: { base: "_1rsrm2f119", hover: "_1rsrm2f11a", active: "_1rsrm2f11b", selection: "_1rsrm2f11c", focused: "_1rsrm2f11d", focusedVisible: "_1rsrm2f11e" }, defaultClass: "_1rsrm2f119" }, buttonTextSecondaryDisabled: { conditions: { base: "_1rsrm2f11f", hover: "_1rsrm2f11g", active: "_1rsrm2f11h", selection: "_1rsrm2f11i", focused: "_1rsrm2f11j", focusedVisible: "_1rsrm2f11k" }, defaultClass: "_1rsrm2f11f" }, buttonTextSecondary: { conditions: { base: "_1rsrm2f11l", hover: "_1rsrm2f11m", active: "_1rsrm2f11n", selection: "_1rsrm2f11o", focused: "_1rsrm2f11p", focusedVisible: "_1rsrm2f11q" }, defaultClass: "_1rsrm2f11l" }, buttonIconBackgroundHover: { conditions: { base: "_1rsrm2f11r", hover: "_1rsrm2f11s", active: "_1rsrm2f11t", selection: "_1rsrm2f11u", focused: "_1rsrm2f11v", focusedVisible: "_1rsrm2f11w" }, defaultClass: "_1rsrm2f11r" }, buttonIconBackgroundPressed: { conditions: { base: "_1rsrm2f11x", hover: "_1rsrm2f11y", active: "_1rsrm2f11z", selection: "_1rsrm2f120", focused: "_1rsrm2f121", focusedVisible: "_1rsrm2f122" }, defaultClass: "_1rsrm2f11x" }, buttonIconStroke: { conditions: { base: "_1rsrm2f123", hover: "_1rsrm2f124", active: "_1rsrm2f125", selection: "_1rsrm2f126", focused: "_1rsrm2f127", focusedVisible: "_1rsrm2f128" }, defaultClass: "_1rsrm2f123" }, badgeBackgroundSuccess: { conditions: { base: "_1rsrm2f129", hover: "_1rsrm2f12a", active: "_1rsrm2f12b", selection: "_1rsrm2f12c", focused: "_1rsrm2f12d", focusedVisible: "_1rsrm2f12e" }, defaultClass: "_1rsrm2f129" }, badgeBorderSuccess: { conditions: { base: "_1rsrm2f12f", hover: "_1rsrm2f12g", active: "_1rsrm2f12h", selection: "_1rsrm2f12i", focused: "_1rsrm2f12j", focusedVisible: "_1rsrm2f12k" }, defaultClass: "_1rsrm2f12f" }, badgeTextSuccess: { conditions: { base: "_1rsrm2f12l", hover: "_1rsrm2f12m", active: "_1rsrm2f12n", selection: "_1rsrm2f12o", focused: "_1rsrm2f12p", focusedVisible: "_1rsrm2f12q" }, defaultClass: "_1rsrm2f12l" }, inputAmountQuickOptionBaseBackground: { conditions: { base: "_1rsrm2f12r", hover: "_1rsrm2f12s", active: "_1rsrm2f12t", selection: "_1rsrm2f12u", focused: "_1rsrm2f12v", focusedVisible: "_1rsrm2f12w" }, defaultClass: "_1rsrm2f12r" }, inputAmountQuickOptionHoverBackground: { conditions: { base: "_1rsrm2f12x", hover: "_1rsrm2f12y", active: "_1rsrm2f12z", selection: "_1rsrm2f130", focused: "_1rsrm2f131", focusedVisible: "_1rsrm2f132" }, defaultClass: "_1rsrm2f12x" }, inputAmountQuickOptionActiveBackground: { conditions: { base: "_1rsrm2f133", hover: "_1rsrm2f134", active: "_1rsrm2f135", selection: "_1rsrm2f136", focused: "_1rsrm2f137", focusedVisible: "_1rsrm2f138" }, defaultClass: "_1rsrm2f133" }, inputAmountQuickOptionDisabledBackground: { conditions: { base: "_1rsrm2f139", hover: "_1rsrm2f13a", active: "_1rsrm2f13b", selection: "_1rsrm2f13c", focused: "_1rsrm2f13d", focusedVisible: "_1rsrm2f13e" }, defaultClass: "_1rsrm2f139" }, inputAmountQuickOptionBaseBorder: { conditions: { base: "_1rsrm2f13f", hover: "_1rsrm2f13g", active: "_1rsrm2f13h", selection: "_1rsrm2f13i", focused: "_1rsrm2f13j", focusedVisible: "_1rsrm2f13k" }, defaultClass: "_1rsrm2f13f" }, inputAmountQuickOptionHoverBorder: { conditions: { base: "_1rsrm2f13l", hover: "_1rsrm2f13m", active: "_1rsrm2f13n", selection: "_1rsrm2f13o", focused: "_1rsrm2f13p", focusedVisible: "_1rsrm2f13q" }, defaultClass: "_1rsrm2f13l" }, inputAmountQuickOptionActiveBorder: { conditions: { base: "_1rsrm2f13r", hover: "_1rsrm2f13s", active: "_1rsrm2f13t", selection: "_1rsrm2f13u", focused: "_1rsrm2f13v", focusedVisible: "_1rsrm2f13w" }, defaultClass: "_1rsrm2f13r" }, inputAmountQuickOptionFocusedBorder: { conditions: { base: "_1rsrm2f13x", hover: "_1rsrm2f13y", active: "_1rsrm2f13z", selection: "_1rsrm2f140", focused: "_1rsrm2f141", focusedVisible: "_1rsrm2f142" }, defaultClass: "_1rsrm2f13x" }, announceGradientFrom: { conditions: { base: "_1rsrm2f143", hover: "_1rsrm2f144", active: "_1rsrm2f145", selection: "_1rsrm2f146", focused: "_1rsrm2f147", focusedVisible: "_1rsrm2f148" }, defaultClass: "_1rsrm2f143" }, announceGradientTo: { conditions: { base: "_1rsrm2f149", hover: "_1rsrm2f14a", active: "_1rsrm2f14b", selection: "_1rsrm2f14c", focused: "_1rsrm2f14d", focusedVisible: "_1rsrm2f14e" }, defaultClass: "_1rsrm2f149" } } }, boxShadow: { values: { connectButton: { conditions: { base: "_1rsrm2f14f", hover: "_1rsrm2f14g", active: "_1rsrm2f14h", selection: "_1rsrm2f14i", focused: "_1rsrm2f14j", focusedVisible: "_1rsrm2f14k" }, defaultClass: "_1rsrm2f14f" }, dialog: { conditions: { base: "_1rsrm2f14l", hover: "_1rsrm2f14m", active: "_1rsrm2f14n", selection: "_1rsrm2f14o", focused: "_1rsrm2f14p", focusedVisible: "_1rsrm2f14q" }, defaultClass: "_1rsrm2f14l" }, selectedOption: { conditions: { base: "_1rsrm2f14r", hover: "_1rsrm2f14s", active: "_1rsrm2f14t", selection: "_1rsrm2f14u", focused: "_1rsrm2f14v", focusedVisible: "_1rsrm2f14w" }, defaultClass: "_1rsrm2f14r" }, selectedWallet: { conditions: { base: "_1rsrm2f14x", hover: "_1rsrm2f14y", active: "_1rsrm2f14z", selection: "_1rsrm2f150", focused: "_1rsrm2f151", focusedVisible: "_1rsrm2f152" }, defaultClass: "_1rsrm2f14x" }, dropdown: { conditions: { base: "_1rsrm2f153", hover: "_1rsrm2f154", active: "_1rsrm2f155", selection: "_1rsrm2f156", focused: "_1rsrm2f157", focusedVisible: "_1rsrm2f158" }, defaultClass: "_1rsrm2f153" }, notification: { conditions: { base: "_1rsrm2f159", hover: "_1rsrm2f15a", active: "_1rsrm2f15b", selection: "_1rsrm2f15c", focused: "_1rsrm2f15d", focusedVisible: "_1rsrm2f15e" }, defaultClass: "_1rsrm2f159" }, vertexDropdown: { conditions: { base: "_1rsrm2f15f", hover: "_1rsrm2f15g", active: "_1rsrm2f15h", selection: "_1rsrm2f15i", focused: "_1rsrm2f15j", focusedVisible: "_1rsrm2f15k" }, defaultClass: "_1rsrm2f15f" } } }, color: { values: { accentColor: { conditions: { base: "_1rsrm2f15l", hover: "_1rsrm2f15m", active: "_1rsrm2f15n", selection: "_1rsrm2f15o", focused: "_1rsrm2f15p", focusedVisible: "_1rsrm2f15q" }, defaultClass: "_1rsrm2f15l" }, accentColorForeground: { conditions: { base: "_1rsrm2f15r", hover: "_1rsrm2f15s", active: "_1rsrm2f15t", selection: "_1rsrm2f15u", focused: "_1rsrm2f15v", focusedVisible: "_1rsrm2f15w" }, defaultClass: "_1rsrm2f15r" }, actionButtonBorder: { conditions: { base: "_1rsrm2f15x", hover: "_1rsrm2f15y", active: "_1rsrm2f15z", selection: "_1rsrm2f160", focused: "_1rsrm2f161", focusedVisible: "_1rsrm2f162" }, defaultClass: "_1rsrm2f15x" }, connectButtonBackground: { conditions: { base: "_1rsrm2f163", hover: "_1rsrm2f164", active: "_1rsrm2f165", selection: "_1rsrm2f166", focused: "_1rsrm2f167", focusedVisible: "_1rsrm2f168" }, defaultClass: "_1rsrm2f163" }, connectButtonBackgroundError: { conditions: { base: "_1rsrm2f169", hover: "_1rsrm2f16a", active: "_1rsrm2f16b", selection: "_1rsrm2f16c", focused: "_1rsrm2f16d", focusedVisible: "_1rsrm2f16e" }, defaultClass: "_1rsrm2f169" }, connectButtonText: { conditions: { base: "_1rsrm2f16f", hover: "_1rsrm2f16g", active: "_1rsrm2f16h", selection: "_1rsrm2f16i", focused: "_1rsrm2f16j", focusedVisible: "_1rsrm2f16k" }, defaultClass: "_1rsrm2f16f" }, connectButtonTextError: { conditions: { base: "_1rsrm2f16l", hover: "_1rsrm2f16m", active: "_1rsrm2f16n", selection: "_1rsrm2f16o", focused: "_1rsrm2f16p", focusedVisible: "_1rsrm2f16q" }, defaultClass: "_1rsrm2f16l" }, connectionIndicator: { conditions: { base: "_1rsrm2f16r", hover: "_1rsrm2f16s", active: "_1rsrm2f16t", selection: "_1rsrm2f16u", focused: "_1rsrm2f16v", focusedVisible: "_1rsrm2f16w" }, defaultClass: "_1rsrm2f16r" }, error: { conditions: { base: "_1rsrm2f16x", hover: "_1rsrm2f16y", active: "_1rsrm2f16z", selection: "_1rsrm2f170", focused: "_1rsrm2f171", focusedVisible: "_1rsrm2f172" }, defaultClass: "_1rsrm2f16x" }, errorBackground: { conditions: { base: "_1rsrm2f173", hover: "_1rsrm2f174", active: "_1rsrm2f175", selection: "_1rsrm2f176", focused: "_1rsrm2f177", focusedVisible: "_1rsrm2f178" }, defaultClass: "_1rsrm2f173" }, errorBorder: { conditions: { base: "_1rsrm2f179", hover: "_1rsrm2f17a", active: "_1rsrm2f17b", selection: "_1rsrm2f17c", focused: "_1rsrm2f17d", focusedVisible: "_1rsrm2f17e" }, defaultClass: "_1rsrm2f179" }, generalBorder: { conditions: { base: "_1rsrm2f17f", hover: "_1rsrm2f17g", active: "_1rsrm2f17h", selection: "_1rsrm2f17i", focused: "_1rsrm2f17j", focusedVisible: "_1rsrm2f17k" }, defaultClass: "_1rsrm2f17f" }, generalBorderDim: { conditions: { base: "_1rsrm2f17l", hover: "_1rsrm2f17m", active: "_1rsrm2f17n", selection: "_1rsrm2f17o", focused: "_1rsrm2f17p", focusedVisible: "_1rsrm2f17q" }, defaultClass: "_1rsrm2f17l" }, menuItemBackground: { conditions: { base: "_1rsrm2f17r", hover: "_1rsrm2f17s", active: "_1rsrm2f17t", selection: "_1rsrm2f17u", focused: "_1rsrm2f17v", focusedVisible: "_1rsrm2f17w" }, defaultClass: "_1rsrm2f17r" }, selectedOptionBorder: { conditions: { base: "_1rsrm2f17x", hover: "_1rsrm2f17y", active: "_1rsrm2f17z", selection: "_1rsrm2f180", focused: "_1rsrm2f181", focusedVisible: "_1rsrm2f182" }, defaultClass: "_1rsrm2f17x" }, focusedOptionBorder: { conditions: { base: "_1rsrm2f183", hover: "_1rsrm2f184", active: "_1rsrm2f185", selection: "_1rsrm2f186", focused: "_1rsrm2f187", focusedVisible: "_1rsrm2f188" }, defaultClass: "_1rsrm2f183" }, standby: { conditions: { base: "_1rsrm2f189", hover: "_1rsrm2f18a", active: "_1rsrm2f18b", selection: "_1rsrm2f18c", focused: "_1rsrm2f18d", focusedVisible: "_1rsrm2f18e" }, defaultClass: "_1rsrm2f189" }, success: { conditions: { base: "_1rsrm2f18f", hover: "_1rsrm2f18g", active: "_1rsrm2f18h", selection: "_1rsrm2f18i", focused: "_1rsrm2f18j", focusedVisible: "_1rsrm2f18k" }, defaultClass: "_1rsrm2f18f" }, chainIconBorder: { conditions: { base: "_1rsrm2f18l", hover: "_1rsrm2f18m", active: "_1rsrm2f18n", selection: "_1rsrm2f18o", focused: "_1rsrm2f18p", focusedVisible: "_1rsrm2f18q" }, defaultClass: "_1rsrm2f18l" }, modalBackdrop: { conditions: { base: "_1rsrm2f18r", hover: "_1rsrm2f18s", active: "_1rsrm2f18t", selection: "_1rsrm2f18u", focused: "_1rsrm2f18v", focusedVisible: "_1rsrm2f18w" }, defaultClass: "_1rsrm2f18r" }, modalBackground: { conditions: { base: "_1rsrm2f18x", hover: "_1rsrm2f18y", active: "_1rsrm2f18z", selection: "_1rsrm2f190", focused: "_1rsrm2f191", focusedVisible: "_1rsrm2f192" }, defaultClass: "_1rsrm2f18x" }, modalBorder: { conditions: { base: "_1rsrm2f193", hover: "_1rsrm2f194", active: "_1rsrm2f195", selection: "_1rsrm2f196", focused: "_1rsrm2f197", focusedVisible: "_1rsrm2f198" }, defaultClass: "_1rsrm2f193" }, offBackground: { conditions: { base: "_1rsrm2f199", hover: "_1rsrm2f19a", active: "_1rsrm2f19b", selection: "_1rsrm2f19c", focused: "_1rsrm2f19d", focusedVisible: "_1rsrm2f19e" }, defaultClass: "_1rsrm2f199" }, offBackgroundComplimentary: { conditions: { base: "_1rsrm2f19f", hover: "_1rsrm2f19g", active: "_1rsrm2f19h", selection: "_1rsrm2f19i", focused: "_1rsrm2f19j", focusedVisible: "_1rsrm2f19k" }, defaultClass: "_1rsrm2f19f" }, hoverState: { conditions: { base: "_1rsrm2f19l", hover: "_1rsrm2f19m", active: "_1rsrm2f19n", selection: "_1rsrm2f19o", focused: "_1rsrm2f19p", focusedVisible: "_1rsrm2f19q" }, defaultClass: "_1rsrm2f19l" }, lightStroke: { conditions: { base: "_1rsrm2f19r", hover: "_1rsrm2f19s", active: "_1rsrm2f19t", selection: "_1rsrm2f19u", focused: "_1rsrm2f19v", focusedVisible: "_1rsrm2f19w" }, defaultClass: "_1rsrm2f19r" }, mediumStroke: { conditions: { base: "_1rsrm2f19x", hover: "_1rsrm2f19y", active: "_1rsrm2f19z", selection: "_1rsrm2f1a0", focused: "_1rsrm2f1a1", focusedVisible: "_1rsrm2f1a2" }, defaultClass: "_1rsrm2f19x" }, heavyStroke: { conditions: { base: "_1rsrm2f1a3", hover: "_1rsrm2f1a4", active: "_1rsrm2f1a5", selection: "_1rsrm2f1a6", focused: "_1rsrm2f1a7", focusedVisible: "_1rsrm2f1a8" }, defaultClass: "_1rsrm2f1a3" }, strokeColor: { conditions: { base: "_1rsrm2f1a9", hover: "_1rsrm2f1aa", active: "_1rsrm2f1ab", selection: "_1rsrm2f1ac", focused: "_1rsrm2f1ad", focusedVisible: "_1rsrm2f1ae" }, defaultClass: "_1rsrm2f1a9" }, dydxSwitchActiveBackground: { conditions: { base: "_1rsrm2f1af", hover: "_1rsrm2f1ag", active: "_1rsrm2f1ah", selection: "_1rsrm2f1ai", focused: "_1rsrm2f1aj", focusedVisible: "_1rsrm2f1ak" }, defaultClass: "_1rsrm2f1af" }, primaryText: { conditions: { base: "_1rsrm2f1al", hover: "_1rsrm2f1am", active: "_1rsrm2f1an", selection: "_1rsrm2f1ao", focused: "_1rsrm2f1ap", focusedVisible: "_1rsrm2f1aq" }, defaultClass: "_1rsrm2f1al" }, secondaryText: { conditions: { base: "_1rsrm2f1ar", hover: "_1rsrm2f1as", active: "_1rsrm2f1at", selection: "_1rsrm2f1au", focused: "_1rsrm2f1av", focusedVisible: "_1rsrm2f1aw" }, defaultClass: "_1rsrm2f1ar" }, tertiaryText: { conditions: { base: "_1rsrm2f1ax", hover: "_1rsrm2f1ay", active: "_1rsrm2f1az", selection: "_1rsrm2f1b0", focused: "_1rsrm2f1b1", focusedVisible: "_1rsrm2f1b2" }, defaultClass: "_1rsrm2f1ax" }, textSelection: { conditions: { base: "_1rsrm2f1b3", hover: "_1rsrm2f1b4", active: "_1rsrm2f1b5", selection: "_1rsrm2f1b6", focused: "_1rsrm2f1b7", focusedVisible: "_1rsrm2f1b8" }, defaultClass: "_1rsrm2f1b3" }, inputBackground: { conditions: { base: "_1rsrm2f1b9", hover: "_1rsrm2f1ba", active: "_1rsrm2f1bb", selection: "_1rsrm2f1bc", focused: "_1rsrm2f1bd", focusedVisible: "_1rsrm2f1be" }, defaultClass: "_1rsrm2f1b9" }, inputBorderBase: { conditions: { base: "_1rsrm2f1bf", hover: "_1rsrm2f1bg", active: "_1rsrm2f1bh", selection: "_1rsrm2f1bi", focused: "_1rsrm2f1bj", focusedVisible: "_1rsrm2f1bk" }, defaultClass: "_1rsrm2f1bf" }, inputBorderHover: { conditions: { base: "_1rsrm2f1bl", hover: "_1rsrm2f1bm", active: "_1rsrm2f1bn", selection: "_1rsrm2f1bo", focused: "_1rsrm2f1bp", focusedVisible: "_1rsrm2f1bq" }, defaultClass: "_1rsrm2f1bl" }, actionColor: { conditions: { base: "_1rsrm2f1br", hover: "_1rsrm2f1bs", active: "_1rsrm2f1bt", selection: "_1rsrm2f1bu", focused: "_1rsrm2f1bv", focusedVisible: "_1rsrm2f1bw" }, defaultClass: "_1rsrm2f1br" }, actionColorHover: { conditions: { base: "_1rsrm2f1bx", hover: "_1rsrm2f1by", active: "_1rsrm2f1bz", selection: "_1rsrm2f1c0", focused: "_1rsrm2f1c1", focusedVisible: "_1rsrm2f1c2" }, defaultClass: "_1rsrm2f1bx" }, actionColorDisabled: { conditions: { base: "_1rsrm2f1c3", hover: "_1rsrm2f1c4", active: "_1rsrm2f1c5", selection: "_1rsrm2f1c6", focused: "_1rsrm2f1c7", focusedVisible: "_1rsrm2f1c8" }, defaultClass: "_1rsrm2f1c3" }, buttonPrimary: { conditions: { base: "_1rsrm2f1c9", hover: "_1rsrm2f1ca", active: "_1rsrm2f1cb", selection: "_1rsrm2f1cc", focused: "_1rsrm2f1cd", focusedVisible: "_1rsrm2f1ce" }, defaultClass: "_1rsrm2f1c9" }, buttonDisabled: { conditions: { base: "_1rsrm2f1cf", hover: "_1rsrm2f1cg", active: "_1rsrm2f1ch", selection: "_1rsrm2f1ci", focused: "_1rsrm2f1cj", focusedVisible: "_1rsrm2f1ck" }, defaultClass: "_1rsrm2f1cf" }, buttonWarning: { conditions: { base: "_1rsrm2f1cl", hover: "_1rsrm2f1cm", active: "_1rsrm2f1cn", selection: "_1rsrm2f1co", focused: "_1rsrm2f1cp", focusedVisible: "_1rsrm2f1cq" }, defaultClass: "_1rsrm2f1cl" }, buttonSuccess: { conditions: { base: "_1rsrm2f1cr", hover: "_1rsrm2f1cs", active: "_1rsrm2f1ct", selection: "_1rsrm2f1cu", focused: "_1rsrm2f1cv", focusedVisible: "_1rsrm2f1cw" }, defaultClass: "_1rsrm2f1cr" }, buttonTextPrimary: { conditions: { base: "_1rsrm2f1cx", hover: "_1rsrm2f1cy", active: "_1rsrm2f1cz", selection: "_1rsrm2f1d0", focused: "_1rsrm2f1d1", focusedVisible: "_1rsrm2f1d2" }, defaultClass: "_1rsrm2f1cx" }, buttonTextDisabled: { conditions: { base: "_1rsrm2f1d3", hover: "_1rsrm2f1d4", active: "_1rsrm2f1d5", selection: "_1rsrm2f1d6", focused: "_1rsrm2f1d7", focusedVisible: "_1rsrm2f1d8" }, defaultClass: "_1rsrm2f1d3" }, transparent: { conditions: { base: "_1rsrm2f1d9", hover: "_1rsrm2f1da", active: "_1rsrm2f1db", selection: "_1rsrm2f1dc", focused: "_1rsrm2f1dd", focusedVisible: "_1rsrm2f1de" }, defaultClass: "_1rsrm2f1d9" }, buttonBackgroundTertiary: { conditions: { base: "_1rsrm2f1df", hover: "_1rsrm2f1dg", active: "_1rsrm2f1dh", selection: "_1rsrm2f1di", focused: "_1rsrm2f1dj", focusedVisible: "_1rsrm2f1dk" }, defaultClass: "_1rsrm2f1df" }, buttonBackgroundHoverTertiary: { conditions: { base: "_1rsrm2f1dl", hover: "_1rsrm2f1dm", active: "_1rsrm2f1dn", selection: "_1rsrm2f1do", focused: "_1rsrm2f1dp", focusedVisible: "_1rsrm2f1dq" }, defaultClass: "_1rsrm2f1dl" }, buttonTextTertiary: { conditions: { base: "_1rsrm2f1dr", hover: "_1rsrm2f1ds", active: "_1rsrm2f1dt", selection: "_1rsrm2f1du", focused: "_1rsrm2f1dv", focusedVisible: "_1rsrm2f1dw" }, defaultClass: "_1rsrm2f1dr" }, buttonTextDisabledTertiary: { conditions: { base: "_1rsrm2f1dx", hover: "_1rsrm2f1dy", active: "_1rsrm2f1dz", selection: "_1rsrm2f1e0", focused: "_1rsrm2f1e1", focusedVisible: "_1rsrm2f1e2" }, defaultClass: "_1rsrm2f1dx" }, buttonStrokeTertiary: { conditions: { base: "_1rsrm2f1e3", hover: "_1rsrm2f1e4", active: "_1rsrm2f1e5", selection: "_1rsrm2f1e6", focused: "_1rsrm2f1e7", focusedVisible: "_1rsrm2f1e8" }, defaultClass: "_1rsrm2f1e3" }, buttonBackground: { conditions: { base: "_1rsrm2f1e9", hover: "_1rsrm2f1ea", active: "_1rsrm2f1eb", selection: "_1rsrm2f1ec", focused: "_1rsrm2f1ed", focusedVisible: "_1rsrm2f1ee" }, defaultClass: "_1rsrm2f1e9" }, buttonBackgroundHover: { conditions: { base: "_1rsrm2f1ef", hover: "_1rsrm2f1eg", active: "_1rsrm2f1eh", selection: "_1rsrm2f1ei", focused: "_1rsrm2f1ej", focusedVisible: "_1rsrm2f1ek" }, defaultClass: "_1rsrm2f1ef" }, buttonBackgroundDisabled: { conditions: { base: "_1rsrm2f1el", hover: "_1rsrm2f1em", active: "_1rsrm2f1en", selection: "_1rsrm2f1eo", focused: "_1rsrm2f1ep", focusedVisible: "_1rsrm2f1eq" }, defaultClass: "_1rsrm2f1el" }, buttonStroke: { conditions: { base: "_1rsrm2f1er", hover: "_1rsrm2f1es", active: "_1rsrm2f1et", selection: "_1rsrm2f1eu", focused: "_1rsrm2f1ev", focusedVisible: "_1rsrm2f1ew" }, defaultClass: "_1rsrm2f1er" }, buttonTextSecondaryDisabled: { conditions: { base: "_1rsrm2f1ex", hover: "_1rsrm2f1ey", active: "_1rsrm2f1ez", selection: "_1rsrm2f1f0", focused: "_1rsrm2f1f1", focusedVisible: "_1rsrm2f1f2" }, defaultClass: "_1rsrm2f1ex" }, buttonTextSecondary: { conditions: { base: "_1rsrm2f1f3", hover: "_1rsrm2f1f4", active: "_1rsrm2f1f5", selection: "_1rsrm2f1f6", focused: "_1rsrm2f1f7", focusedVisible: "_1rsrm2f1f8" }, defaultClass: "_1rsrm2f1f3" }, buttonIconBackgroundHover: { conditions: { base: "_1rsrm2f1f9", hover: "_1rsrm2f1fa", active: "_1rsrm2f1fb", selection: "_1rsrm2f1fc", focused: "_1rsrm2f1fd", focusedVisible: "_1rsrm2f1fe" }, defaultClass: "_1rsrm2f1f9" }, buttonIconBackgroundPressed: { conditions: { base: "_1rsrm2f1ff", hover: "_1rsrm2f1fg", active: "_1rsrm2f1fh", selection: "_1rsrm2f1fi", focused: "_1rsrm2f1fj", focusedVisible: "_1rsrm2f1fk" }, defaultClass: "_1rsrm2f1ff" }, buttonIconStroke: { conditions: { base: "_1rsrm2f1fl", hover: "_1rsrm2f1fm", active: "_1rsrm2f1fn", selection: "_1rsrm2f1fo", focused: "_1rsrm2f1fp", focusedVisible: "_1rsrm2f1fq" }, defaultClass: "_1rsrm2f1fl" }, badgeBackgroundSuccess: { conditions: { base: "_1rsrm2f1fr", hover: "_1rsrm2f1fs", active: "_1rsrm2f1ft", selection: "_1rsrm2f1fu", focused: "_1rsrm2f1fv", focusedVisible: "_1rsrm2f1fw" }, defaultClass: "_1rsrm2f1fr" }, badgeBorderSuccess: { conditions: { base: "_1rsrm2f1fx", hover: "_1rsrm2f1fy", active: "_1rsrm2f1fz", selection: "_1rsrm2f1g0", focused: "_1rsrm2f1g1", focusedVisible: "_1rsrm2f1g2" }, defaultClass: "_1rsrm2f1fx" }, badgeTextSuccess: { conditions: { base: "_1rsrm2f1g3", hover: "_1rsrm2f1g4", active: "_1rsrm2f1g5", selection: "_1rsrm2f1g6", focused: "_1rsrm2f1g7", focusedVisible: "_1rsrm2f1g8" }, defaultClass: "_1rsrm2f1g3" }, inputAmountQuickOptionBaseBackground: { conditions: { base: "_1rsrm2f1g9", hover: "_1rsrm2f1ga", active: "_1rsrm2f1gb", selection: "_1rsrm2f1gc", focused: "_1rsrm2f1gd", focusedVisible: "_1rsrm2f1ge" }, defaultClass: "_1rsrm2f1g9" }, inputAmountQuickOptionHoverBackground: { conditions: { base: "_1rsrm2f1gf", hover: "_1rsrm2f1gg", active: "_1rsrm2f1gh", selection: "_1rsrm2f1gi", focused: "_1rsrm2f1gj", focusedVisible: "_1rsrm2f1gk" }, defaultClass: "_1rsrm2f1gf" }, inputAmountQuickOptionActiveBackground: { conditions: { base: "_1rsrm2f1gl", hover: "_1rsrm2f1gm", active: "_1rsrm2f1gn", selection: "_1rsrm2f1go", focused: "_1rsrm2f1gp", focusedVisible: "_1rsrm2f1gq" }, defaultClass: "_1rsrm2f1gl" }, inputAmountQuickOptionDisabledBackground: { conditions: { base: "_1rsrm2f1gr", hover: "_1rsrm2f1gs", active: "_1rsrm2f1gt", selection: "_1rsrm2f1gu", focused: "_1rsrm2f1gv", focusedVisible: "_1rsrm2f1gw" }, defaultClass: "_1rsrm2f1gr" }, inputAmountQuickOptionBaseBorder: { conditions: { base: "_1rsrm2f1gx", hover: "_1rsrm2f1gy", active: "_1rsrm2f1gz", selection: "_1rsrm2f1h0", focused: "_1rsrm2f1h1", focusedVisible: "_1rsrm2f1h2" }, defaultClass: "_1rsrm2f1gx" }, inputAmountQuickOptionHoverBorder: { conditions: { base: "_1rsrm2f1h3", hover: "_1rsrm2f1h4", active: "_1rsrm2f1h5", selection: "_1rsrm2f1h6", focused: "_1rsrm2f1h7", focusedVisible: "_1rsrm2f1h8" }, defaultClass: "_1rsrm2f1h3" }, inputAmountQuickOptionActiveBorder: { conditions: { base: "_1rsrm2f1h9", hover: "_1rsrm2f1ha", active: "_1rsrm2f1hb", selection: "_1rsrm2f1hc", focused: "_1rsrm2f1hd", focusedVisible: "_1rsrm2f1he" }, defaultClass: "_1rsrm2f1h9" }, inputAmountQuickOptionFocusedBorder: { conditions: { base: "_1rsrm2f1hf", hover: "_1rsrm2f1hg", active: "_1rsrm2f1hh", selection: "_1rsrm2f1hi", focused: "_1rsrm2f1hj", focusedVisible: "_1rsrm2f1hk" }, defaultClass: "_1rsrm2f1hf" }, announceGradientFrom: { conditions: { base: "_1rsrm2f1hl", hover: "_1rsrm2f1hm", active: "_1rsrm2f1hn", selection: "_1rsrm2f1ho", focused: "_1rsrm2f1hp", focusedVisible: "_1rsrm2f1hq" }, defaultClass: "_1rsrm2f1hl" }, announceGradientTo: { conditions: { base: "_1rsrm2f1hr", hover: "_1rsrm2f1hs", active: "_1rsrm2f1ht", selection: "_1rsrm2f1hu", focused: "_1rsrm2f1hv", focusedVisible: "_1rsrm2f1hw" }, defaultClass: "_1rsrm2f1hr" } } } } }, { conditions: { defaultCondition: "smallScreen", conditionNames: ["smallScreen", "largeScreen"], responsiveArray: void 0 }, styles: { alignItems: { values: { "flex-start": { conditions: { smallScreen: "_1rsrm2f0", largeScreen: "_1rsrm2f1" }, defaultClass: "_1rsrm2f0" }, "flex-end": { conditions: { smallScreen: "_1rsrm2f2", largeScreen: "_1rsrm2f3" }, defaultClass: "_1rsrm2f2" }, center: { conditions: { smallScreen: "_1rsrm2f4", largeScreen: "_1rsrm2f5" }, defaultClass: "_1rsrm2f4" } } }, display: { values: { none: { conditions: { smallScreen: "_1rsrm2f6", largeScreen: "_1rsrm2f7" }, defaultClass: "_1rsrm2f6" }, block: { conditions: { smallScreen: "_1rsrm2f8", largeScreen: "_1rsrm2f9" }, defaultClass: "_1rsrm2f8" }, flex: { conditions: { smallScreen: "_1rsrm2fa", largeScreen: "_1rsrm2fb" }, defaultClass: "_1rsrm2fa" }, inline: { conditions: { smallScreen: "_1rsrm2fc", largeScreen: "_1rsrm2fd" }, defaultClass: "_1rsrm2fc" } } } } }, { conditions: void 0, styles: { margin: { mappings: ["marginTop", "marginBottom", "marginLeft", "marginRight"] }, marginX: { mappings: ["marginLeft", "marginRight"] }, marginY: { mappings: ["marginTop", "marginBottom"] }, padding: { mappings: ["paddingTop", "paddingBottom", "paddingLeft", "paddingRight"] }, paddingX: { mappings: ["paddingLeft", "paddingRight"] }, paddingY: { mappings: ["paddingTop", "paddingBottom"] }, alignSelf: { values: { "flex-start": { defaultClass: "_1rsrm2fe" }, "flex-end": { defaultClass: "_1rsrm2ff" }, center: { defaultClass: "_1rsrm2fg" } } }, backgroundSize: { values: { cover: { defaultClass: "_1rsrm2fh" } } }, borderRadius: { values: { "1": { defaultClass: "_1rsrm2fi" }, "4": { defaultClass: "_1rsrm2fj" }, "6": { defaultClass: "_1rsrm2fk" }, "8": { defaultClass: "_1rsrm2fl" }, "10": { defaultClass: "_1rsrm2fm" }, "11": { defaultClass: "_1rsrm2fn" }, "13": { defaultClass: "_1rsrm2fo" }, "16": { defaultClass: "_1rsrm2fp" }, "24": { defaultClass: "_1rsrm2fq" }, actionButton: { defaultClass: "_1rsrm2fr" }, connectButton: { defaultClass: "_1rsrm2fs" }, menuButton: { defaultClass: "_1rsrm2ft" }, modal: { defaultClass: "_1rsrm2fu" }, modalMobile: { defaultClass: "_1rsrm2fv" }, modalActionButton: { defaultClass: "_1rsrm2fw" }, modalActionButtonMobile: { defaultClass: "_1rsrm2fx" }, full: { defaultClass: "_1rsrm2fy" } } }, borderStyle: { values: { solid: { defaultClass: "_1rsrm2fz" }, dotted: { defaultClass: "_1rsrm2f10" }, hidden: { defaultClass: "_1rsrm2f11" } } }, borderWidth: { values: { "0": { defaultClass: "_1rsrm2f12" }, "1": { defaultClass: "_1rsrm2f13" }, "2": { defaultClass: "_1rsrm2f14" }, "3": { defaultClass: "_1rsrm2f15" }, "4": { defaultClass: "_1rsrm2f16" }, "0.5": { defaultClass: "_1rsrm2f17" } } }, cursor: { values: { help: { defaultClass: "_1rsrm2f18" }, pointer: { defaultClass: "_1rsrm2f19" }, "not-allowed": { defaultClass: "_1rsrm2f1a" }, "default": { defaultClass: "_1rsrm2f1b" } } }, flexDirection: { values: { row: { defaultClass: "_1rsrm2f1c" }, column: { defaultClass: "_1rsrm2f1d" } } }, fontFamily: { values: { body: { defaultClass: "_1rsrm2f1e" } } }, fontSize: { values: { "10": { defaultClass: "_1rsrm2f1f" }, "12": { defaultClass: "_1rsrm2f1g" }, "13": { defaultClass: "_1rsrm2f1h" }, "14": { defaultClass: "_1rsrm2f1i" }, "16": { defaultClass: "_1rsrm2f1j" }, "18": { defaultClass: "_1rsrm2f1k" }, "20": { defaultClass: "_1rsrm2f1l" }, "21": { defaultClass: "_1rsrm2f1m" }, "40": { defaultClass: "_1rsrm2f1n" }, "57": { defaultClass: "_1rsrm2f1o" } } }, fontWeight: { values: { regular: { defaultClass: "_1rsrm2f1p" }, medium: { defaultClass: "_1rsrm2f1q" }, semibold: { defaultClass: "_1rsrm2f1r" }, bold: { defaultClass: "_1rsrm2f1s" }, heavy: { defaultClass: "_1rsrm2f1t" } } }, gap: { values: { "0": { defaultClass: "_1rsrm2f1u" }, "1": { defaultClass: "_1rsrm2f1v" }, "2": { defaultClass: "_1rsrm2f1w" }, "3": { defaultClass: "_1rsrm2f1x" }, "4": { defaultClass: "_1rsrm2f1y" }, "5": { defaultClass: "_1rsrm2f1z" }, "6": { defaultClass: "_1rsrm2f20" }, "7": { defaultClass: "_1rsrm2f21" }, "8": { defaultClass: "_1rsrm2f22" }, "9": { defaultClass: "_1rsrm2f23" }, "10": { defaultClass: "_1rsrm2f24" }, "11": { defaultClass: "_1rsrm2f25" }, "12": { defaultClass: "_1rsrm2f26" }, "13": { defaultClass: "_1rsrm2f27" }, "14": { defaultClass: "_1rsrm2f28" }, "15": { defaultClass: "_1rsrm2f29" }, "16": { defaultClass: "_1rsrm2f2a" }, "18": { defaultClass: "_1rsrm2f2b" }, "20": { defaultClass: "_1rsrm2f2c" }, "24": { defaultClass: "_1rsrm2f2d" }, "28": { defaultClass: "_1rsrm2f2e" }, "30": { defaultClass: "_1rsrm2f2f" }, "32": { defaultClass: "_1rsrm2f2g" }, "36": { defaultClass: "_1rsrm2f2h" }, "44": { defaultClass: "_1rsrm2f2i" }, "64": { defaultClass: "_1rsrm2f2j" }, "-1": { defaultClass: "_1rsrm2f2k" } } }, height: { values: { "1": { defaultClass: "_1rsrm2f2l" }, "2": { defaultClass: "_1rsrm2f2m" }, "4": { defaultClass: "_1rsrm2f2n" }, "8": { defaultClass: "_1rsrm2f2o" }, "10": { defaultClass: "_1rsrm2f2p" }, "11": { defaultClass: "_1rsrm2f2q" }, "12": { defaultClass: "_1rsrm2f2r" }, "13": { defaultClass: "_1rsrm2f2s" }, "14": { defaultClass: "_1rsrm2f2t" }, "15": { defaultClass: "_1rsrm2f2u" }, "16": { defaultClass: "_1rsrm2f2v" }, "18": { defaultClass: "_1rsrm2f2w" }, "20": { defaultClass: "_1rsrm2f2x" }, "24": { defaultClass: "_1rsrm2f2y" }, "28": { defaultClass: "_1rsrm2f2z" }, "30": { defaultClass: "_1rsrm2f30" }, "32": { defaultClass: "_1rsrm2f31" }, "34": { defaultClass: "_1rsrm2f32" }, "36": { defaultClass: "_1rsrm2f33" }, "40": { defaultClass: "_1rsrm2f34" }, "44": { defaultClass: "_1rsrm2f35" }, "48": { defaultClass: "_1rsrm2f36" }, "50": { defaultClass: "_1rsrm2f37" }, "54": { defaultClass: "_1rsrm2f38" }, "57": { defaultClass: "_1rsrm2f39" }, "60": { defaultClass: "_1rsrm2f3a" }, "72": { defaultClass: "_1rsrm2f3b" }, "93": { defaultClass: "_1rsrm2f3c" }, "96": { defaultClass: "_1rsrm2f3d" }, "100": { defaultClass: "_1rsrm2f3e" }, "108": { defaultClass: "_1rsrm2f3f" }, "120": { defaultClass: "_1rsrm2f3g" }, "180": { defaultClass: "_1rsrm2f3h" }, "200": { defaultClass: "_1rsrm2f3i" }, "240": { defaultClass: "_1rsrm2f3j" }, half: { defaultClass: "_1rsrm2f3k" }, full: { defaultClass: "_1rsrm2f3l" }, max: { defaultClass: "_1rsrm2f3m" } } }, justifyContent: { values: { "flex-start": { defaultClass: "_1rsrm2f3n" }, "flex-end": { defaultClass: "_1rsrm2f3o" }, center: { defaultClass: "_1rsrm2f3p" }, "space-between": { defaultClass: "_1rsrm2f3q" }, "space-around": { defaultClass: "_1rsrm2f3r" } } }, textAlign: { values: { left: { defaultClass: "_1rsrm2f3s" }, center: { defaultClass: "_1rsrm2f3t" }, right: { defaultClass: "_1rsrm2f3u" }, inherit: { defaultClass: "_1rsrm2f3v" } } }, marginBottom: { values: { "0": { defaultClass: "_1rsrm2f3w" }, "1": { defaultClass: "_1rsrm2f3x" }, "2": { defaultClass: "_1rsrm2f3y" }, "3": { defaultClass: "_1rsrm2f3z" }, "4": { defaultClass: "_1rsrm2f40" }, "5": { defaultClass: "_1rsrm2f41" }, "6": { defaultClass: "_1rsrm2f42" }, "7": { defaultClass: "_1rsrm2f43" }, "8": { defaultClass: "_1rsrm2f44" }, "9": { defaultClass: "_1rsrm2f45" }, "10": { defaultClass: "_1rsrm2f46" }, "11": { defaultClass: "_1rsrm2f47" }, "12": { defaultClass: "_1rsrm2f48" }, "13": { defaultClass: "_1rsrm2f49" }, "14": { defaultClass: "_1rsrm2f4a" }, "15": { defaultClass: "_1rsrm2f4b" }, "16": { defaultClass: "_1rsrm2f4c" }, "18": { defaultClass: "_1rsrm2f4d" }, "20": { defaultClass: "_1rsrm2f4e" }, "24": { defaultClass: "_1rsrm2f4f" }, "28": { defaultClass: "_1rsrm2f4g" }, "30": { defaultClass: "_1rsrm2f4h" }, "32": { defaultClass: "_1rsrm2f4i" }, "36": { defaultClass: "_1rsrm2f4j" }, "44": { defaultClass: "_1rsrm2f4k" }, "64": { defaultClass: "_1rsrm2f4l" }, auto: { defaultClass: "_1rsrm2f4m" }, "-18": { defaultClass: "_1rsrm2f4n" }, "-12": { defaultClass: "_1rsrm2f4o" }, "-1": { defaultClass: "_1rsrm2f4p" } } }, marginLeft: { values: { "0": { defaultClass: "_1rsrm2f4q" }, "1": { defaultClass: "_1rsrm2f4r" }, "2": { defaultClass: "_1rsrm2f4s" }, "3": { defaultClass: "_1rsrm2f4t" }, "4": { defaultClass: "_1rsrm2f4u" }, "5": { defaultClass: "_1rsrm2f4v" }, "6": { defaultClass: "_1rsrm2f4w" }, "7": { defaultClass: "_1rsrm2f4x" }, "8": { defaultClass: "_1rsrm2f4y" }, "9": { defaultClass: "_1rsrm2f4z" }, "10": { defaultClass: "_1rsrm2f50" }, "11": { defaultClass: "_1rsrm2f51" }, "12": { defaultClass: "_1rsrm2f52" }, "13": { defaultClass: "_1rsrm2f53" }, "14": { defaultClass: "_1rsrm2f54" }, "15": { defaultClass: "_1rsrm2f55" }, "16": { defaultClass: "_1rsrm2f56" }, "18": { defaultClass: "_1rsrm2f57" }, "20": { defaultClass: "_1rsrm2f58" }, "24": { defaultClass: "_1rsrm2f59" }, "28": { defaultClass: "_1rsrm2f5a" }, "30": { defaultClass: "_1rsrm2f5b" }, "32": { defaultClass: "_1rsrm2f5c" }, "36": { defaultClass: "_1rsrm2f5d" }, "44": { defaultClass: "_1rsrm2f5e" }, "64": { defaultClass: "_1rsrm2f5f" }, auto: { defaultClass: "_1rsrm2f5g" }, "-18": { defaultClass: "_1rsrm2f5h" }, "-12": { defaultClass: "_1rsrm2f5i" }, "-1": { defaultClass: "_1rsrm2f5j" } } }, marginRight: { values: { "0": { defaultClass: "_1rsrm2f5k" }, "1": { defaultClass: "_1rsrm2f5l" }, "2": { defaultClass: "_1rsrm2f5m" }, "3": { defaultClass: "_1rsrm2f5n" }, "4": { defaultClass: "_1rsrm2f5o" }, "5": { defaultClass: "_1rsrm2f5p" }, "6": { defaultClass: "_1rsrm2f5q" }, "7": { defaultClass: "_1rsrm2f5r" }, "8": { defaultClass: "_1rsrm2f5s" }, "9": { defaultClass: "_1rsrm2f5t" }, "10": { defaultClass: "_1rsrm2f5u" }, "11": { defaultClass: "_1rsrm2f5v" }, "12": { defaultClass: "_1rsrm2f5w" }, "13": { defaultClass: "_1rsrm2f5x" }, "14": { defaultClass: "_1rsrm2f5y" }, "15": { defaultClass: "_1rsrm2f5z" }, "16": { defaultClass: "_1rsrm2f60" }, "18": { defaultClass: "_1rsrm2f61" }, "20": { defaultClass: "_1rsrm2f62" }, "24": { defaultClass: "_1rsrm2f63" }, "28": { defaultClass: "_1rsrm2f64" }, "30": { defaultClass: "_1rsrm2f65" }, "32": { defaultClass: "_1rsrm2f66" }, "36": { defaultClass: "_1rsrm2f67" }, "44": { defaultClass: "_1rsrm2f68" }, "64": { defaultClass: "_1rsrm2f69" }, auto: { defaultClass: "_1rsrm2f6a" }, "-18": { defaultClass: "_1rsrm2f6b" }, "-12": { defaultClass: "_1rsrm2f6c" }, "-1": { defaultClass: "_1rsrm2f6d" } } }, marginTop: { values: { "0": { defaultClass: "_1rsrm2f6e" }, "1": { defaultClass: "_1rsrm2f6f" }, "2": { defaultClass: "_1rsrm2f6g" }, "3": { defaultClass: "_1rsrm2f6h" }, "4": { defaultClass: "_1rsrm2f6i" }, "5": { defaultClass: "_1rsrm2f6j" }, "6": { defaultClass: "_1rsrm2f6k" }, "7": { defaultClass: "_1rsrm2f6l" }, "8": { defaultClass: "_1rsrm2f6m" }, "9": { defaultClass: "_1rsrm2f6n" }, "10": { defaultClass: "_1rsrm2f6o" }, "11": { defaultClass: "_1rsrm2f6p" }, "12": { defaultClass: "_1rsrm2f6q" }, "13": { defaultClass: "_1rsrm2f6r" }, "14": { defaultClass: "_1rsrm2f6s" }, "15": { defaultClass: "_1rsrm2f6t" }, "16": { defaultClass: "_1rsrm2f6u" }, "18": { defaultClass: "_1rsrm2f6v" }, "20": { defaultClass: "_1rsrm2f6w" }, "24": { defaultClass: "_1rsrm2f6x" }, "28": { defaultClass: "_1rsrm2f6y" }, "30": { defaultClass: "_1rsrm2f6z" }, "32": { defaultClass: "_1rsrm2f70" }, "36": { defaultClass: "_1rsrm2f71" }, "44": { defaultClass: "_1rsrm2f72" }, "64": { defaultClass: "_1rsrm2f73" }, auto: { defaultClass: "_1rsrm2f74" }, "-18": { defaultClass: "_1rsrm2f75" }, "-12": { defaultClass: "_1rsrm2f76" }, "-1": { defaultClass: "_1rsrm2f77" } } }, minHeight: { values: { "1": { defaultClass: "_1rsrm2f78" }, "2": { defaultClass: "_1rsrm2f79" }, "4": { defaultClass: "_1rsrm2f7a" }, "8": { defaultClass: "_1rsrm2f7b" }, "10": { defaultClass: "_1rsrm2f7c" }, "11": { defaultClass: "_1rsrm2f7d" }, "12": { defaultClass: "_1rsrm2f7e" }, "13": { defaultClass: "_1rsrm2f7f" }, "14": { defaultClass: "_1rsrm2f7g" }, "15": { defaultClass: "_1rsrm2f7h" }, "16": { defaultClass: "_1rsrm2f7i" }, "18": { defaultClass: "_1rsrm2f7j" }, "20": { defaultClass: "_1rsrm2f7k" }, "24": { defaultClass: "_1rsrm2f7l" }, "28": { defaultClass: "_1rsrm2f7m" }, "30": { defaultClass: "_1rsrm2f7n" }, "32": { defaultClass: "_1rsrm2f7o" }, "34": { defaultClass: "_1rsrm2f7p" }, "36": { defaultClass: "_1rsrm2f7q" }, "40": { defaultClass: "_1rsrm2f7r" }, "44": { defaultClass: "_1rsrm2f7s" }, "48": { defaultClass: "_1rsrm2f7t" }, "50": { defaultClass: "_1rsrm2f7u" }, "54": { defaultClass: "_1rsrm2f7v" }, "57": { defaultClass: "_1rsrm2f7w" }, "60": { defaultClass: "_1rsrm2f7x" }, "72": { defaultClass: "_1rsrm2f7y" }, "93": { defaultClass: "_1rsrm2f7z" }, "96": { defaultClass: "_1rsrm2f80" }, "100": { defaultClass: "_1rsrm2f81" }, "108": { defaultClass: "_1rsrm2f82" }, "120": { defaultClass: "_1rsrm2f83" }, "180": { defaultClass: "_1rsrm2f84" }, "200": { defaultClass: "_1rsrm2f85" }, "240": { defaultClass: "_1rsrm2f86" }, half: { defaultClass: "_1rsrm2f87" }, full: { defaultClass: "_1rsrm2f88" }, max: { defaultClass: "_1rsrm2f89" } } }, maxHeight: { values: { "1": { defaultClass: "_1rsrm2f8a" }, "2": { defaultClass: "_1rsrm2f8b" }, "4": { defaultClass: "_1rsrm2f8c" }, "8": { defaultClass: "_1rsrm2f8d" }, "10": { defaultClass: "_1rsrm2f8e" }, "11": { defaultClass: "_1rsrm2f8f" }, "12": { defaultClass: "_1rsrm2f8g" }, "13": { defaultClass: "_1rsrm2f8h" }, "14": { defaultClass: "_1rsrm2f8i" }, "15": { defaultClass: "_1rsrm2f8j" }, "16": { defaultClass: "_1rsrm2f8k" }, "18": { defaultClass: "_1rsrm2f8l" }, "20": { defaultClass: "_1rsrm2f8m" }, "24": { defaultClass: "_1rsrm2f8n" }, "28": { defaultClass: "_1rsrm2f8o" }, "30": { defaultClass: "_1rsrm2f8p" }, "32": { defaultClass: "_1rsrm2f8q" }, "34": { defaultClass: "_1rsrm2f8r" }, "36": { defaultClass: "_1rsrm2f8s" }, "40": { defaultClass: "_1rsrm2f8t" }, "44": { defaultClass: "_1rsrm2f8u" }, "48": { defaultClass: "_1rsrm2f8v" }, "50": { defaultClass: "_1rsrm2f8w" }, "54": { defaultClass: "_1rsrm2f8x" }, "57": { defaultClass: "_1rsrm2f8y" }, "60": { defaultClass: "_1rsrm2f8z" }, "72": { defaultClass: "_1rsrm2f90" }, "93": { defaultClass: "_1rsrm2f91" }, "96": { defaultClass: "_1rsrm2f92" }, "100": { defaultClass: "_1rsrm2f93" }, "108": { defaultClass: "_1rsrm2f94" }, "120": { defaultClass: "_1rsrm2f95" }, "180": { defaultClass: "_1rsrm2f96" }, "200": { defaultClass: "_1rsrm2f97" }, "240": { defaultClass: "_1rsrm2f98" }, half: { defaultClass: "_1rsrm2f99" }, full: { defaultClass: "_1rsrm2f9a" }, max: { defaultClass: "_1rsrm2f9b" } } }, maxWidth: { values: { "1": { defaultClass: "_1rsrm2f9c" }, "2": { defaultClass: "_1rsrm2f9d" }, "4": { defaultClass: "_1rsrm2f9e" }, "8": { defaultClass: "_1rsrm2f9f" }, "10": { defaultClass: "_1rsrm2f9g" }, "11": { defaultClass: "_1rsrm2f9h" }, "12": { defaultClass: "_1rsrm2f9i" }, "13": { defaultClass: "_1rsrm2f9j" }, "14": { defaultClass: "_1rsrm2f9k" }, "15": { defaultClass: "_1rsrm2f9l" }, "16": { defaultClass: "_1rsrm2f9m" }, "18": { defaultClass: "_1rsrm2f9n" }, "20": { defaultClass: "_1rsrm2f9o" }, "24": { defaultClass: "_1rsrm2f9p" }, "28": { defaultClass: "_1rsrm2f9q" }, "30": { defaultClass: "_1rsrm2f9r" }, "32": { defaultClass: "_1rsrm2f9s" }, "34": { defaultClass: "_1rsrm2f9t" }, "36": { defaultClass: "_1rsrm2f9u" }, "40": { defaultClass: "_1rsrm2f9v" }, "44": { defaultClass: "_1rsrm2f9w" }, "48": { defaultClass: "_1rsrm2f9x" }, "50": { defaultClass: "_1rsrm2f9y" }, "54": { defaultClass: "_1rsrm2f9z" }, "57": { defaultClass: "_1rsrm2fa0" }, "60": { defaultClass: "_1rsrm2fa1" }, "72": { defaultClass: "_1rsrm2fa2" }, "93": { defaultClass: "_1rsrm2fa3" }, "96": { defaultClass: "_1rsrm2fa4" }, "100": { defaultClass: "_1rsrm2fa5" }, "108": { defaultClass: "_1rsrm2fa6" }, "120": { defaultClass: "_1rsrm2fa7" }, "180": { defaultClass: "_1rsrm2fa8" }, "200": { defaultClass: "_1rsrm2fa9" }, "240": { defaultClass: "_1rsrm2faa" }, half: { defaultClass: "_1rsrm2fab" }, full: { defaultClass: "_1rsrm2fac" }, max: { defaultClass: "_1rsrm2fad" } } }, minWidth: { values: { "1": { defaultClass: "_1rsrm2fae" }, "2": { defaultClass: "_1rsrm2faf" }, "4": { defaultClass: "_1rsrm2fag" }, "8": { defaultClass: "_1rsrm2fah" }, "10": { defaultClass: "_1rsrm2fai" }, "11": { defaultClass: "_1rsrm2faj" }, "12": { defaultClass: "_1rsrm2fak" }, "13": { defaultClass: "_1rsrm2fal" }, "14": { defaultClass: "_1rsrm2fam" }, "15": { defaultClass: "_1rsrm2fan" }, "16": { defaultClass: "_1rsrm2fao" }, "18": { defaultClass: "_1rsrm2fap" }, "20": { defaultClass: "_1rsrm2faq" }, "24": { defaultClass: "_1rsrm2far" }, "28": { defaultClass: "_1rsrm2fas" }, "30": { defaultClass: "_1rsrm2fat" }, "32": { defaultClass: "_1rsrm2fau" }, "34": { defaultClass: "_1rsrm2fav" }, "36": { defaultClass: "_1rsrm2faw" }, "40": { defaultClass: "_1rsrm2fax" }, "44": { defaultClass: "_1rsrm2fay" }, "48": { defaultClass: "_1rsrm2faz" }, "50": { defaultClass: "_1rsrm2fb0" }, "54": { defaultClass: "_1rsrm2fb1" }, "57": { defaultClass: "_1rsrm2fb2" }, "60": { defaultClass: "_1rsrm2fb3" }, "72": { defaultClass: "_1rsrm2fb4" }, "93": { defaultClass: "_1rsrm2fb5" }, "96": { defaultClass: "_1rsrm2fb6" }, "100": { defaultClass: "_1rsrm2fb7" }, "108": { defaultClass: "_1rsrm2fb8" }, "120": { defaultClass: "_1rsrm2fb9" }, "180": { defaultClass: "_1rsrm2fba" }, "200": { defaultClass: "_1rsrm2fbb" }, "240": { defaultClass: "_1rsrm2fbc" }, half: { defaultClass: "_1rsrm2fbd" }, full: { defaultClass: "_1rsrm2fbe" }, max: { defaultClass: "_1rsrm2fbf" } } }, overflow: { values: { hidden: { defaultClass: "_1rsrm2fbg" } } }, paddingBottom: { values: { "0": { defaultClass: "_1rsrm2fbh" }, "1": { defaultClass: "_1rsrm2fbi" }, "2": { defaultClass: "_1rsrm2fbj" }, "3": { defaultClass: "_1rsrm2fbk" }, "4": { defaultClass: "_1rsrm2fbl" }, "5": { defaultClass: "_1rsrm2fbm" }, "6": { defaultClass: "_1rsrm2fbn" }, "7": { defaultClass: "_1rsrm2fbo" }, "8": { defaultClass: "_1rsrm2fbp" }, "9": { defaultClass: "_1rsrm2fbq" }, "10": { defaultClass: "_1rsrm2fbr" }, "11": { defaultClass: "_1rsrm2fbs" }, "12": { defaultClass: "_1rsrm2fbt" }, "13": { defaultClass: "_1rsrm2fbu" }, "14": { defaultClass: "_1rsrm2fbv" }, "15": { defaultClass: "_1rsrm2fbw" }, "16": { defaultClass: "_1rsrm2fbx" }, "18": { defaultClass: "_1rsrm2fby" }, "20": { defaultClass: "_1rsrm2fbz" }, "24": { defaultClass: "_1rsrm2fc0" }, "28": { defaultClass: "_1rsrm2fc1" }, "30": { defaultClass: "_1rsrm2fc2" }, "32": { defaultClass: "_1rsrm2fc3" }, "36": { defaultClass: "_1rsrm2fc4" }, "44": { defaultClass: "_1rsrm2fc5" }, "64": { defaultClass: "_1rsrm2fc6" }, "-1": { defaultClass: "_1rsrm2fc7" } } }, paddingLeft: { values: { "0": { defaultClass: "_1rsrm2fc8" }, "1": { defaultClass: "_1rsrm2fc9" }, "2": { defaultClass: "_1rsrm2fca" }, "3": { defaultClass: "_1rsrm2fcb" }, "4": { defaultClass: "_1rsrm2fcc" }, "5": { defaultClass: "_1rsrm2fcd" }, "6": { defaultClass: "_1rsrm2fce" }, "7": { defaultClass: "_1rsrm2fcf" }, "8": { defaultClass: "_1rsrm2fcg" }, "9": { defaultClass: "_1rsrm2fch" }, "10": { defaultClass: "_1rsrm2fci" }, "11": { defaultClass: "_1rsrm2fcj" }, "12": { defaultClass: "_1rsrm2fck" }, "13": { defaultClass: "_1rsrm2fcl" }, "14": { defaultClass: "_1rsrm2fcm" }, "15": { defaultClass: "_1rsrm2fcn" }, "16": { defaultClass: "_1rsrm2fco" }, "18": { defaultClass: "_1rsrm2fcp" }, "20": { defaultClass: "_1rsrm2fcq" }, "24": { defaultClass: "_1rsrm2fcr" }, "28": { defaultClass: "_1rsrm2fcs" }, "30": { defaultClass: "_1rsrm2fct" }, "32": { defaultClass: "_1rsrm2fcu" }, "36": { defaultClass: "_1rsrm2fcv" }, "44": { defaultClass: "_1rsrm2fcw" }, "64": { defaultClass: "_1rsrm2fcx" }, "-1": { defaultClass: "_1rsrm2fcy" } } }, paddingRight: { values: { "0": { defaultClass: "_1rsrm2fcz" }, "1": { defaultClass: "_1rsrm2fd0" }, "2": { defaultClass: "_1rsrm2fd1" }, "3": { defaultClass: "_1rsrm2fd2" }, "4": { defaultClass: "_1rsrm2fd3" }, "5": { defaultClass: "_1rsrm2fd4" }, "6": { defaultClass: "_1rsrm2fd5" }, "7": { defaultClass: "_1rsrm2fd6" }, "8": { defaultClass: "_1rsrm2fd7" }, "9": { defaultClass: "_1rsrm2fd8" }, "10": { defaultClass: "_1rsrm2fd9" }, "11": { defaultClass: "_1rsrm2fda" }, "12": { defaultClass: "_1rsrm2fdb" }, "13": { defaultClass: "_1rsrm2fdc" }, "14": { defaultClass: "_1rsrm2fdd" }, "15": { defaultClass: "_1rsrm2fde" }, "16": { defaultClass: "_1rsrm2fdf" }, "18": { defaultClass: "_1rsrm2fdg" }, "20": { defaultClass: "_1rsrm2fdh" }, "24": { defaultClass: "_1rsrm2fdi" }, "28": { defaultClass: "_1rsrm2fdj" }, "30": { defaultClass: "_1rsrm2fdk" }, "32": { defaultClass: "_1rsrm2fdl" }, "36": { defaultClass: "_1rsrm2fdm" }, "44": { defaultClass: "_1rsrm2fdn" }, "64": { defaultClass: "_1rsrm2fdo" }, "-1": { defaultClass: "_1rsrm2fdp" } } }, paddingTop: { values: { "0": { defaultClass: "_1rsrm2fdq" }, "1": { defaultClass: "_1rsrm2fdr" }, "2": { defaultClass: "_1rsrm2fds" }, "3": { defaultClass: "_1rsrm2fdt" }, "4": { defaultClass: "_1rsrm2fdu" }, "5": { defaultClass: "_1rsrm2fdv" }, "6": { defaultClass: "_1rsrm2fdw" }, "7": { defaultClass: "_1rsrm2fdx" }, "8": { defaultClass: "_1rsrm2fdy" }, "9": { defaultClass: "_1rsrm2fdz" }, "10": { defaultClass: "_1rsrm2fe0" }, "11": { defaultClass: "_1rsrm2fe1" }, "12": { defaultClass: "_1rsrm2fe2" }, "13": { defaultClass: "_1rsrm2fe3" }, "14": { defaultClass: "_1rsrm2fe4" }, "15": { defaultClass: "_1rsrm2fe5" }, "16": { defaultClass: "_1rsrm2fe6" }, "18": { defaultClass: "_1rsrm2fe7" }, "20": { defaultClass: "_1rsrm2fe8" }, "24": { defaultClass: "_1rsrm2fe9" }, "28": { defaultClass: "_1rsrm2fea" }, "30": { defaultClass: "_1rsrm2feb" }, "32": { defaultClass: "_1rsrm2fec" }, "36": { defaultClass: "_1rsrm2fed" }, "44": { defaultClass: "_1rsrm2fee" }, "64": { defaultClass: "_1rsrm2fef" }, "-1": { defaultClass: "_1rsrm2feg" } } }, position: { values: { absolute: { defaultClass: "_1rsrm2feh" }, fixed: { defaultClass: "_1rsrm2fei" }, relative: { defaultClass: "_1rsrm2fej" } } }, right: { values: { "0": { defaultClass: "_1rsrm2fek" } } }, transition: { values: { "default": { defaultClass: "_1rsrm2fel" }, transform: { defaultClass: "_1rsrm2fem" } } }, userSelect: { values: { none: { defaultClass: "_1rsrm2fen" } } }, width: { values: { "1": { defaultClass: "_1rsrm2feo" }, "2": { defaultClass: "_1rsrm2fep" }, "4": { defaultClass: "_1rsrm2feq" }, "8": { defaultClass: "_1rsrm2fer" }, "10": { defaultClass: "_1rsrm2fes" }, "11": { defaultClass: "_1rsrm2fet" }, "12": { defaultClass: "_1rsrm2feu" }, "13": { defaultClass: "_1rsrm2fev" }, "14": { defaultClass: "_1rsrm2few" }, "15": { defaultClass: "_1rsrm2fex" }, "16": { defaultClass: "_1rsrm2fey" }, "18": { defaultClass: "_1rsrm2fez" }, "20": { defaultClass: "_1rsrm2ff0" }, "24": { defaultClass: "_1rsrm2ff1" }, "28": { defaultClass: "_1rsrm2ff2" }, "30": { defaultClass: "_1rsrm2ff3" }, "32": { defaultClass: "_1rsrm2ff4" }, "34": { defaultClass: "_1rsrm2ff5" }, "36": { defaultClass: "_1rsrm2ff6" }, "40": { defaultClass: "_1rsrm2ff7" }, "44": { defaultClass: "_1rsrm2ff8" }, "48": { defaultClass: "_1rsrm2ff9" }, "50": { defaultClass: "_1rsrm2ffa" }, "54": { defaultClass: "_1rsrm2ffb" }, "57": { defaultClass: "_1rsrm2ffc" }, "60": { defaultClass: "_1rsrm2ffd" }, "72": { defaultClass: "_1rsrm2ffe" }, "93": { defaultClass: "_1rsrm2fff" }, "96": { defaultClass: "_1rsrm2ffg" }, "100": { defaultClass: "_1rsrm2ffh" }, "108": { defaultClass: "_1rsrm2ffi" }, "120": { defaultClass: "_1rsrm2ffj" }, "180": { defaultClass: "_1rsrm2ffk" }, "200": { defaultClass: "_1rsrm2ffl" }, "240": { defaultClass: "_1rsrm2ffm" }, half: { defaultClass: "_1rsrm2ffn" }, full: { defaultClass: "_1rsrm2ffo" }, max: { defaultClass: "_1rsrm2ffp" } } }, backdropFilter: { values: { modalOverlay: { defaultClass: "_1rsrm2ffq" } } } } });
47
+ var themeVars = { colors: { accentColor: "var(--rk-colors-accentColor)", accentColorForeground: "var(--rk-colors-accentColorForeground)", actionButtonBorder: "var(--rk-colors-actionButtonBorder)", connectButtonBackground: "var(--rk-colors-connectButtonBackground)", connectButtonBackgroundError: "var(--rk-colors-connectButtonBackgroundError)", connectButtonText: "var(--rk-colors-connectButtonText)", connectButtonTextError: "var(--rk-colors-connectButtonTextError)", connectionIndicator: "var(--rk-colors-connectionIndicator)", error: "var(--rk-colors-error)", errorBackground: "var(--rk-colors-errorBackground)", errorBorder: "var(--rk-colors-errorBorder)", generalBorder: "var(--rk-colors-generalBorder)", generalBorderDim: "var(--rk-colors-generalBorderDim)", menuItemBackground: "var(--rk-colors-menuItemBackground)", selectedOptionBorder: "var(--rk-colors-selectedOptionBorder)", focusedOptionBorder: "var(--rk-colors-focusedOptionBorder)", standby: "var(--rk-colors-standby)", success: "var(--rk-colors-success)", chainIconBorder: "var(--rk-colors-chainIconBorder)", modalBackdrop: "var(--rk-colors-modalBackdrop)", modalBackground: "var(--rk-colors-modalBackground)", modalBorder: "var(--rk-colors-modalBorder)", offBackground: "var(--rk-colors-offBackground)", offBackgroundComplimentary: "var(--rk-colors-offBackgroundComplimentary)", hoverState: "var(--rk-colors-hoverState)", lightStroke: "var(--rk-colors-lightStroke)", mediumStroke: "var(--rk-colors-mediumStroke)", heavyStroke: "var(--rk-colors-heavyStroke)", strokeColor: "var(--rk-colors-strokeColor)", dydxSwitchActiveBackground: "var(--rk-colors-dydxSwitchActiveBackground)", primaryText: "var(--rk-colors-primaryText)", secondaryText: "var(--rk-colors-secondaryText)", tertiaryText: "var(--rk-colors-tertiaryText)", textSelection: "var(--rk-colors-textSelection)", inputBackground: "var(--rk-colors-inputBackground)", inputBorderBase: "var(--rk-colors-inputBorderBase)", inputBorderHover: "var(--rk-colors-inputBorderHover)", actionColor: "var(--rk-colors-actionColor)", actionColorHover: "var(--rk-colors-actionColorHover)", actionColorDisabled: "var(--rk-colors-actionColorDisabled)", buttonPrimary: "var(--rk-colors-buttonPrimary)", buttonDisabled: "var(--rk-colors-buttonDisabled)", buttonWarning: "var(--rk-colors-buttonWarning)", buttonSuccess: "var(--rk-colors-buttonSuccess)", buttonTextPrimary: "var(--rk-colors-buttonTextPrimary)", buttonTextDisabled: "var(--rk-colors-buttonTextDisabled)", transparent: "var(--rk-colors-transparent)", buttonBackgroundTertiary: "var(--rk-colors-buttonBackgroundTertiary)", buttonBackgroundHoverTertiary: "var(--rk-colors-buttonBackgroundHoverTertiary)", buttonTextTertiary: "var(--rk-colors-buttonTextTertiary)", buttonTextDisabledTertiary: "var(--rk-colors-buttonTextDisabledTertiary)", buttonStrokeTertiary: "var(--rk-colors-buttonStrokeTertiary)", buttonBackground: "var(--rk-colors-buttonBackground)", buttonBackgroundHover: "var(--rk-colors-buttonBackgroundHover)", buttonBackgroundDisabled: "var(--rk-colors-buttonBackgroundDisabled)", buttonStroke: "var(--rk-colors-buttonStroke)", buttonTextSecondaryDisabled: "var(--rk-colors-buttonTextSecondaryDisabled)", buttonTextSecondary: "var(--rk-colors-buttonTextSecondary)", buttonIconBackgroundHover: "var(--rk-colors-buttonIconBackgroundHover)", buttonIconBackgroundPressed: "var(--rk-colors-buttonIconBackgroundPressed)", buttonIconStroke: "var(--rk-colors-buttonIconStroke)", badgeBackgroundSuccess: "var(--rk-colors-badgeBackgroundSuccess)", badgeBorderSuccess: "var(--rk-colors-badgeBorderSuccess)", badgeTextSuccess: "var(--rk-colors-badgeTextSuccess)", inputAmountQuickOptionBaseBackground: "var(--rk-colors-inputAmountQuickOptionBaseBackground)", inputAmountQuickOptionHoverBackground: "var(--rk-colors-inputAmountQuickOptionHoverBackground)", inputAmountQuickOptionActiveBackground: "var(--rk-colors-inputAmountQuickOptionActiveBackground)", inputAmountQuickOptionDisabledBackground: "var(--rk-colors-inputAmountQuickOptionDisabledBackground)", inputAmountQuickOptionBaseBorder: "var(--rk-colors-inputAmountQuickOptionBaseBorder)", inputAmountQuickOptionHoverBorder: "var(--rk-colors-inputAmountQuickOptionHoverBorder)", inputAmountQuickOptionActiveBorder: "var(--rk-colors-inputAmountQuickOptionActiveBorder)", inputAmountQuickOptionFocusedBorder: "var(--rk-colors-inputAmountQuickOptionFocusedBorder)", announceGradientFrom: "var(--rk-colors-announceGradientFrom)", announceGradientTo: "var(--rk-colors-announceGradientTo)" }, fonts: { body: "var(--rk-fonts-body)" }, fontWeight: { regular: "var(--rk-fontWeight-regular)", medium: "var(--rk-fontWeight-medium)", semibold: "var(--rk-fontWeight-semibold)", bold: "var(--rk-fontWeight-bold)", heavy: "var(--rk-fontWeight-heavy)" }, fontSize: { "10": { fontSize: "var(--rk-fontSize-10-fontSize)", lineHeight: "var(--rk-fontSize-10-lineHeight)" }, "12": { fontSize: "var(--rk-fontSize-12-fontSize)", lineHeight: "var(--rk-fontSize-12-lineHeight)" }, "13": { fontSize: "var(--rk-fontSize-13-fontSize)", lineHeight: "var(--rk-fontSize-13-lineHeight)" }, "14": { fontSize: "var(--rk-fontSize-14-fontSize)", lineHeight: "var(--rk-fontSize-14-lineHeight)" }, "16": { fontSize: "var(--rk-fontSize-16-fontSize)", lineHeight: "var(--rk-fontSize-16-lineHeight)" }, "18": { fontSize: "var(--rk-fontSize-18-fontSize)", lineHeight: "var(--rk-fontSize-18-lineHeight)" }, "20": { fontSize: "var(--rk-fontSize-20-fontSize)", lineHeight: "var(--rk-fontSize-20-lineHeight)" }, "21": { fontSize: "var(--rk-fontSize-21-fontSize)", lineHeight: "var(--rk-fontSize-21-lineHeight)" }, "40": { fontSize: "var(--rk-fontSize-40-fontSize)", lineHeight: "var(--rk-fontSize-40-lineHeight)" }, "57": { fontSize: "var(--rk-fontSize-57-fontSize)", lineHeight: "var(--rk-fontSize-57-lineHeight)" } }, radii: { actionButton: "var(--rk-radii-actionButton)", connectButton: "var(--rk-radii-connectButton)", menuButton: "var(--rk-radii-menuButton)", modal: "var(--rk-radii-modal)", modalMobile: "var(--rk-radii-modalMobile)", modalActionButton: "var(--rk-radii-modalActionButton)", modalActionButtonMobile: "var(--rk-radii-modalActionButtonMobile)" }, shadows: { connectButton: "var(--rk-shadows-connectButton)", dialog: "var(--rk-shadows-dialog)", selectedOption: "var(--rk-shadows-selectedOption)", selectedWallet: "var(--rk-shadows-selectedWallet)", dropdown: "var(--rk-shadows-dropdown)", notification: "var(--rk-shadows-notification)", vertexDropdown: "var(--rk-shadows-vertexDropdown)" }, blurs: { modalOverlay: "var(--rk-blurs-modalOverlay)" }, moonpayTheme: "var(--rk-moonpayTheme)" };
48
48
 
49
49
  // src/css/atoms.ts
50
50
  var atoms = ({ reset, ...rest }) => {
@@ -183,12 +183,13 @@ var PLACEHOLDER_FUNKIT_USER_INFO = {
183
183
  // src/providers/FunkitConfigContext.tsx
184
184
  var DEFAULT_TEXT_CUSTOMIZATIONS = {
185
185
  brokerageOrExchange: "Connect Exchange",
186
- debitOrCredit: "Card",
186
+ debitOrCredit: "Use card",
187
187
  accountBalance: "Wallet",
188
188
  selectAccount: "Select an exchange",
189
189
  sourceMethodTitle: "Your source",
190
190
  transferTokens: "Transfer Crypto",
191
191
  confirmationScreen: {
192
+ payAmountLabel: "You will pay",
192
193
  receiveAmountLabel: "You will receive"
193
194
  }
194
195
  };
@@ -219,15 +220,15 @@ function useFunkitConfig() {
219
220
  ...originalFunkitConfig,
220
221
  loginConfig: {
221
222
  ...DEFAULT_FUNKIT_CONFIG.loginConfig,
222
- ...originalFunkitConfig.loginConfig || {},
223
+ ...originalFunkitConfig.loginConfig,
223
224
  web2SocialLogins: {
224
225
  ...DEFAULT_FUNKIT_CONFIG.loginConfig.web2SocialLogins,
225
- ...originalFunkitConfig.loginConfig.web2SocialLogins || {}
226
+ ...originalFunkitConfig.loginConfig.web2SocialLogins
226
227
  }
227
228
  },
228
229
  textCustomizations: {
229
230
  ...DEFAULT_FUNKIT_CONFIG.textCustomizations,
230
- ...originalFunkitConfig.textCustomizations || {}
231
+ ...originalFunkitConfig.textCustomizations
231
232
  }
232
233
  };
233
234
  }, [originalFunkitConfig]);
@@ -527,7 +528,7 @@ function Avatar({ address, imageUrl, loading, size }) {
527
528
  }
528
529
 
529
530
  // src/components/ConnectButton/ConnectButton.tsx
530
- import React208, { useEffect as useEffect47, useState as useState66 } from "react";
531
+ import React210, { useEffect as useEffect46, useState as useState66 } from "react";
531
532
 
532
533
  // src/css/touchableStyles.css.ts
533
534
  var active = { shrink: "_7rkubb8", shrinkSm: "_7rkubb9" };
@@ -631,12 +632,12 @@ import PrivyJS, {
631
632
  getUserEmbeddedWallet,
632
633
  LocalStorage
633
634
  } from "@privy-io/js-sdk-core";
634
- import React205, {
635
+ import React207, {
635
636
  createContext as createContext18,
636
637
  useCallback as useCallback42,
637
638
  useContext as useContext18,
638
- useEffect as useEffect45,
639
- useMemo as useMemo38,
639
+ useEffect as useEffect44,
640
+ useMemo as useMemo39,
640
641
  useState as useState63
641
642
  } from "react";
642
643
  import { useConfig as useConfig5, useConnect as useConnect2, useDisconnect as useDisconnect2 } from "wagmi";
@@ -1049,12 +1050,12 @@ var useFunkitConnectChainsById = () => groupChainsById(useFunkitConnectChains())
1049
1050
  var useInitialChainId = () => useContext4(FunkitConnectChainContext).initialChainId;
1050
1051
 
1051
1052
  // src/providers/ModalContext.tsx
1052
- import React204, {
1053
+ import React206, {
1053
1054
  createContext as createContext17,
1054
1055
  useCallback as useCallback41,
1055
1056
  useContext as useContext17,
1056
- useEffect as useEffect44,
1057
- useMemo as useMemo37,
1057
+ useEffect as useEffect43,
1058
+ useMemo as useMemo38,
1058
1059
  useState as useState62
1059
1060
  } from "react";
1060
1061
  import { useAccount as useAccount10, useAccountEffect as useAccountEffect2, useConfig as useConfig4 } from "wagmi";
@@ -1366,7 +1367,7 @@ import React12 from "react";
1366
1367
  var funButtonClickableStyle = "_1tyx5nu4";
1367
1368
  var funButtonDisabledStyle = "_1tyx5nu6";
1368
1369
  var funButtonNonClickableStyle = "_1tyx5nu5";
1369
- var funLinkButtonStyle = "_1tyx5nu1 _1rsrm2f19l";
1370
+ var funLinkButtonStyle = "_1tyx5nu1 _1rsrm2f1c9";
1370
1371
  var pressedStyles = "_1tyx5nu3";
1371
1372
  var transitionStyles = "_1tyx5nu2";
1372
1373
 
@@ -1379,29 +1380,30 @@ var getTranslateStyle = (iconVisualWeightCenter) => {
1379
1380
  const translateValue = iconVisualWeightCenter === "left" || iconVisualWeightCenter === "top" ? "-1px" : "1px";
1380
1381
  return { transform: `translate${translateDirection}(${translateValue})` };
1381
1382
  };
1382
- var getBackground = (showBackground, disableHoverStyles, isDisabled) => {
1383
+ var getBackground = (variant, disableHoverStyles, isDisabled, colorOverrides) => {
1383
1384
  if (isDisabled) {
1384
- return "buttonIconBackgroundHover";
1385
+ return colorOverrides?.disabledBackground ?? "buttonIconBackgroundHover";
1385
1386
  }
1386
- const base4 = showBackground ? "offBackground" : "transparent";
1387
+ const base4 = variant === "filled" ? colorOverrides?.baseBackground ?? "offBackground" : "transparent";
1387
1388
  if (disableHoverStyles) {
1388
1389
  return base4;
1389
1390
  }
1390
1391
  return {
1391
1392
  base: base4,
1392
- hover: showBackground ? "buttonIconBackgroundPressed" : "buttonIconBackgroundHover",
1393
- active: "buttonIconBackgroundPressed"
1393
+ hover: colorOverrides?.hoverBackground ?? (variant === "filled" ? "buttonIconBackgroundPressed" : "buttonIconBackgroundHover"),
1394
+ active: colorOverrides?.activeBackground ?? "buttonIconBackgroundPressed"
1394
1395
  };
1395
1396
  };
1396
- var getBorderColor = (showBorder, disableHoverStyles) => {
1397
- const base4 = showBorder ? "buttonIconBackgroundHover" : "transparent";
1397
+ var getBorderColor = (variant, disableHoverStyles, colorOverrides) => {
1398
+ const base4 = variant === "outlined" ? colorOverrides?.baseBorder ?? "buttonIconBackgroundHover" : "transparent";
1398
1399
  if (disableHoverStyles) {
1399
1400
  return base4;
1400
1401
  }
1401
1402
  return {
1402
1403
  base: base4,
1403
- hover: showBorder ? "buttonIconStroke" : base4,
1404
- active: "buttonIconStroke"
1404
+ hover: variant === "outlined" ? colorOverrides?.hoverBorder ?? "buttonIconStroke" : base4,
1405
+ active: colorOverrides?.activeBorder ?? "buttonIconStroke",
1406
+ focusedVisible: colorOverrides?.focusedBorder ?? "buttonIconStroke"
1405
1407
  };
1406
1408
  };
1407
1409
  var FunIconButton = ({
@@ -1419,10 +1421,10 @@ var FunIconButton = ({
1419
1421
  borderRadius = "full",
1420
1422
  style,
1421
1423
  variant = "quiet",
1424
+ colorOverrides,
1422
1425
  ...props
1423
1426
  }) => {
1424
1427
  const disableHoverStyles = !onClick;
1425
- const showBackground = variant === "filled";
1426
1428
  const showBorder = variant === "outlined";
1427
1429
  return /* @__PURE__ */ React12.createElement(
1428
1430
  Box,
@@ -1432,8 +1434,13 @@ var FunIconButton = ({
1432
1434
  justifyContent: "center",
1433
1435
  as,
1434
1436
  "aria-label": ariaLabel,
1435
- background: getBackground(showBackground, disableHoverStyles, isDisabled),
1436
- borderColor: getBorderColor(showBorder, disableHoverStyles),
1437
+ background: getBackground(
1438
+ variant,
1439
+ disableHoverStyles,
1440
+ isDisabled,
1441
+ colorOverrides
1442
+ ),
1443
+ borderColor: getBorderColor(variant, disableHoverStyles, colorOverrides),
1437
1444
  borderRadius,
1438
1445
  borderStyle: "solid",
1439
1446
  borderWidth: showBorder ? "1" : "2",
@@ -3249,7 +3256,8 @@ var flagConfig = {
3249
3256
  [FlagKey.ShowInfoBanner]: {
3250
3257
  type: "string",
3251
3258
  default_value: JSON.stringify({
3252
- message: ""
3259
+ message: "Gas prices may be higher than usual.",
3260
+ type: "alert"
3253
3261
  })
3254
3262
  },
3255
3263
  [FlagKey.CheckoutNotificationsRefreshInterval]: {
@@ -5239,19 +5247,20 @@ var DialogTitle = ({
5239
5247
  onBack?.();
5240
5248
  setAnimateOut(false);
5241
5249
  };
5242
- const adjustDydxVisuals = useDydxHideBack(hasBackButton, !!dydxHideBack);
5243
- const adjustVertexVisuals = isVertexCustomer(apiKey);
5244
- const baseTitleFontSize = adjustVertexVisuals ? "20" : "13";
5245
- const baseTitleMetaFontSize = adjustVertexVisuals ? "16" : "10";
5246
- const iconButtonBorderRadius = adjustVertexVisuals ? "actionButton" : "full";
5250
+ const isDyDx = useDydxHideBack(hasBackButton, !!dydxHideBack);
5251
+ const isVertex = isVertexCustomer(apiKey);
5252
+ const baseTitleFontSize = isVertex ? "20" : "13";
5253
+ const baseTitleMetaFontSize = isVertex ? "16" : "10";
5254
+ const iconButtonBorderRadius = isVertex ? "actionButton" : "full";
5247
5255
  return /* @__PURE__ */ React56.createElement(
5248
5256
  Box,
5249
5257
  {
5250
5258
  className: clsx5(titleContainer, className),
5251
5259
  paddingX: "6",
5252
- paddingY: adjustDydxVisuals ? "16" : "12"
5260
+ paddingY: isDyDx ? "16" : "12",
5261
+ gap: "8"
5253
5262
  },
5254
- adjustDydxVisuals ? null : /* @__PURE__ */ React56.createElement(Box, { style: { flexBasis: 0, flexGrow: 1 } }, hasBackButton && /* @__PURE__ */ React56.createElement(
5263
+ isDyDx ? null : /* @__PURE__ */ React56.createElement(Box, { style: { ...!isVertex && { flexBasis: 0, flexGrow: 1 } } }, hasBackButton && /* @__PURE__ */ React56.createElement(
5255
5264
  FunBackButton,
5256
5265
  {
5257
5266
  onBack: handleBack,
@@ -5265,7 +5274,7 @@ var DialogTitle = ({
5265
5274
  textAlign: "center",
5266
5275
  display: "flex",
5267
5276
  alignItems: "center",
5268
- justifyContent: "center",
5277
+ justifyContent: isVertex ? "flex-start" : "center",
5269
5278
  flexDirection: "column",
5270
5279
  className: animateOut ? animateTitleOutClass : animateTitleInClass
5271
5280
  },
@@ -5276,11 +5285,11 @@ var DialogTitle = ({
5276
5285
  weight: "medium",
5277
5286
  size: baseTitleFontSize,
5278
5287
  testId: "fun-modal-title-section",
5279
- className: clsx5(adjustDydxVisuals && dydxTitle)
5288
+ className: clsx5(isDyDx && dydxTitle)
5280
5289
  },
5281
5290
  title
5282
5291
  ),
5283
- titleMeta && !adjustDydxVisuals && /* @__PURE__ */ React56.createElement(Text, { color: "secondaryText", size: baseTitleMetaFontSize }, titleMeta)
5292
+ titleMeta && !isDyDx && /* @__PURE__ */ React56.createElement(Text, { color: "secondaryText", size: baseTitleMetaFontSize }, titleMeta)
5284
5293
  )),
5285
5294
  /* @__PURE__ */ React56.createElement(
5286
5295
  Box,
@@ -5749,8 +5758,38 @@ var HOME_TOKEN_BALANCE_DISPLAY_ROW_HEIGHT = 52;
5749
5758
  var DEFAULT_ICON_SIZE = "24";
5750
5759
  var OVERLAY_Z_INDEX = 100;
5751
5760
 
5752
- // src/domains/checkoutState.ts
5761
+ // src/domains/checkout.ts
5762
+ import {
5763
+ getRiskAssessmentForAddress
5764
+ } from "@funkit/api-base";
5753
5765
  import { CheckoutState as CheckoutState3 } from "@funkit/api-base";
5766
+ var BLOCKED_RISK_LEVELS = ["Severe", "High"];
5767
+ var hasRisk = async (apiKey, walletAddress, customRecipient) => {
5768
+ const getUserWalletRisk = walletAddress ? getRiskAssessmentForAddress({
5769
+ address: walletAddress,
5770
+ apiKey,
5771
+ logger
5772
+ }).then((assessment) => assessment?.risk) : null;
5773
+ const getRecipientWalletRisk = customRecipient ? getRiskAssessmentForAddress({
5774
+ address: customRecipient,
5775
+ apiKey,
5776
+ logger
5777
+ }).then((assessment) => assessment?.risk) : null;
5778
+ const addressRisks = await Promise.all([
5779
+ getUserWalletRisk,
5780
+ getRecipientWalletRisk
5781
+ ]);
5782
+ const isCheckoutRisky = addressRisks.some(
5783
+ (risk) => risk ? BLOCKED_RISK_LEVELS.includes(risk) : false
5784
+ );
5785
+ logger.log("riskAssessment_isCheckoutRisky", {
5786
+ isCheckoutRisky,
5787
+ addressRisks,
5788
+ walletAddress,
5789
+ customRecipient
5790
+ });
5791
+ return isCheckoutRisky;
5792
+ };
5754
5793
  function getCheckoutStateBooleans(checkoutState, refundState) {
5755
5794
  const isProcessing = IN_PROGRESS_CHECKOUT_STATES.includes(checkoutState);
5756
5795
  const isCompleted = checkoutState === CheckoutState3.COMPLETED;
@@ -6402,10 +6441,10 @@ import { arbitrum, polygon as polygon3 } from "viem/chains";
6402
6441
  import { useAccount as useAccount4 } from "wagmi";
6403
6442
 
6404
6443
  // src/domains/asset.ts
6405
- import { polygon as polygon2 } from "viem/chains";
6406
6444
  import { FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO5 } from "@funkit/chains";
6407
6445
  import { round } from "@funkit/utils";
6408
6446
  import { FlagKey as FlagKey5 } from "@funkit/utils";
6447
+ import { polygon as polygon2 } from "viem/chains";
6409
6448
  import { mantle, zkSync } from "viem/chains";
6410
6449
 
6411
6450
  // src/utils/consts.ts
@@ -6418,7 +6457,7 @@ var MAXIMUM_MOONPAY_DEPOSIT_AMOUNT_USD = 1e4;
6418
6457
  var generateMoonpayCurrencyCode = (tokenSymbol, chainId) => {
6419
6458
  let moonpayChainName = FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO4[chainId]?.moonpayChainName;
6420
6459
  if (moonpayChainName == null) {
6421
- throw new Error("Moonpay not supported on testnets");
6460
+ throw new Error("MoonPay not supported on testnets");
6422
6461
  }
6423
6462
  if (moonpayChainName !== "") {
6424
6463
  moonpayChainName = `_${moonpayChainName}`;
@@ -6675,6 +6714,7 @@ var circleSkeletonClass = "dj0x603";
6675
6714
  function FunSkeletonBlock({
6676
6715
  width = "full",
6677
6716
  borderRadius = "4",
6717
+ height,
6678
6718
  ...props
6679
6719
  }) {
6680
6720
  return /* @__PURE__ */ React63.createElement(
@@ -6683,7 +6723,11 @@ function FunSkeletonBlock({
6683
6723
  borderRadius,
6684
6724
  className: animateSkeletonClass,
6685
6725
  width,
6686
- ...props
6726
+ ...props,
6727
+ style: {
6728
+ // when height is passed as a theme value, it will already contain 'px' suffix, if passed as BoxProps['height'], it will missing the suffix
6729
+ height: height.endsWith("px") ? height : `${height}px`
6730
+ }
6687
6731
  }
6688
6732
  );
6689
6733
  }
@@ -7198,9 +7242,9 @@ var SearchIcon = () => {
7198
7242
  };
7199
7243
 
7200
7244
  // src/components/FunInput/FunInput.css.ts
7201
- var inputClass = "zue0i62 _1rsrm2fe2 _1rsrm2fbt _1rsrm2fck _1rsrm2fdb _1rsrm2f17x";
7202
- var inputClassDisabled = "zue0i64 _1rsrm2fe2 _1rsrm2fbt _1rsrm2fck _1rsrm2fdb _1rsrm2f19f";
7203
- var inputClassError = "zue0i66 _1rsrm2fe2 _1rsrm2fbt _1rsrm2fck _1rsrm2fdb _1rsrm2f149";
7245
+ var inputClass = "zue0i62 _1rsrm2fe2 _1rsrm2fbt _1rsrm2fck _1rsrm2fdb _1rsrm2f1al";
7246
+ var inputClassDisabled = "zue0i64 _1rsrm2fe2 _1rsrm2fbt _1rsrm2fck _1rsrm2fdb _1rsrm2f1c3";
7247
+ var inputClassError = "zue0i66 _1rsrm2fe2 _1rsrm2fbt _1rsrm2fck _1rsrm2fdb _1rsrm2f16x";
7204
7248
  var numberInputResetStyle = "zue0i60";
7205
7249
 
7206
7250
  // src/components/FunInput/FunInput.tsx
@@ -9207,13 +9251,13 @@ var SourceDestinationSummary = ({
9207
9251
  checkoutHistoryItem
9208
9252
  }) => {
9209
9253
  const { walletAddress } = useGeneralWallet();
9210
- const funkitConfig = useFunkitConfig();
9254
+ const { uiCustomizations, apiKey } = useFunkitConfig();
9211
9255
  const walletIcon = usePaymentMethodIcon("balance" /* ACCOUNT_BALANCE */, 15);
9212
9256
  const checkoutItem = checkoutHistoryItem.clientMetadata;
9213
- const customDestinationConfig = funkitConfig.uiCustomizations?.confirmationScreen?.destinationConfig;
9257
+ const customDestinationConfig = uiCustomizations?.confirmationScreen?.destinationConfig;
9214
9258
  const customRecipient = checkoutItem.initSettings.config.customRecipient;
9215
9259
  const isAccountPayment = checkoutItem.selectedPaymentMethodInfo?.paymentMethod === "balance" /* ACCOUNT_BALANCE */;
9216
- const isSameDestination = isAccountPayment && !customRecipient;
9260
+ const isSameDestination = isAccountPayment && !customRecipient && !isVertexCustomer(apiKey);
9217
9261
  const destinationIcon = customDestinationConfig?.icon ?? walletIcon;
9218
9262
  const destinationLabel = customDestinationConfig?.text ?? formatAddress3(customRecipient ?? walletAddress ?? "");
9219
9263
  const sourceRedirectAddress = checkoutItem?.selectedPaymentMethodInfo?.paymentMethod === "balance" /* ACCOUNT_BALANCE */ ? checkoutHistoryItem?.sourceOfFund?.split("|")?.[2] : null;
@@ -9221,9 +9265,7 @@ var SourceDestinationSummary = ({
9221
9265
  FunTxSummaryBox,
9222
9266
  {
9223
9267
  padding: "12",
9224
- ...isVertexCustomer(funkitConfig.apiKey) && {
9225
- borderRadius: "actionButton"
9226
- }
9268
+ ...isVertexCustomer(apiKey) && { borderRadius: "actionButton" }
9227
9269
  },
9228
9270
  checkoutItem.selectedPaymentMethodInfo && /* @__PURE__ */ React98.createElement(FunTxSummaryLineItem, { paddingY: "0" }, /* @__PURE__ */ React98.createElement(
9229
9271
  FunTxSummaryLineItemKeyText2,
@@ -9369,10 +9411,10 @@ function useInterval(callback, delay) {
9369
9411
  }
9370
9412
 
9371
9413
  // src/components/FunCountdown/FunCountdown.css.ts
9372
- var backgroundRing = "_1t0bc111 _1rsrm2f14r";
9373
- var counterRing = "_1t0bc113 _1rsrm2f12x";
9374
- var pendingBackgroundRing = "_1t0bc116 _1rsrm2f15 _1rsrm2f10 _1rsrm2fw3 _1rsrm2fy";
9375
- var pendingRing = "_1t0bc118 _1rsrm2f15 _1rsrm2f10 _1rsrm2fvx _1rsrm2fy";
9414
+ var backgroundRing = "_1t0bc111 _1rsrm2f17f";
9415
+ var counterRing = "_1t0bc113 _1rsrm2f15l";
9416
+ var pendingBackgroundRing = "_1t0bc116 _1rsrm2f15 _1rsrm2f10 _1rsrm2fxf _1rsrm2fy";
9417
+ var pendingRing = "_1t0bc118 _1rsrm2f15 _1rsrm2f10 _1rsrm2fx9 _1rsrm2fy";
9376
9418
 
9377
9419
  // src/components/FunCountdown/FunCountdown.tsx
9378
9420
  var FunCountdown = ({
@@ -10463,12 +10505,12 @@ import clsx9 from "clsx";
10463
10505
  import React113, { useMemo as useMemo15 } from "react";
10464
10506
 
10465
10507
  // src/components/FunAssetAvatar/FunAssetAvatar.css.ts
10466
- var borderedChainContainerStyle = "_1rsrm2fir _1rsrm2ftr _1rsrm2f13 _1rsrm2fi _1rsrm2fz";
10467
- var chainContainerStyle = "uwrdc21";
10508
+ var chainContainerStyle = "uwrdc22 _1rsrm2fy _1rsrm2fa _1rsrm2f4 _1rsrm2f3p";
10468
10509
  var containerStyle = "uwrdc20";
10469
- var largeChainContainerStyle = "uwrdc22";
10470
10510
 
10471
10511
  // src/components/FunAssetAvatar/FunAssetAvatar.tsx
10512
+ var smallClipPath = "polygon( 99.725% 55.276%,99.725% 55.276%,99.777% 54.755%,99.823% 54.233%,99.865% 53.709%,99.9% 53.183%,99.931% 52.656%,99.956% 52.128%,99.975% 51.598%,99.989% 51.067%,99.997% 50.534%,100% 50%,100% 50%,99.346% 41.89%,97.451% 34.196%,94.419% 27.022%,90.353% 20.471%,85.355% 14.645%,79.529% 9.647%,72.978% 5.581%,65.804% 2.549%,58.11% 0.654%,50% 0%,50% 0%,41.89% 0.654%,34.196% 2.549%,27.022% 5.581%,20.471% 9.647%,14.645% 14.645%,9.647% 20.471%,5.581% 27.022%,2.549% 34.196%,0.654% 41.89%,0% 50%,0% 50%,0.654% 58.11%,2.549% 65.804%,5.581% 72.978%,9.647% 79.529%,14.645% 85.355%,20.471% 90.353%,27.022% 94.419%,34.196% 97.451%,41.89% 99.346%,50% 100%,50% 100%,50.534% 99.997%,51.067% 99.989%,51.598% 99.975%,52.128% 99.956%,52.656% 99.931%,53.183% 99.9%,53.709% 99.865%,54.233% 99.823%,54.755% 99.777%,55.276% 99.725%,55.276% 99.725%,55.224% 99.259%,55.177% 98.792%,55.136% 98.323%,55.1% 97.853%,55.07% 97.381%,55.045% 96.907%,55.025% 96.433%,55.011% 95.956%,55.003% 95.479%,55% 95%,55% 95%,55.524% 88.512%,57.039% 82.357%,59.465% 76.618%,62.718% 71.376%,66.716% 66.716%,71.376% 62.718%,76.618% 59.465%,82.357% 57.039%,88.512% 55.524%,95% 55%,95% 55%,95.479% 55.003%,95.956% 55.011%,96.433% 55.025%,96.907% 55.045%,97.381% 55.07%,97.853% 55.1%,98.323% 55.136%,98.792% 55.177%,99.259% 55.224%,99.725% 55.276% )";
10513
+ var largeClipPath = "polygon( 100% 47.911%,100% 47.911%,98.601% 47.377%,97.177% 46.894%,95.729% 46.464%,94.26% 46.088%,92.769% 45.766%,91.258% 45.5%,89.728% 45.292%,88.181% 45.141%,86.617% 45.05%,85.037% 45.02%,85.037% 45.02%,78.546% 45.543%,72.388% 47.06%,66.647% 49.486%,61.403% 52.741%,56.74% 56.74%,52.741% 61.403%,49.486% 66.647%,47.06% 72.388%,45.543% 78.546%,45.02% 85.037%,45.02% 85.037%,45.05% 86.617%,45.141% 88.181%,45.292% 89.728%,45.5% 91.258%,45.766% 92.769%,46.088% 94.26%,46.464% 95.729%,46.894% 97.177%,47.377% 98.601%,47.911% 100%,47.911% 100%,40.094% 99.059%,32.696% 96.962%,25.811% 93.804%,19.535% 89.682%,13.963% 84.691%,9.19% 78.925%,5.312% 72.479%,2.425% 65.45%,0.622% 57.933%,0% 50.022%,0% 50.022%,0.655% 41.908%,2.55% 34.211%,5.583% 27.034%,9.651% 20.48%,14.651% 14.651%,20.48% 9.651%,27.034% 5.583%,34.211% 2.55%,41.908% 0.655%,50.022% 0%,50.022% 0%,57.933% 0.622%,65.45% 2.425%,72.479% 5.312%,78.925% 9.19%,84.691% 13.963%,89.682% 19.535%,93.804% 25.811%,96.962% 32.696%,99.059% 40.094%,100% 47.911% )";
10472
10514
  function FunAssetAvatar({
10473
10515
  assetSrc,
10474
10516
  assetTicker,
@@ -10477,7 +10519,6 @@ function FunAssetAvatar({
10477
10519
  chainId,
10478
10520
  prioritizeDefaults = true,
10479
10521
  hideIfUnknown = false,
10480
- borderedChainIcon = true,
10481
10522
  largeChainIcon = false
10482
10523
  }) {
10483
10524
  const chainMetadata = chainMetadataById[Number.parseInt((chainId || "").toString())] || null;
@@ -10490,7 +10531,8 @@ function FunAssetAvatar({
10490
10531
  return assetSrc || defaultSrc;
10491
10532
  }, [assetSrc, assetTicker, prioritizeDefaults]);
10492
10533
  const showChainIcon = isNotNullish6(chainMetadata);
10493
- const chainIconSize = Number.parseInt(assetIconSize) / 2;
10534
+ const chainIconSize = Number.parseInt(assetIconSize) / 2 + 2;
10535
+ const chainContainerSize = chainIconSize + 4;
10494
10536
  return hideIfUnknown && !finalAssetSrc ? null : /* @__PURE__ */ React113.createElement(Box, { id: "container", alignSelf: "center" }, /* @__PURE__ */ React113.createElement(
10495
10537
  Box,
10496
10538
  {
@@ -10498,36 +10540,52 @@ function FunAssetAvatar({
10498
10540
  height: assetIconSize,
10499
10541
  className: containerStyle
10500
10542
  },
10501
- /* @__PURE__ */ React113.createElement(Box, { width: assetIconSize, height: assetIconSize }, /* @__PURE__ */ React113.createElement(
10502
- AsyncImage,
10543
+ /* @__PURE__ */ React113.createElement(
10544
+ Box,
10503
10545
  {
10504
- alt: assetName,
10505
- src: finalAssetSrc,
10506
- fallbackSrc: FALLBACK_ASSET,
10507
- background: void 0,
10508
- borderColor: "generalBorderDim",
10509
- borderRadius: "full",
10510
- height: assetIconSize,
10511
10546
  width: assetIconSize,
10512
- testId: `fun-asset-${assetTicker}-icon`,
10513
- useAsImage: true
10514
- }
10515
- )),
10547
+ height: assetIconSize,
10548
+ style: {
10549
+ // apply clip-paths only if we're showing the chain icon
10550
+ ...showChainIcon && {
10551
+ clipPath: chainIconSize <= 10 ? largeClipPath : smallClipPath
10552
+ }
10553
+ }
10554
+ },
10555
+ /* @__PURE__ */ React113.createElement(
10556
+ AsyncImage,
10557
+ {
10558
+ alt: assetName,
10559
+ src: finalAssetSrc,
10560
+ fallbackSrc: FALLBACK_ASSET,
10561
+ background: void 0,
10562
+ borderColor: "generalBorderDim",
10563
+ borderRadius: "full",
10564
+ height: assetIconSize,
10565
+ width: assetIconSize,
10566
+ testId: `fun-asset-${assetTicker}-icon`,
10567
+ useAsImage: true
10568
+ }
10569
+ )
10570
+ ),
10516
10571
  showChainIcon ? /* @__PURE__ */ React113.createElement(
10517
10572
  Box,
10518
10573
  {
10519
- className: clsx9(
10520
- largeChainIcon ? largeChainContainerStyle : chainContainerStyle,
10521
- borderedChainIcon && borderedChainContainerStyle
10522
- )
10574
+ style: {
10575
+ width: chainContainerSize,
10576
+ height: chainContainerSize,
10577
+ bottom: `-${chainIconSize / 2}px`,
10578
+ right: `-${chainIconSize / 2}px`,
10579
+ backgroundColor: "transparent"
10580
+ },
10581
+ className: clsx9(chainContainerStyle)
10523
10582
  },
10524
10583
  /* @__PURE__ */ React113.createElement(
10525
10584
  AsyncImage,
10526
10585
  {
10527
10586
  alt: chainMetadata.name,
10528
10587
  src: chainMetadata.iconUrl || "",
10529
- background: borderedChainIcon ? chainMetadata.iconBackground : void 0,
10530
- borderRadius: "1",
10588
+ borderRadius: "full",
10531
10589
  height: largeChainIcon ? chainIconSize : chainIconSize - 2,
10532
10590
  width: largeChainIcon ? chainIconSize : chainIconSize - 2,
10533
10591
  testId: `fun-asset-chain-${chainId}-icon`
@@ -10561,7 +10619,7 @@ var RedRoundErrorCross = ({ size = 15 }) => {
10561
10619
  };
10562
10620
 
10563
10621
  // src/modals/ProfileDetails/FunProfileViews/Home/HomeCheckoutDisplayRow.css.ts
10564
- var homeCheckoutDisplayRowStyle = { defaultBorder: "ukct4t1 _1rsrm2fyf _1rsrm2fv7", defaultBackground: "_1rsrm2fnf _1rsrm2fjt", hoverBackground: "_1rsrm2fjg" };
10622
+ var homeCheckoutDisplayRowStyle = { defaultBorder: "ukct4t1 _1rsrm2fzr _1rsrm2fwj", defaultBackground: "_1rsrm2fnf _1rsrm2fjt", hoverBackground: "_1rsrm2fjg" };
10565
10623
 
10566
10624
  // src/modals/ProfileDetails/FunProfileViews/Home/HomeCheckoutDisplayRow.tsx
10567
10625
  var TEXT_SIZE_MEDIUM = "13";
@@ -11718,86 +11776,15 @@ function ChainModal({ onClose, open }) {
11718
11776
  }
11719
11777
 
11720
11778
  // src/modals/CheckoutModal/FunCheckoutModal.tsx
11721
- import React202 from "react";
11722
-
11723
- // src/hooks/useIsCheckoutRisky.ts
11724
- import { getRiskAssessmentForAddress } from "@funkit/api-base";
11725
- import { FlagKey as FlagKey7 } from "@funkit/utils";
11726
- import { useQuery as useQuery3 } from "@tanstack/react-query";
11727
- import { useEffect as useEffect25 } from "react";
11728
- var BLOCKED_RISK_LEVELS = ["Severe", "High"];
11729
- var hasRisk = async (apiKey, walletAddress, customRecipient) => {
11730
- const getUserWalletRisk = walletAddress ? getRiskAssessmentForAddress({
11731
- address: walletAddress,
11732
- apiKey,
11733
- logger
11734
- }).then((assessment) => assessment?.risk) : null;
11735
- const getRecipientWalletRisk = customRecipient ? getRiskAssessmentForAddress({
11736
- address: customRecipient,
11737
- apiKey,
11738
- logger
11739
- }).then((assessment) => assessment?.risk) : null;
11740
- const addressRisks = await Promise.all([
11741
- getUserWalletRisk,
11742
- getRecipientWalletRisk
11743
- ]);
11744
- const isCheckoutRisky = addressRisks.some(
11745
- (risk) => BLOCKED_RISK_LEVELS.includes(risk || "")
11746
- );
11747
- logger.log("riskAssessment_isCheckoutRisky", {
11748
- isCheckoutRisky,
11749
- addressRisks,
11750
- walletAddress,
11751
- customRecipient
11752
- });
11753
- return isCheckoutRisky;
11754
- };
11755
- function useIsBlacklisted(walletAddress, customRecipient) {
11756
- const flagStr = useFlag(FlagKey7.AddressBlacklist);
11757
- const blacklist = safeJSONParse(flagStr)?.map((addr) => addr.toLowerCase()) || [];
11758
- const isWalletBlacklisted = walletAddress ? blacklist.includes(walletAddress.toLowerCase()) : false;
11759
- const isRecipientBlacklisted = customRecipient ? blacklist.includes(customRecipient.toLowerCase()) : false;
11760
- useEffect25(() => {
11761
- logger.log("riskAssessment_isBlacklisted", {
11762
- isWalletBlacklisted,
11763
- isRecipientBlacklisted,
11764
- walletAddress,
11765
- customRecipient
11766
- });
11767
- }, [
11768
- isWalletBlacklisted,
11769
- isRecipientBlacklisted,
11770
- walletAddress,
11771
- customRecipient
11772
- ]);
11773
- return isWalletBlacklisted || isRecipientBlacklisted;
11774
- }
11775
- var useIsCheckoutRisky = (checkoutItem) => {
11776
- const { walletAddress } = useGeneralWallet();
11777
- const { apiKey } = useFunkitConfig();
11778
- const customRecipient = checkoutItem.initSettings.config.customRecipient;
11779
- const isBlacklisted = useIsBlacklisted(
11780
- walletAddress || void 0,
11781
- customRecipient
11782
- );
11783
- const { data: isRisky } = useQuery3({
11784
- queryKey: ["isCheckoutBlocked", walletAddress, customRecipient],
11785
- queryFn: ({ queryKey: [_, walletAddress2, customRecipient2] }) => hasRisk(apiKey, walletAddress2 || void 0, customRecipient2),
11786
- refetchOnWindowFocus: false,
11787
- refetchOnMount: false,
11788
- staleTime: 5 * 60 * 1e3,
11789
- gcTime: Number.POSITIVE_INFINITY
11790
- });
11791
- return { isCheckoutRisky: isBlacklisted || isRisky };
11792
- };
11779
+ import React204 from "react";
11793
11780
 
11794
11781
  // src/components/DydxSwitchModalTab/DydxSwitchModalTab.tsx
11795
11782
  import React130, { useCallback as useCallback23 } from "react";
11796
11783
 
11797
11784
  // src/hooks/useFunkitMaxCheckoutUsdInfo.ts
11798
- import { FlagKey as FlagKey8, formatCurrencyAndStringify as formatCurrencyAndStringify4 } from "@funkit/utils";
11785
+ import { FlagKey as FlagKey7, formatCurrencyAndStringify as formatCurrencyAndStringify4 } from "@funkit/utils";
11799
11786
  var useFunkitMaxCheckoutUsdInfo = () => {
11800
- const maxCheckoutUsd = Number(useFlag(FlagKey8.MaxCheckoutUsd));
11787
+ const maxCheckoutUsd = Number(useFlag(FlagKey7.MaxCheckoutUsd));
11801
11788
  const limitText = maxCheckoutUsd === Number.MAX_VALUE ? "no" : formatCurrencyAndStringify4(maxCheckoutUsd, {
11802
11789
  decimalPrecisionForSuffix: 0,
11803
11790
  minimumSignificantDigits: 0,
@@ -11931,15 +11918,15 @@ var FunCheckoutBlocked = ({ reason }) => {
11931
11918
  };
11932
11919
 
11933
11920
  // src/providers/FunkitMoonpayProvider.tsx
11934
- import { useQuery as useQuery4 } from "@tanstack/react-query";
11921
+ import { useQuery as useQuery3 } from "@tanstack/react-query";
11935
11922
  import React132, {
11936
11923
  createContext as createContext14,
11937
11924
  useContext as useContext14,
11938
- useEffect as useEffect26,
11925
+ useEffect as useEffect25,
11939
11926
  useMemo as useMemo17,
11940
11927
  useState as useState32
11941
11928
  } from "react";
11942
- import { FlagKey as FlagKey9 } from "@funkit/utils";
11929
+ import { FlagKey as FlagKey8 } from "@funkit/utils";
11943
11930
 
11944
11931
  // src/providers/FunkitSandboxContext.tsx
11945
11932
  import { createContext as createContext13, useContext as useContext13 } from "react";
@@ -11949,7 +11936,7 @@ var useIsFunkitSandboxMode = () => useContext13(FunkitSandboxContext);
11949
11936
  // src/providers/FunkitMoonpayProvider.tsx
11950
11937
  var LazyMoonPayProvider = (props) => {
11951
11938
  const [MoonPayProvider, setMoonPayProvider] = useState32(null);
11952
- useEffect26(() => {
11939
+ useEffect25(() => {
11953
11940
  const loadMoonPayProvider = async () => {
11954
11941
  const module = await import("@moonpay/moonpay-react");
11955
11942
  setMoonPayProvider(() => module.MoonPayProvider);
@@ -11993,7 +11980,7 @@ var isCountryBlocked = (blockedList, userIpInfo) => {
11993
11980
  function useFunkitUserIp() {
11994
11981
  const { moonpayApiKey } = useContext14(FunkitMoonpayContext);
11995
11982
  const { getFlag, isLoading: isLoadingFlags } = useFlags();
11996
- const { data: userIpInfo, isLoading: isLoadingGeoCheck } = useQuery4({
11983
+ const { data: userIpInfo, isLoading: isLoadingGeoCheck } = useQuery3({
11997
11984
  queryKey: ["getUserIpInfo"],
11998
11985
  queryFn: async () => {
11999
11986
  try {
@@ -12021,7 +12008,7 @@ function useFunkitUserIp() {
12021
12008
  if (!userIpInfo) {
12022
12009
  return true;
12023
12010
  }
12024
- const blockedList = getFlag(FlagKey9.BlockedCountries, ALL_MATCH).split(",");
12011
+ const blockedList = getFlag(FlagKey8.BlockedCountries, ALL_MATCH).split(",");
12025
12012
  return isCountryBlocked(blockedList, userIpInfo);
12026
12013
  }, [getFlag, isLoadingFlags, isLoadingGeoCheck, userIpInfo]);
12027
12014
  return {
@@ -12033,7 +12020,7 @@ function useFunkitUserIp() {
12033
12020
 
12034
12021
  // src/modals/CheckoutModal/CheckoutNotifications.tsx
12035
12022
  import clsx14 from "clsx";
12036
- import React139, { useEffect as useEffect28, useMemo as useMemo18, useState as useState34 } from "react";
12023
+ import React139, { useEffect as useEffect27, useMemo as useMemo18, useState as useState34 } from "react";
12037
12024
 
12038
12025
  // src/components/FunNotificationBanner/FunNotificationShowMoreButton.tsx
12039
12026
  import React134 from "react";
@@ -12105,8 +12092,8 @@ var FunNotificationShowMoreButton = ({
12105
12092
  import {
12106
12093
  getCheckoutsByUserId as getCheckoutsByUserId2
12107
12094
  } from "@funkit/api-base";
12108
- import { FlagKey as FlagKey10 } from "@funkit/utils";
12109
- import { useQuery as useQuery5 } from "@tanstack/react-query";
12095
+ import { FlagKey as FlagKey9 } from "@funkit/utils";
12096
+ import { useQuery as useQuery4 } from "@tanstack/react-query";
12110
12097
  var hasCorrectPaymentMethod = (checkout, paymentMethod) => {
12111
12098
  if (!paymentMethod) return true;
12112
12099
  return checkout.clientMetadata.selectedPaymentMethodInfo?.paymentMethod === paymentMethod;
@@ -12114,7 +12101,7 @@ var hasCorrectPaymentMethod = (checkout, paymentMethod) => {
12114
12101
  var isRecent = (checkout, timestampCutoff) => checkout.createdTimeMs > timestampCutoff;
12115
12102
  var DEFAULT_CUTOFF = 7 * 24 * 60 * 60 * 1e3;
12116
12103
  function useCheckoutRefreshInterval() {
12117
- const str = useFlag(FlagKey10.CheckoutNotificationsRefreshInterval);
12104
+ const str = useFlag(FlagKey9.CheckoutNotificationsRefreshInterval);
12118
12105
  return safeJSONParse(str) || { listRefresh: 50 * 1e3, itemRefresh: 5 * 1e3 };
12119
12106
  }
12120
12107
  var useRecentCheckouts = ({
@@ -12127,7 +12114,7 @@ var useRecentCheckouts = ({
12127
12114
  const { listRefresh } = useCheckoutRefreshInterval();
12128
12115
  const defaultTimestampCutoff = Date.now() - DEFAULT_CUTOFF;
12129
12116
  const timestampCutoff = newerThanMs ?? defaultTimestampCutoff;
12130
- const query = useQuery5({
12117
+ const query = useQuery4({
12131
12118
  queryKey: ["checkouts", userInfo.id],
12132
12119
  queryFn: async () => {
12133
12120
  const checkouts = await getCheckoutsByUserId2({
@@ -12153,13 +12140,13 @@ import React136, { useState as useState33 } from "react";
12153
12140
  import clsx13 from "clsx";
12154
12141
 
12155
12142
  // src/components/FunNotificationBanner/FunNotificationBanner.css.ts
12156
- var notificationBannerStyle = "_1rsrm2fej _1rsrm2fp _1rsrm2fj3 _1rsrm2f12l";
12157
- var showMoreButtonStyle = "_4yitd93 _1rsrm2fsl _1rsrm2f12 _1rsrm2fz _1rsrm2fj3 _1rsrm2fjg _1rsrm2ffo";
12143
+ var notificationBannerStyle = "_1rsrm2fej _1rsrm2fp _1rsrm2fj3 _1rsrm2f159";
12144
+ var showMoreButtonStyle = "_4yitd93 _1rsrm2ftx _1rsrm2f12 _1rsrm2fz _1rsrm2fj3 _1rsrm2fjg _1rsrm2ffo";
12158
12145
 
12159
12146
  // src/components/FunNotificationBanner/FunNotificationBannerIcon.tsx
12160
12147
  import clsx12 from "clsx";
12161
12148
  import { motion, useAnimate } from "motion/react";
12162
- import React135, { useCallback as useCallback24, useEffect as useEffect27, useRef as useRef12 } from "react";
12149
+ import React135, { useCallback as useCallback24, useEffect as useEffect26, useRef as useRef12 } from "react";
12163
12150
 
12164
12151
  // src/components/FunNotificationBanner/FunNotificationBannerIcon.css.ts
12165
12152
  var STATUS_SPINNER_BOTTOM_POSITION = -5;
@@ -12609,7 +12596,7 @@ var FunNotificationBannerIcon = ({
12609
12596
  ]);
12610
12597
  }, [animate]);
12611
12598
  const statusRef = useRef12(status);
12612
- useEffect27(() => {
12599
+ useEffect26(() => {
12613
12600
  if (statusRef.current !== status) {
12614
12601
  if (statusRef.current === "processing" && status === "completed") {
12615
12602
  triggerAnimationProcessingToCompleted();
@@ -12840,7 +12827,7 @@ var FunNotificationBanner = ({
12840
12827
  import React137 from "react";
12841
12828
 
12842
12829
  // src/components/FunNotificationBanner/FunNotificationBannerSummary.css.ts
12843
- var wrapperStyles = "_1rsrm2fci _1rsrm2fd9 _1rsrm2fdy _1rsrm2fbp _1rsrm2fj3 _1rsrm2fl _1rsrm2fv3 _1rsrm2f13 _1rsrm2fz _1rsrm2fa _1rsrm2f1d _1rsrm2f22";
12830
+ var wrapperStyles = "_1rsrm2fci _1rsrm2fd9 _1rsrm2fdy _1rsrm2fbp _1rsrm2fj3 _1rsrm2fl _1rsrm2fwf _1rsrm2f13 _1rsrm2fz _1rsrm2fa _1rsrm2f1d _1rsrm2f22";
12844
12831
 
12845
12832
  // src/components/FunNotificationBanner/FunNotificationBannerSummary.tsx
12846
12833
  var FunNotificationBannerSummary = ({
@@ -12853,11 +12840,11 @@ var FunNotificationBannerSummary = ({
12853
12840
  import {
12854
12841
  getCheckoutByDepositAddress as getCheckoutByDepositAddress2
12855
12842
  } from "@funkit/api-base";
12856
- import { useQuery as useQuery6 } from "@tanstack/react-query";
12843
+ import { useQuery as useQuery5 } from "@tanstack/react-query";
12857
12844
  var useCheckout = (depositAddress, initial) => {
12858
12845
  const { apiKey } = useFunkitConfig();
12859
12846
  const { itemRefresh } = useCheckoutRefreshInterval();
12860
- const query = useQuery6({
12847
+ const query = useQuery5({
12861
12848
  queryKey: ["checkouts", "checkout", depositAddress],
12862
12849
  queryFn: () => (
12863
12850
  // biome-ignore lint/style/noNonNullAssertion: already checked for null
@@ -12963,7 +12950,7 @@ var CheckoutNotifications = ({
12963
12950
  const [initialCheckouts, setInitialCheckouts] = useState34();
12964
12951
  const [closedNotifications, setClosedNotifications] = useState34([]);
12965
12952
  const { data: checkouts } = useRecentCheckouts({ isVisible });
12966
- useEffect28(() => {
12953
+ useEffect27(() => {
12967
12954
  if (initialCheckouts || !checkouts) return;
12968
12955
  setInitialCheckouts(checkouts);
12969
12956
  }, [initialCheckouts, checkouts]);
@@ -13024,12 +13011,12 @@ import {
13024
13011
  import { useMemo as useMemo19 } from "react";
13025
13012
 
13026
13013
  // src/providers/FunkitQuoteContext.tsx
13027
- import { FlagKey as FlagKey11, isNotNullish as isNotNullish8 } from "@funkit/utils";
13014
+ import { FlagKey as FlagKey10, isNotNullish as isNotNullish8 } from "@funkit/utils";
13028
13015
  import React140, {
13029
13016
  createContext as createContext15,
13030
13017
  useCallback as useCallback25,
13031
13018
  useContext as useContext15,
13032
- useEffect as useEffect29,
13019
+ useEffect as useEffect28,
13033
13020
  useState as useState35
13034
13021
  } from "react";
13035
13022
  import { useConfig as useConfig3 } from "wagmi";
@@ -13104,7 +13091,7 @@ import {
13104
13091
  getCheckoutQuote as getApiCheckoutQuote
13105
13092
  } from "@funkit/api-base";
13106
13093
 
13107
- // src/domains/checkoutFees.ts
13094
+ // src/domains/fees.ts
13108
13095
  import {
13109
13096
  getAssetPriceInfo as getAssetPriceInfo2,
13110
13097
  getMoonpayBuyQuoteForCreditCard,
@@ -13214,7 +13201,7 @@ async function evaluateCardFees({
13214
13201
  logger
13215
13202
  });
13216
13203
  if (moonpayEstimation.errors) {
13217
- throw new Error("Moonpay estimation error");
13204
+ throw new Error("MoonPay estimation error");
13218
13205
  }
13219
13206
  const cardProcessingFeeUsd = moonpayEstimation.feeAmount;
13220
13207
  const moonpayCostUsd = moonpayEstimation.totalAmount - cardProcessingFeeUsd - baseQuote.estTotalUsd;
@@ -13434,12 +13421,12 @@ function FunkitQuoteProvider({ children }) {
13434
13421
  const funkitConfig = useFunkitConfig();
13435
13422
  const wagmiConfig = useConfig3();
13436
13423
  const { walletAddress, logoutSymbol, loginType, userInfo } = useGeneralWallet();
13437
- const enableFrogProxyServer = useFlag(FlagKey11.EnableFrogProxyServer);
13424
+ const enableFrogProxyServer = useFlag(FlagKey10.EnableFrogProxyServer);
13438
13425
  const [latestQuote, setLatestQuote] = useState35(null);
13439
13426
  const [isQuoting, setIsQuoting] = useState35(false);
13440
13427
  const [quoteStepMessage, setQuoteStepMessage] = useState35("");
13441
13428
  const [quoteErrorMessage, setQuoteErrorMessage] = useState35("");
13442
- useEffect29(() => {
13429
+ useEffect28(() => {
13443
13430
  if (isNotNullish8(logoutSymbol)) {
13444
13431
  setLatestQuote(null);
13445
13432
  setQuoteProgress({
@@ -13735,11 +13722,11 @@ function CheckoutHelp({
13735
13722
  }
13736
13723
 
13737
13724
  // src/modals/CheckoutModal/ConfirmationStep/ConfirmationStep.tsx
13738
- import React157, { useEffect as useEffect35, useMemo as useMemo25, useState as useState47 } from "react";
13725
+ import React157, { useEffect as useEffect34, useMemo as useMemo26, useState as useState47 } from "react";
13739
13726
  import { createPortal as createPortal4 } from "react-dom";
13740
13727
 
13741
13728
  // src/providers/UserPresenceContext.tsx
13742
- import React143, { useEffect as useEffect30 } from "react";
13729
+ import React143, { useEffect as useEffect29 } from "react";
13743
13730
  import {
13744
13731
  createContext as createContext16,
13745
13732
  useContext as useContext16,
@@ -13751,7 +13738,7 @@ var UserPresenceContext = createContext16({
13751
13738
  });
13752
13739
  var UserPresenceProvider = ({ children }) => {
13753
13740
  const [isAway, setIsAway] = useState36(false);
13754
- useEffect30(() => {
13741
+ useEffect29(() => {
13755
13742
  let timeoutId;
13756
13743
  const handleVisibilityChange = () => {
13757
13744
  if (document.visibilityState === "visible") {
@@ -13776,7 +13763,7 @@ import { FlagKey as FlagKey15 } from "@funkit/utils";
13776
13763
 
13777
13764
  // src/components/FunInfoBanner/FunInfoBanner.tsx
13778
13765
  import React146 from "react";
13779
- import { FlagKey as FlagKey12, safeParseJson as safeParseJson2 } from "@funkit/utils";
13766
+ import { FlagKey as FlagKey11, safeParseJson as safeParseJson2 } from "@funkit/utils";
13780
13767
 
13781
13768
  // src/components/FunInfoBanner/EphemeralInfoBanner.tsx
13782
13769
  import React145, { useState as useState37 } from "react";
@@ -13976,7 +13963,7 @@ var EphemeralInfoBanner = ({
13976
13963
 
13977
13964
  // src/components/FunInfoBanner/FunInfoBanner.tsx
13978
13965
  var FunInfoBanner = () => {
13979
- const bannerJson = useFlag(FlagKey12.ShowInfoBanner);
13966
+ const bannerJson = useFlag(FlagKey11.ShowInfoBanner);
13980
13967
  const bannerData = safeParseJson2(bannerJson);
13981
13968
  if (!bannerData || !bannerData.message) return null;
13982
13969
  const { expireAtMs, ...bannerProps } = bannerData;
@@ -14000,7 +13987,7 @@ import { motion as motion4, useAnimationControls } from "motion/react";
14000
13987
  // src/components/FunTooltip/FunTooltip.tsx
14001
13988
  import React147, {
14002
13989
  useCallback as useCallback27,
14003
- useEffect as useEffect31,
13990
+ useEffect as useEffect30,
14004
13991
  useRef as useRef13,
14005
13992
  useState as useState38
14006
13993
  } from "react";
@@ -14010,7 +13997,7 @@ import { AnimatePresence as AnimatePresence2, motion as motion3 } from "motion/r
14010
13997
  // src/components/FunTooltip/FunTooltip.css.ts
14011
13998
  var MAX_TOOLTIP_WIDTH = 180;
14012
13999
  var tooltipContainer = "z1l38i0";
14013
- var tooltipStyle = "z1l38i2 _1rsrm2fcg _1rsrm2fd7 _1rsrm2fdw _1rsrm2fbn _1rsrm2fj _1rsrm2fj3 _1rsrm2fv3 _1rsrm2fz _1rsrm2f13";
14000
+ var tooltipStyle = "z1l38i2 _1rsrm2fcg _1rsrm2fd7 _1rsrm2fdw _1rsrm2fbn _1rsrm2fj _1rsrm2fj3 _1rsrm2fwf _1rsrm2fz _1rsrm2f13";
14014
14001
  var tooltipStyleCenter = "z1l38i3";
14015
14002
  var tooltipStyleLeft = "z1l38i5";
14016
14003
  var tooltipStyleRight = "z1l38i4";
@@ -14041,10 +14028,10 @@ var FunTooltip = ({
14041
14028
  setIsDisplayed(false);
14042
14029
  }, HIDE_DELAY);
14043
14030
  }, []);
14044
- useEffect31(() => {
14031
+ useEffect30(() => {
14045
14032
  return () => clearTimeout(delayRef.current);
14046
14033
  }, []);
14047
- useEffect31(() => {
14034
+ useEffect30(() => {
14048
14035
  if (!wrapperElementRef?.current || !tooltipRef.current || !enableDynamicPositioning) {
14049
14036
  return;
14050
14037
  }
@@ -14140,7 +14127,7 @@ var GasIcon = ({ size = 12 }) => /* @__PURE__ */ React148.createElement(
14140
14127
  );
14141
14128
 
14142
14129
  // src/components/FunTransactionSummary/PaymentFeesSummary.css.ts
14143
- var baseStyles = "_1rsrm2f189";
14130
+ var baseStyles = "_1rsrm2f1ax";
14144
14131
  var expandableStyles = "vkwve32";
14145
14132
  var feeLineHideStyles = "vkwve34";
14146
14133
  var feeLineShowStyles = "vkwve33";
@@ -14202,7 +14189,7 @@ var extractFeeItems = (fees, totalUsd, isDydx) => {
14202
14189
  tooltipPosition: "center"
14203
14190
  },
14204
14191
  {
14205
- label: "Moonpay cost",
14192
+ label: "MoonPay cost",
14206
14193
  value: formatCurrencyAndStringify5(moonpayCostUsd),
14207
14194
  tooltipText: "Fee charged by MoonPay for processing your transaction."
14208
14195
  }
@@ -14368,6 +14355,15 @@ import {
14368
14355
  import NumberFlow from "@number-flow/react";
14369
14356
  import { motion as motion5 } from "motion/react";
14370
14357
  import React150, { useMemo as useMemo21 } from "react";
14358
+
14359
+ // src/consts/animations.ts
14360
+ var mapFontLineHeightToNumberFlowHeight = {
14361
+ "14px": "18px",
14362
+ "20px": "21px",
14363
+ "48px": "60px"
14364
+ };
14365
+
14366
+ // src/components/FunTransactionSummary/PaymentMethodSummary.tsx
14371
14367
  function PaymentMethodSummary({
14372
14368
  paymentMethodInfo,
14373
14369
  walletAddress,
@@ -14378,18 +14374,23 @@ function PaymentMethodSummary({
14378
14374
  }) {
14379
14375
  const label = usePaymentMethodInfoLabel(paymentMethodInfo, 15);
14380
14376
  const walletIcon = usePaymentMethodIcon("balance" /* ACCOUNT_BALANCE */, 15);
14377
+ const { apiKey } = useFunkitConfig();
14378
+ const { activeTheme } = useActiveTheme();
14381
14379
  const isAccountPayment = paymentMethodInfo.paymentMethod === "balance" /* ACCOUNT_BALANCE */;
14382
- const isSameDestination = isAccountPayment && !customRecipient;
14383
- const sourceKeyText = isSameDestination ? "Wallet" : "Source";
14380
+ const isSameDestination = isAccountPayment && !customRecipient && !isVertexCustomer(apiKey);
14384
14381
  const destinationIcon = customDestinationConfig?.icon ?? walletIcon;
14385
14382
  const destinationText = customDestinationConfig?.text ?? formatAddress5(customRecipient ?? walletAddress ?? "");
14386
- const { apiKey } = useFunkitConfig();
14387
14383
  return /* @__PURE__ */ React150.createElement(
14388
14384
  FunTxSummaryBox,
14389
14385
  {
14390
14386
  ...isVertexCustomer(apiKey) && { borderRadius: "actionButton" }
14391
14387
  },
14392
- /* @__PURE__ */ React150.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React150.createElement(FunTxSummaryLineItemKeyText, { text: sourceKeyText }), /* @__PURE__ */ React150.createElement(
14388
+ /* @__PURE__ */ React150.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React150.createElement(
14389
+ FunTxSummaryLineItemKeyText,
14390
+ {
14391
+ text: isSameDestination ? "Wallet" : "Source"
14392
+ }
14393
+ ), /* @__PURE__ */ React150.createElement(
14393
14394
  Box,
14394
14395
  {
14395
14396
  display: "flex",
@@ -14398,7 +14399,7 @@ function PaymentMethodSummary({
14398
14399
  gap: "5"
14399
14400
  },
14400
14401
  /* @__PURE__ */ React150.createElement(Box, { display: "flex", alignItems: "center" }, label.icon),
14401
- /* @__PURE__ */ React150.createElement(Text, { weight: "medium", color: "primaryText", size: "12" }, label.text)
14402
+ /* @__PURE__ */ React150.createElement(Text, { weight: "medium", size: "12" }, label.text)
14402
14403
  )),
14403
14404
  /* @__PURE__ */ React150.createElement(FunTxSummaryDivider, null),
14404
14405
  (!isSameDestination || customDestinationConfig) && /* @__PURE__ */ React150.createElement(React150.Fragment, null, /* @__PURE__ */ React150.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React150.createElement(FunTxSummaryLineItemKeyText, { text: "Destination" }), /* @__PURE__ */ React150.createElement(
@@ -14410,9 +14411,18 @@ function PaymentMethodSummary({
14410
14411
  gap: "5"
14411
14412
  },
14412
14413
  /* @__PURE__ */ React150.createElement(Box, { width: "15", height: "15", display: "flex", alignItems: "center" }, destinationIcon),
14413
- /* @__PURE__ */ React150.createElement(Text, { weight: "medium", color: "primaryText", size: "12" }, destinationText)
14414
+ /* @__PURE__ */ React150.createElement(Text, { weight: "medium", size: "12" }, destinationText)
14414
14415
  )), /* @__PURE__ */ React150.createElement(FunTxSummaryDivider, null)),
14415
- /* @__PURE__ */ React150.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React150.createElement(FunTxSummaryLineItemKeyText, { text: "Estimated time" }), isLoading ? /* @__PURE__ */ React150.createElement(FunSkeletonBlock, { height: "10", width: "54" }) : /* @__PURE__ */ React150.createElement(Text, { weight: "medium", size: "12", textAlign: "right" }, estimatedTime === 0 ? "-" : formatSecondsToReadableForm2(estimatedTime, true)))
14416
+ /* @__PURE__ */ React150.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React150.createElement(FunTxSummaryLineItemKeyText, { text: "Estimated time" }), isLoading ? (
14417
+ // height has to match the lineHeight of the text, keep these in sync to prevent layout shifts
14418
+ /* @__PURE__ */ React150.createElement(
14419
+ FunSkeletonBlock,
14420
+ {
14421
+ height: activeTheme.fontSize["12"].lineHeight,
14422
+ width: "54"
14423
+ }
14424
+ )
14425
+ ) : /* @__PURE__ */ React150.createElement(Text, { weight: "medium", size: "12", textAlign: "right" }, estimatedTime === 0 ? "-" : formatSecondsToReadableForm2(estimatedTime, true)))
14416
14426
  );
14417
14427
  }
14418
14428
  function PaymentAmountSummary({
@@ -14450,7 +14460,7 @@ function PaymentAmountSummary({
14450
14460
  showYouWillPaySummary && /* @__PURE__ */ React150.createElement(React150.Fragment, null, /* @__PURE__ */ React150.createElement(
14451
14461
  PaymentAmountSummaryItem,
14452
14462
  {
14453
- label: "You will pay",
14463
+ label: textCustomizations.payAmountLabel,
14454
14464
  paymentTokenAmount: sourceTokenAmount,
14455
14465
  valueSymbol: sourceSymbol,
14456
14466
  paymentUsdAmount: uiCustomizations?.showPaymentAmountUsd ? paymentTokenUsdAmount : void 0,
@@ -14461,8 +14471,7 @@ function PaymentAmountSummary({
14461
14471
  assetTicker: sourceSymbol,
14462
14472
  assetName: sourceSymbol,
14463
14473
  assetSrc: sourceIcon,
14464
- chainId: areSameChains ? void 0 : sourceChainId,
14465
- hideIfUnknown: true
14474
+ chainId: areSameChains ? void 0 : sourceChainId
14466
14475
  }
14467
14476
  ),
14468
14477
  isLoading
@@ -14471,7 +14480,7 @@ function PaymentAmountSummary({
14471
14480
  /* @__PURE__ */ React150.createElement(
14472
14481
  PaymentAmountSummaryItem,
14473
14482
  {
14474
- label: textCustomizations?.receiveAmountLabel ?? "You will receive",
14483
+ label: textCustomizations.receiveAmountLabel,
14475
14484
  paymentTokenAmount: targetTokenAmount,
14476
14485
  valueSymbol: targetItemName,
14477
14486
  icon: /* @__PURE__ */ React150.createElement(
@@ -14497,7 +14506,21 @@ function PaymentAmountSummaryItem({
14497
14506
  icon,
14498
14507
  valueSymbol
14499
14508
  }) {
14500
- return /* @__PURE__ */ React150.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React150.createElement(FunTxSummaryLineItemKeyText, { text: label }), isLoading ? /* @__PURE__ */ React150.createElement(Box, { alignItems: "center", display: "flex", gap: "8" }, /* @__PURE__ */ React150.createElement(FunSkeletonCircle, { size: "15" }), /* @__PURE__ */ React150.createElement(FunSkeletonBlock, { height: "10", width: "93" })) : /* @__PURE__ */ React150.createElement(Box, { display: "flex", justifyContent: "flex-end", flexDirection: "column" }, paymentTokenAmount === void 0 || Number.isNaN(paymentTokenAmount) ? "-" : /* @__PURE__ */ React150.createElement(Box, { display: "flex", alignItems: "center", gap: "5" }, /* @__PURE__ */ React150.createElement(motion5.div, { layout: true }, /* @__PURE__ */ React150.createElement(Box, { display: "flex", alignItems: "center", gap: "5" }, icon, /* @__PURE__ */ React150.createElement(
14509
+ const { activeTheme } = useActiveTheme();
14510
+ return /* @__PURE__ */ React150.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React150.createElement(FunTxSummaryLineItemKeyText, { text: label }), isLoading ? /* @__PURE__ */ React150.createElement(
14511
+ Box,
14512
+ {
14513
+ alignItems: "center",
14514
+ display: "flex",
14515
+ gap: "8",
14516
+ style: {
14517
+ // match the height of the final rendered height of the number component rendered by NumberFlow, keep in sync in case the `fontSize` changes
14518
+ height: mapFontLineHeightToNumberFlowHeight[activeTheme.fontSize["12"].lineHeight] ?? activeTheme.fontSize["12"].lineHeight
14519
+ }
14520
+ },
14521
+ /* @__PURE__ */ React150.createElement(FunSkeletonCircle, { size: "15" }),
14522
+ /* @__PURE__ */ React150.createElement(FunSkeletonBlock, { height: "10", width: "93" })
14523
+ ) : /* @__PURE__ */ React150.createElement(Box, { display: "flex", justifyContent: "flex-end", flexDirection: "column" }, paymentTokenAmount === void 0 || Number.isNaN(paymentTokenAmount) ? "-" : /* @__PURE__ */ React150.createElement(Box, { display: "flex", alignItems: "center", gap: "5" }, /* @__PURE__ */ React150.createElement(motion5.div, { layout: true }, /* @__PURE__ */ React150.createElement(Box, { display: "flex", alignItems: "center", gap: "5" }, icon, /* @__PURE__ */ React150.createElement(
14501
14524
  Box,
14502
14525
  {
14503
14526
  fontWeight: "medium",
@@ -14553,6 +14576,7 @@ function CheckoutPrimaryInfo({
14553
14576
  config,
14554
14577
  isLoading = false
14555
14578
  }) {
14579
+ const { activeTheme } = useActiveTheme();
14556
14580
  const checkoutItemDisplay = useCheckoutItemDisplay({ checkoutConfig: config });
14557
14581
  return /* @__PURE__ */ React152.createElement(
14558
14582
  Box,
@@ -14563,7 +14587,16 @@ function CheckoutPrimaryInfo({
14563
14587
  justifyContent: "center",
14564
14588
  gap: "4"
14565
14589
  },
14566
- isLoading ? /* @__PURE__ */ React152.createElement(FunSkeletonBlock, { height: "48", width: "120" }) : quote ? /* @__PURE__ */ React152.createElement(
14590
+ isLoading ? (
14591
+ // match the height of the final rendered height of the AnimatedDollarValue component, keep in sync in case the `fontSize` changes
14592
+ /* @__PURE__ */ React152.createElement(
14593
+ FunSkeletonBlock,
14594
+ {
14595
+ height: mapFontLineHeightToNumberFlowHeight[activeTheme.fontSize["40"].lineHeight] ?? activeTheme.fontSize["40"].lineHeight,
14596
+ width: "120"
14597
+ }
14598
+ )
14599
+ ) : quote ? /* @__PURE__ */ React152.createElement(
14567
14600
  Box,
14568
14601
  {
14569
14602
  fontSize: "40",
@@ -14666,11 +14699,11 @@ import { ClientError as ClientError2 } from "@funkit/utils";
14666
14699
  import { useState as useState41 } from "react";
14667
14700
 
14668
14701
  // src/hooks/useAutoClearState.ts
14669
- import { useCallback as useCallback28, useEffect as useEffect32, useRef as useRef14, useState as useState40 } from "react";
14702
+ import { useCallback as useCallback28, useEffect as useEffect31, useRef as useRef14, useState as useState40 } from "react";
14670
14703
  function useAutoClearState(initialValue = null) {
14671
14704
  const [state, setState] = useState40(initialValue);
14672
14705
  const timeoutRef = useRef14();
14673
- useEffect32(() => {
14706
+ useEffect31(() => {
14674
14707
  return () => {
14675
14708
  if (timeoutRef.current !== void 0) {
14676
14709
  clearTimeout(timeoutRef.current);
@@ -14692,16 +14725,38 @@ function useAutoClearState(initialValue = null) {
14692
14725
  ];
14693
14726
  }
14694
14727
 
14728
+ // src/hooks/useIsBlacklisted.ts
14729
+ import { FlagKey as FlagKey12 } from "@funkit/utils";
14730
+ import { useMemo as useMemo23 } from "react";
14731
+ var useIsBlacklisted = (walletAddress, customRecipient) => {
14732
+ const flagStr = useFlag(FlagKey12.AddressBlacklist);
14733
+ const blacklist = useMemo23(
14734
+ () => safeJSONParse(flagStr)?.map((addr) => addr.toLowerCase()) || [],
14735
+ [flagStr]
14736
+ );
14737
+ return {
14738
+ isWalletBlacklisted: walletAddress ? blacklist.includes(walletAddress.toLowerCase()) : false,
14739
+ isCustomRecipientBlacklisted: customRecipient ? blacklist.includes(customRecipient.toLowerCase()) : false
14740
+ };
14741
+ };
14742
+
14695
14743
  // src/modals/CheckoutModal/ConfirmationStep/useCheckoutConfirmation.ts
14696
14744
  var CHECKOUT_CONFIRMATION_UI_ERRORS = {
14697
14745
  QUOTE_EXPIRED: {
14698
14746
  durationMs: 5e3,
14699
14747
  message: "Quote expired. Please re-confirm the new checkout quote.",
14700
- type: "error"
14748
+ type: "error",
14749
+ code: "QUOTE_EXPIRED" /* QUOTE_EXPIRED */
14701
14750
  },
14702
14751
  GENERIC_ERROR: {
14703
14752
  message: "An error occurred during checkout. Please try again.",
14704
- type: "error"
14753
+ type: "error",
14754
+ code: "GENERIC_ERROR" /* GENERIC_ERROR */
14755
+ },
14756
+ RISK_ERROR: {
14757
+ message: `Sorry, ${FUN_ORG_NAME} Checkout is unable to proceed for security reasons.`,
14758
+ type: "warning",
14759
+ code: "RISK_ERROR" /* RISK_ERROR */
14705
14760
  }
14706
14761
  };
14707
14762
  function isQuoteExpiredError(error) {
@@ -14711,10 +14766,15 @@ function toCheckoutConfirmationError(error) {
14711
14766
  if (error instanceof Error && isQuoteExpiredError(error)) {
14712
14767
  return CHECKOUT_CONFIRMATION_UI_ERRORS.QUOTE_EXPIRED;
14713
14768
  }
14769
+ if (error instanceof Error) {
14770
+ const confirmationError = CHECKOUT_CONFIRMATION_UI_ERRORS[error.message];
14771
+ if (confirmationError) return confirmationError;
14772
+ }
14714
14773
  if (error instanceof ClientError2) {
14715
14774
  return {
14716
14775
  message: error.rawMessage,
14717
- type: "error"
14776
+ type: "error",
14777
+ code: "GENERIC_ERROR" /* GENERIC_ERROR */
14718
14778
  };
14719
14779
  }
14720
14780
  return CHECKOUT_CONFIRMATION_UI_ERRORS.GENERIC_ERROR;
@@ -14724,8 +14784,11 @@ function useCheckoutConfirmation({
14724
14784
  onSuccess
14725
14785
  }) {
14726
14786
  const { checkoutItem, confirmCheckout } = useCheckoutContext();
14787
+ const customRecipient = checkoutItem?.initSettings.config.customRecipient;
14788
+ const { apiKey } = useFunkitConfig();
14727
14789
  const { latestQuote } = useQuoteContext();
14728
- const { loginType, funWallet } = useGeneralWallet();
14790
+ const { loginType, funWallet, walletAddress } = useGeneralWallet();
14791
+ const { isCustomRecipientBlacklisted, isWalletBlacklisted } = useIsBlacklisted(walletAddress, customRecipient);
14729
14792
  const [error, setError] = useAutoClearState();
14730
14793
  const [isLoading, setIsLoading] = useState41(false);
14731
14794
  const [step, setStep] = useState41(null);
@@ -14735,6 +14798,17 @@ function useCheckoutConfirmation({
14735
14798
  return;
14736
14799
  }
14737
14800
  setIsLoading(true);
14801
+ logger.log("riskAssessment_isBlacklisted", {
14802
+ isWalletBlacklisted,
14803
+ isCustomRecipientBlacklisted,
14804
+ walletAddress,
14805
+ customRecipient
14806
+ });
14807
+ const isRisky = await hasRisk(apiKey, walletAddress, customRecipient);
14808
+ const isCheckoutRisky = isRisky || isWalletBlacklisted || isCustomRecipientBlacklisted;
14809
+ if (isCheckoutRisky) {
14810
+ throw new Error("RISK_ERROR" /* RISK_ERROR */);
14811
+ }
14738
14812
  let shouldBatchOpBypassInit = false;
14739
14813
  if (!isCheckoutCrFlow(checkoutItem) && loginType !== "web3" /* Web3 */) {
14740
14814
  const targetChainId = checkoutItem.initSettings.config.targetChain;
@@ -14778,7 +14852,7 @@ function useCheckoutConfirmation({
14778
14852
  import { useState as useState43 } from "react";
14779
14853
 
14780
14854
  // src/modals/CheckoutModal/useSourceAssetConfirm.tsx
14781
- import { useEffect as useEffect33, useState as useState42 } from "react";
14855
+ import { useEffect as useEffect32, useState as useState42 } from "react";
14782
14856
 
14783
14857
  // src/hooks/useCheckoutAccountBalanceTransfer.ts
14784
14858
  import { useCallback as useCallback29 } from "react";
@@ -14834,8 +14908,8 @@ function useCheckoutAccountBalanceTransfer() {
14834
14908
  }
14835
14909
 
14836
14910
  // src/hooks/useMesh.tsx
14837
- import { useQuery as useQuery7 } from "@tanstack/react-query";
14838
- import React155, { useMemo as useMemo23 } from "react";
14911
+ import { useQuery as useQuery6 } from "@tanstack/react-query";
14912
+ import React155, { useMemo as useMemo24 } from "react";
14839
14913
  import { FlagKey as FlagKey13 } from "@funkit/utils";
14840
14914
 
14841
14915
  // src/components/FunSelectBrokerage/FunBrokerageItem.tsx
@@ -14892,7 +14966,7 @@ var useSupportedExchanges = () => {
14892
14966
  FlagKey13.SupportedExchangesV2,
14893
14967
  FALLBACK_EXCHANGES_STRING
14894
14968
  );
14895
- return useMemo23(() => {
14969
+ return useMemo24(() => {
14896
14970
  return supportedExchangesFlag.split(",").flatMap((value) => {
14897
14971
  const brokerNameOrType = value.trim();
14898
14972
  if (!brokerNameOrType) {
@@ -14916,7 +14990,7 @@ var useMeshExchanges = ({
14916
14990
  }) => {
14917
14991
  const { getActiveConnection } = useFunkitMesh();
14918
14992
  const supportedExchanges = useSupportedExchanges();
14919
- const options = useMemo23(() => {
14993
+ const options = useMemo24(() => {
14920
14994
  return supportedExchanges.map((brokerType) => {
14921
14995
  const hasActiveConnection = !!getActiveConnection(brokerType);
14922
14996
  return createFunSelectOption(
@@ -14944,7 +15018,7 @@ var useMeshActiveNetworkInfo = (chainId, brokerType) => {
14944
15018
  };
14945
15019
  function useMeshIntegrations() {
14946
15020
  const { apiKey } = useFunkitConfig();
14947
- const { data, isLoading } = useQuery7({
15021
+ const { data, isLoading } = useQuery6({
14948
15022
  queryKey: ["funkit-mesh-integrations", apiKey],
14949
15023
  queryFn: async () => {
14950
15024
  return await fetchMeshTransferIntegrations(apiKey);
@@ -14986,7 +15060,7 @@ function useMeshAccountHoldings(targetChain, connection) {
14986
15060
  const { integrations } = useMeshIntegrations();
14987
15061
  const meshDeviceId = getMeshDeviceIdFromLocalStorage();
14988
15062
  const enableFrogProxyServer = useFlag(FlagKey13.EnableFrogProxyServer);
14989
- const query = useQuery7({
15063
+ const query = useQuery6({
14990
15064
  queryKey: [
14991
15065
  {
14992
15066
  apiKey,
@@ -15106,7 +15180,7 @@ function useHackyTriggerWorkaroundReactDevBrainExplode() {
15106
15180
  function useTriggerQuoteAndOtherStuffsWithExtremeCaution(onResult, setPreloadedQuoteData) {
15107
15181
  const [assetRefresh, triggerAssetConfirm] = useHackyTriggerWorkaroundReactDevBrainExplode();
15108
15182
  const { isSourceAssetConfirming, onSourceAssetConfirmed } = useSourceAssetConfirm(setPreloadedQuoteData);
15109
- useEffect33(() => {
15183
+ useEffect32(() => {
15110
15184
  if (assetRefresh === 0) {
15111
15185
  return;
15112
15186
  }
@@ -15505,7 +15579,7 @@ function usePostCheckout({
15505
15579
  }
15506
15580
 
15507
15581
  // src/modals/CheckoutModal/ConfirmationStep/useQuoteRefresh.ts
15508
- import { useCallback as useCallback32, useEffect as useEffect34, useMemo as useMemo24, useRef as useRef15, useState as useState46 } from "react";
15582
+ import { useCallback as useCallback32, useEffect as useEffect33, useMemo as useMemo25, useRef as useRef15, useState as useState46 } from "react";
15509
15583
 
15510
15584
  // src/hooks/useCountdown.tsx
15511
15585
  import React156 from "react";
@@ -15614,7 +15688,7 @@ function useQuoteRefresh({
15614
15688
  },
15615
15689
  [isOnHold, restartCountdown, setCheckoutQuote, triggerAssetConfirm]
15616
15690
  );
15617
- const quoteError = useMemo24(() => {
15691
+ const quoteError = useMemo25(() => {
15618
15692
  if (quoteErrorMessage && !isQuoting) {
15619
15693
  return {
15620
15694
  message: quoteErrorMessage,
@@ -15623,7 +15697,7 @@ function useQuoteRefresh({
15623
15697
  }
15624
15698
  return null;
15625
15699
  }, [isQuoting, quoteErrorMessage]);
15626
- useEffect34(() => {
15700
+ useEffect33(() => {
15627
15701
  if (isPendingRefresh && !isOnHold) {
15628
15702
  setIsPendingRefresh(false);
15629
15703
  refreshQuote();
@@ -15685,16 +15759,16 @@ var ConfirmationStepInfo = {
15685
15759
  var DEFAULT_CONTINUE_TEXT = "Confirm Order";
15686
15760
  function ConfirmationStep({
15687
15761
  modalState,
15688
- onNext
15762
+ onNext,
15763
+ setModalState
15689
15764
  }) {
15690
- const { targetChainId } = modalState;
15691
- const { paymentMethod } = modalState.paymentMethodInfo;
15692
15765
  const { checkoutItem, updateTargetAssetAmount } = useCheckoutContext();
15693
15766
  const { latestQuote } = useQuoteContext();
15694
15767
  const funkitConfig = useFunkitConfig();
15695
15768
  const { walletAddress } = useGeneralWallet();
15696
15769
  const showTagline = useFlag(FlagKey15.ShowPoweredTagline, false);
15697
- const moonpayAmountCheck = paymentMethod === "card" /* CARD */ ? checkAmountForMoonpay(checkoutItem?.finalDollarValue || 0) : void 0;
15770
+ const { paymentMethodInfo } = modalState;
15771
+ const moonpayAmountCheck = paymentMethodInfo.paymentMethod === "card" /* CARD */ ? checkAmountForMoonpay(checkoutItem?.finalDollarValue || 0) : void 0;
15698
15772
  const {
15699
15773
  handlePostCheckout,
15700
15774
  isPostCheckoutLoading,
@@ -15710,9 +15784,13 @@ function ConfirmationStep({
15710
15784
  handleCheckoutConfirmation,
15711
15785
  isConfirming
15712
15786
  } = useCheckoutConfirmation({
15713
- // If confirmation fails, do a *hard* refresh of the quote
15714
- onError: () => refreshQuote(true),
15715
- // If confirmation succeeds, move on to post-checkout
15787
+ onError: (error2) => {
15788
+ if (error2.code === "RISK_ERROR" /* RISK_ERROR */) {
15789
+ setModalState((state) => ({ ...state, isBlocked: true }));
15790
+ } else {
15791
+ refreshQuote(true);
15792
+ }
15793
+ },
15716
15794
  onSuccess: handlePostCheckout
15717
15795
  });
15718
15796
  const { unlinkBrokerage } = useFunkitMesh();
@@ -15731,7 +15809,7 @@ function ConfirmationStep({
15731
15809
  setSuggestedAssetAmount(maxTargetAssetAmount);
15732
15810
  }
15733
15811
  });
15734
- useEffect35(() => {
15812
+ useEffect34(() => {
15735
15813
  triggerNewQuote({ maxRetries: 1 });
15736
15814
  }, []);
15737
15815
  const isContinuing = isConfirming || isPostCheckoutLoading;
@@ -15740,7 +15818,7 @@ function ConfirmationStep({
15740
15818
  // Block updates to the current quote during confirmation and post-checkout
15741
15819
  useQuoteRefresh({ isOnHold: isInitialQuoting || isContinuing || isAway })
15742
15820
  );
15743
- const error = useMemo25(() => {
15821
+ const error = useMemo26(() => {
15744
15822
  if (!isInitialQuoting && moonpayAmountCheck?.isInvalid) {
15745
15823
  return {
15746
15824
  message: moonpayAmountCheck.message,
@@ -15755,7 +15833,7 @@ function ConfirmationStep({
15755
15833
  quoteError,
15756
15834
  isInitialQuoting
15757
15835
  ]);
15758
- const stepMessage = useMemo25(() => {
15836
+ const stepMessage = useMemo26(() => {
15759
15837
  if (initialQuoteStep) return initialQuoteStep;
15760
15838
  if (postCheckoutStepMessage) return postCheckoutStepMessage;
15761
15839
  if (confirmationStepMessage) return confirmationStepMessage;
@@ -15773,13 +15851,10 @@ function ConfirmationStep({
15773
15851
  checkoutConfig: checkoutItem?.initSettings.config,
15774
15852
  hideAmount: true
15775
15853
  });
15776
- const textCustomizations = funkitConfig.textCustomizations.confirmationScreen;
15777
- const uiCustomizations = funkitConfig.uiCustomizations?.confirmationScreen;
15778
15854
  const estimatedTime = useCheckoutTimeEstimate(
15779
15855
  latestQuote?.finalTimeEstimationMs,
15780
- paymentMethod
15856
+ paymentMethodInfo.paymentMethod
15781
15857
  );
15782
- const customRecipient = checkoutItem?.initSettings.config.customRecipient;
15783
15858
  const continueConfig = () => {
15784
15859
  if (!quoteError) {
15785
15860
  return {
@@ -15802,8 +15877,11 @@ function ConfirmationStep({
15802
15877
  handleContinue: () => refreshQuote(true)
15803
15878
  };
15804
15879
  };
15880
+ const isQuoteLoading = isInitialQuoting || isQuoting;
15805
15881
  const isStepLoading = isInitialQuoting || isContinuing || isRefreshing;
15806
- const paymentMethodInfo = modalState.paymentMethodInfo;
15882
+ const textCustomizations = funkitConfig.textCustomizations.confirmationScreen;
15883
+ const uiCustomizations = funkitConfig.uiCustomizations?.confirmationScreen;
15884
+ const customRecipient = checkoutItem?.initSettings.config.customRecipient;
15807
15885
  return /* @__PURE__ */ React157.createElement(Box, null, /* @__PURE__ */ React157.createElement(
15808
15886
  Box,
15809
15887
  {
@@ -15818,16 +15896,16 @@ function ConfirmationStep({
15818
15896
  showTokenAmount: uiCustomizations?.showTokenAmount,
15819
15897
  config: checkoutItem.initSettings.config,
15820
15898
  quote: latestQuote,
15821
- isLoading: isInitialQuoting || isQuoting
15899
+ isLoading: isQuoteLoading
15822
15900
  }
15823
15901
  ),
15824
15902
  /* @__PURE__ */ React157.createElement(
15825
15903
  PaymentMethodSummary,
15826
15904
  {
15827
- paymentMethodInfo: modalState.paymentMethodInfo,
15905
+ paymentMethodInfo,
15828
15906
  walletAddress,
15829
15907
  customRecipient,
15830
- isLoading: isInitialQuoting || isQuoting,
15908
+ isLoading: isQuoteLoading,
15831
15909
  estimatedTime,
15832
15910
  customDestinationConfig: uiCustomizations?.destinationConfig
15833
15911
  }
@@ -15835,21 +15913,15 @@ function ConfirmationStep({
15835
15913
  /* @__PURE__ */ React157.createElement(
15836
15914
  PaymentAmountSummary,
15837
15915
  {
15838
- isLoading: isInitialQuoting || isQuoting,
15839
- targetChainId,
15916
+ isLoading: isQuoteLoading,
15917
+ targetChainId: modalState.targetChainId,
15840
15918
  checkoutItem,
15841
15919
  quote: latestQuote,
15842
15920
  textCustomizations,
15843
15921
  uiCustomizations
15844
15922
  }
15845
15923
  ),
15846
- /* @__PURE__ */ React157.createElement(
15847
- PaymentFeesSummary,
15848
- {
15849
- isLoading: isInitialQuoting || isQuoting,
15850
- quote: latestQuote
15851
- }
15852
- ),
15924
+ /* @__PURE__ */ React157.createElement(PaymentFeesSummary, { isLoading: isQuoteLoading, quote: latestQuote }),
15853
15925
  /* @__PURE__ */ React157.createElement(Box, { display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React157.createElement(FunInfoBanner, null), /* @__PURE__ */ React157.createElement(
15854
15926
  FunAlert,
15855
15927
  {
@@ -15859,7 +15931,7 @@ function ConfirmationStep({
15859
15931
  showDydxDisclaimer: showTagline,
15860
15932
  checkoutItem,
15861
15933
  continueText: DEFAULT_CONTINUE_TEXT,
15862
- isCardPayment: paymentMethod === "card" /* CARD */,
15934
+ isCardPayment: paymentMethodInfo.paymentMethod === "card" /* CARD */,
15863
15935
  finalConvertedAssetName
15864
15936
  }
15865
15937
  ))
@@ -16132,7 +16204,7 @@ function ConnectExchange({
16132
16204
 
16133
16205
  // src/modals/CheckoutModal/InputAmount/InputAmount.tsx
16134
16206
  import { isMobile as isMobile12 } from "@funkit/utils";
16135
- import React170, { useEffect as useEffect37 } from "react";
16207
+ import React170, { useEffect as useEffect36 } from "react";
16136
16208
 
16137
16209
  // src/modals/CheckoutModal/InputAmount/InputAmountLoaded.tsx
16138
16210
  import {
@@ -16140,7 +16212,7 @@ import {
16140
16212
  formatCryptoAndStringify as formatCryptoAndStringify3,
16141
16213
  formatCurrencyAndStringify as formatCurrencyAndStringify8
16142
16214
  } from "@funkit/utils";
16143
- import React168, { useMemo as useMemo26 } from "react";
16215
+ import React168, { useMemo as useMemo27 } from "react";
16144
16216
 
16145
16217
  // src/components/Icons/SwitchIcon.tsx
16146
16218
  import React164 from "react";
@@ -16167,14 +16239,14 @@ var SwitchIcon = () => {
16167
16239
  };
16168
16240
 
16169
16241
  // src/hooks/useDynamicFont.ts
16170
- import { useCallback as useCallback34, useEffect as useEffect36, useRef as useRef16, useState as useState49 } from "react";
16242
+ import { useCallback as useCallback34, useEffect as useEffect35, useRef as useRef16, useState as useState49 } from "react";
16171
16243
  var SIZE_STEP = 1;
16172
16244
  var ALLOWANCE = 20;
16173
16245
  var useDynamicFont = (inputValue, max, min = 16) => {
16174
16246
  const [fontSize, setFontSize] = useState49(max);
16175
16247
  const inputRef = useRef16(null);
16176
16248
  const canvasRef = useRef16(document.createElement("canvas"));
16177
- useEffect36(() => {
16249
+ useEffect35(() => {
16178
16250
  const measureTextWidth = (text) => {
16179
16251
  if (!inputRef.current) return void 0;
16180
16252
  const context = canvasRef.current.getContext("2d");
@@ -16367,7 +16439,7 @@ function InputAmountLayout({
16367
16439
 
16368
16440
  // src/modals/CheckoutModal/InputAmount/QuickOptions.tsx
16369
16441
  import React167 from "react";
16370
- var USD_AMOUNT_OPTIONS_PCT = [25, 50, 100];
16442
+ var USD_AMOUNT_OPTIONS_PCT = [25, 50, 75, 100];
16371
16443
  var QuickOptions = ({
16372
16444
  onSelect,
16373
16445
  disabled = false
@@ -16381,10 +16453,17 @@ var QuickOptions = ({
16381
16453
  icon: null,
16382
16454
  isDisabled: disabled,
16383
16455
  key: `${percent}%`,
16384
- onClick: () => onSelect?.(percent),
16456
+ onClick: () => {
16457
+ onSelect?.(percent);
16458
+ },
16385
16459
  paddingX: "12",
16386
16460
  size: "36",
16387
- variant: "filled"
16461
+ variant: "filled",
16462
+ colorOverrides: {
16463
+ baseBackground: "inputAmountQuickOptionBaseBackground",
16464
+ hoverBackground: "inputAmountQuickOptionHoverBackground",
16465
+ activeBackground: "inputAmountQuickOptionActiveBackground"
16466
+ }
16388
16467
  },
16389
16468
  percent === 100 ? "Max" : `${percent}%`
16390
16469
  ));
@@ -16624,7 +16703,7 @@ function InputAmountLoaded({
16624
16703
  maxUsd: Number.parseFloat(maxCheckoutUsdString),
16625
16704
  minUsd
16626
16705
  });
16627
- const error = useMemo26(() => {
16706
+ const error = useMemo27(() => {
16628
16707
  if (usdAvailableAmount === 0) {
16629
16708
  return {
16630
16709
  message: "Insufficient balance, please select another asset instead.",
@@ -16659,7 +16738,7 @@ function InputAmountLoaded({
16659
16738
  }
16660
16739
  }
16661
16740
  }, [checkoutItemTitle, inputError, usdAmount, usdAvailableAmount]);
16662
- const suggestion = useMemo26(() => {
16741
+ const suggestion = useMemo27(() => {
16663
16742
  if (!inputError) return void 0;
16664
16743
  switch (inputError.type) {
16665
16744
  case "aboveAvailable": {
@@ -16797,7 +16876,7 @@ function InputAmountLoaded({
16797
16876
 
16798
16877
  // src/modals/CheckoutModal/InputAmount/InputAmountLoading.tsx
16799
16878
  import { formatCryptoAndStringify as formatCryptoAndStringify4 } from "@funkit/utils";
16800
- import React169, { useMemo as useMemo27 } from "react";
16879
+ import React169, { useMemo as useMemo28 } from "react";
16801
16880
  function InputAmountLoading({
16802
16881
  isCardCheckout,
16803
16882
  modalState,
@@ -16810,7 +16889,7 @@ function InputAmountLoading({
16810
16889
  const { unlinkBrokerage } = useFunkitMesh();
16811
16890
  const targetAssetAmount = checkoutItem?.initSettings.config.targetAssetAmount;
16812
16891
  const targetAssetTicker = checkoutItem?.initSettings.config.targetAssetTicker;
16813
- const error = useMemo27(() => {
16892
+ const error = useMemo28(() => {
16814
16893
  if (sourceHoldingError) {
16815
16894
  return {
16816
16895
  message: /* @__PURE__ */ React169.createElement("div", null, "Unable to retrieve your account balance. Please try re-linking your account.", " ", paymentMethodInfo.paymentMethod === "brokerage" /* BROKERAGE */ && /* @__PURE__ */ React169.createElement(
@@ -16889,13 +16968,13 @@ function InputAmountLoading({
16889
16968
 
16890
16969
  // src/modals/CheckoutModal/InputAmount/useAssetPrice.ts
16891
16970
  import { getAssetPriceInfo as getAssetPriceInfo3 } from "@funkit/api-base";
16892
- import { skipToken, useQuery as useQuery8 } from "@tanstack/react-query";
16971
+ import { skipToken, useQuery as useQuery7 } from "@tanstack/react-query";
16893
16972
  function useAssetPrice({
16894
16973
  chainId,
16895
16974
  assetTokenAddress
16896
16975
  }) {
16897
16976
  const { apiKey } = useFunkitConfig();
16898
- const { data, error, isLoading } = useQuery8({
16977
+ const { data, error, isLoading } = useQuery7({
16899
16978
  queryKey: ["getAssetPriceInfo", chainId, assetTokenAddress],
16900
16979
  queryFn: chainId && assetTokenAddress ? async () => {
16901
16980
  try {
@@ -16920,14 +16999,14 @@ function useAssetPrice({
16920
16999
  }
16921
17000
 
16922
17001
  // src/modals/CheckoutModal/InputAmount/useAvailableBalanceForCheckout.ts
16923
- import { useMemo as useMemo29 } from "react";
17002
+ import { useMemo as useMemo30 } from "react";
16924
17003
 
16925
17004
  // src/modals/CheckoutModal/useWalletAssetHoldings.ts
16926
17005
  import {
16927
17006
  FUNKIT_CONNECT_CHECKOUT_NATIVE_CURRENCY_ADDRESS as FUNKIT_CONNECT_CHECKOUT_NATIVE_CURRENCY_ADDRESS3,
16928
17007
  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO9
16929
17008
  } from "@funkit/chains";
16930
- import { useMemo as useMemo28 } from "react";
17009
+ import { useMemo as useMemo29 } from "react";
16931
17010
 
16932
17011
  // src/domains/wallet.ts
16933
17012
  import { polygon as polygon4 } from "viem/chains";
@@ -16988,11 +17067,11 @@ var processWalletAssets = (walletAssets, targetChain) => {
16988
17067
  };
16989
17068
  function useWalletAssetHoldings(targetChain) {
16990
17069
  const { walletAssets, isLoading } = useWalletAssets();
16991
- const processedAssets = useMemo28(
17070
+ const processedAssets = useMemo29(
16992
17071
  () => processWalletAssets(walletAssets, targetChain),
16993
17072
  [targetChain, walletAssets]
16994
17073
  );
16995
- const totalBalance = useMemo28(
17074
+ const totalBalance = useMemo29(
16996
17075
  () => processedAssets ? getTotalAssetBalance(processedAssets) : 0,
16997
17076
  [processedAssets]
16998
17077
  );
@@ -17021,7 +17100,7 @@ function useAvailableBalanceForCheckout(paymentMethodInfo, targetChainId, assetC
17021
17100
  ["card" /* CARD */]: null,
17022
17101
  ["token_transfer" /* TOKEN_TRANSFER */]: null
17023
17102
  }[paymentMethodInfo.paymentMethod];
17024
- const holdingItem = useMemo29(() => {
17103
+ const holdingItem = useMemo30(() => {
17025
17104
  if (!assetSymbol || !holdings) {
17026
17105
  return;
17027
17106
  }
@@ -17071,7 +17150,7 @@ function InputAmount(props) {
17071
17150
  });
17072
17151
  const isCardCheckout = props.modalState.paymentMethodInfo.paymentMethod === "card" /* CARD */;
17073
17152
  const isLoaded = checkoutItem && unitPrice && !sourceHoldingError && !isLoadingSourceHolding;
17074
- useEffect37(() => setCheckoutQuote(null), []);
17153
+ useEffect36(() => setCheckoutQuote(null), []);
17075
17154
  if (isLoaded) {
17076
17155
  return /* @__PURE__ */ React170.createElement(
17077
17156
  InputAmountLoaded,
@@ -17096,7 +17175,7 @@ function InputAmount(props) {
17096
17175
  }
17097
17176
 
17098
17177
  // src/modals/CheckoutModal/LoadingAccount.tsx
17099
- import React175, { useEffect as useEffect38 } from "react";
17178
+ import React175, { useEffect as useEffect37 } from "react";
17100
17179
  import { POLYMARKET_API_KEY as POLYMARKET_API_KEY3 } from "@funkit/api-base";
17101
17180
  import { FlagKey as FlagKey17 } from "@funkit/utils";
17102
17181
 
@@ -17145,7 +17224,7 @@ import clsx17 from "clsx";
17145
17224
  import React172, { useRef as useRef17 } from "react";
17146
17225
 
17147
17226
  // src/components/FunOptionBox/FunOptionBox.css.ts
17148
- var funOptionBoxStyle = { baseStyle: "_1rfcluh0", defaultBorder: "_1rsrm2fv3 _1rsrm2ftd", transparentBorder: "_1rsrm2fyf _1rsrm2ftd", activeBorder: "_1rsrm2ft9", disabledOptionBorder: "_1rsrm2fux", defaultBackground: "_1rsrm2fnf _1rsrm2fjg _1rsrm2fjt", activeBackground: "_1rsrm2fnf _1rsrm2fng _1rsrm2fnh" };
17227
+ var funOptionBoxStyle = { baseStyle: "_1rfcluh0", defaultBorder: "_1rsrm2fwf _1rsrm2fup", transparentBorder: "_1rsrm2fzr _1rsrm2fup", activeBorder: "_1rsrm2ful", disabledOptionBorder: "_1rsrm2fw9", defaultBackground: "_1rsrm2fnf _1rsrm2fjg _1rsrm2fjt", activeBackground: "_1rsrm2fnf _1rsrm2fng _1rsrm2fnh" };
17149
17228
 
17150
17229
  // src/components/FunOptionBox/FunOptionBox.tsx
17151
17230
  function FunOptionBox({
@@ -17430,7 +17509,7 @@ function LoadingAccount({
17430
17509
  const { updateSelectedPaymentMethodInfo } = useCheckoutContext();
17431
17510
  const { isLoading: isLoadingFlag, getFlag } = useFlags();
17432
17511
  const isTokenTransferEnabled = getFlag(FlagKey17.EnableTokenTransfer);
17433
- useEffect38(() => {
17512
+ useEffect37(() => {
17434
17513
  if (hasSufficientAsset(walletAssets, targetChainId)) {
17435
17514
  const paymentMethodInfo = createPaymentMethodInfo({
17436
17515
  paymentMethod: "balance" /* ACCOUNT_BALANCE */,
@@ -17493,7 +17572,7 @@ import {
17493
17572
  meshExecuteTransferProxy
17494
17573
  } from "@funkit/api-base";
17495
17574
  import { ClientError as ClientError4, FlagKey as FlagKey18, formatAddress as formatAddress6 } from "@funkit/utils";
17496
- import React183, { useMemo as useMemo30, useState as useState50 } from "react";
17575
+ import React183, { useMemo as useMemo31, useState as useState50 } from "react";
17497
17576
  import { createPortal as createPortal7 } from "react-dom";
17498
17577
 
17499
17578
  // src/components/CopyAddress/CopyAddressButton.tsx
@@ -17568,10 +17647,10 @@ function CopyAddressButton({
17568
17647
  }
17569
17648
 
17570
17649
  // src/hooks/useMountEffect.ts
17571
- import { useEffect as useEffect39, useRef as useRef18 } from "react";
17650
+ import { useEffect as useEffect38, useRef as useRef18 } from "react";
17572
17651
  function useMountEffect(effect) {
17573
17652
  const isMounted = useRef18(false);
17574
- useEffect39(() => {
17653
+ useEffect38(() => {
17575
17654
  if (isMounted.current) {
17576
17655
  return;
17577
17656
  }
@@ -17798,7 +17877,7 @@ function MeshVerification({
17798
17877
  return () => setScreen(0 /* INITIAL */);
17799
17878
  });
17800
17879
  const brokerName = getExchangeName(brokerType);
17801
- const verificationTitle = useMemo30(() => {
17880
+ const verificationTitle = useMemo31(() => {
17802
17881
  switch (executionStatus) {
17803
17882
  case MeshExecuteTransferStatus.secondMfaRequired:
17804
17883
  return `Additional ${brokerName} 2FA required`;
@@ -17825,7 +17904,7 @@ function MeshVerification({
17825
17904
  executionContent?.verificationSteps?.length,
17826
17905
  isSecond2fa
17827
17906
  ]);
17828
- const verificationDescription = useMemo30(() => {
17907
+ const verificationDescription = useMemo31(() => {
17829
17908
  switch (executionStatus) {
17830
17909
  case MeshExecuteTransferStatus.secondMfaRequired:
17831
17910
  return `Please enable at least two 2FA methods on your ${brokerName} account. Once enabled, you will have to reconnect your account.`;
@@ -17971,7 +18050,7 @@ var VerificationPopup = ({
17971
18050
  };
17972
18051
 
17973
18052
  // src/modals/CheckoutModal/MoonpaySetup.tsx
17974
- import React185, { useCallback as useCallback36, useMemo as useMemo32, useState as useState52 } from "react";
18053
+ import React185, { useCallback as useCallback36, useMemo as useMemo33, useState as useState52 } from "react";
17975
18054
 
17976
18055
  // src/components/FunPayments/FunPaymentMoonpayType.css.ts
17977
18056
  var mpClass = "_1kmpeyf0";
@@ -17980,10 +18059,10 @@ var stretchStyle = "_1kmpeyf1";
17980
18059
  // src/components/FunPayments/FunPaymentMoonpayType.tsx
17981
18060
  import { getMoonpayUrlSignature } from "@funkit/api-base";
17982
18061
  import { colorToHex } from "@funkit/utils";
17983
- import React184, { Fragment as Fragment3, useEffect as useEffect40, useMemo as useMemo31, useState as useState51 } from "react";
18062
+ import React184, { Fragment as Fragment3, useEffect as useEffect39, useMemo as useMemo32, useState as useState51 } from "react";
17984
18063
  var LazyMoonPayBuyWidget = (props) => {
17985
18064
  const [MoonPayBuyWidget, setMoonPayBuyWidget] = useState51(null);
17986
- useEffect40(() => {
18065
+ useEffect39(() => {
17987
18066
  const loadMoonPayBuyWidget = async () => {
17988
18067
  const module = await import("@moonpay/moonpay-react");
17989
18068
  setMoonPayBuyWidget(() => module.MoonPayBuyWidget);
@@ -18011,7 +18090,7 @@ function FunPaymentMoonpayType({
18011
18090
  const isSandboxMode = useIsFunkitSandboxMode();
18012
18091
  const funkitConfig = useFunkitConfig();
18013
18092
  const { userInfo } = useGeneralWallet();
18014
- const currencyCode = useMemo31(() => {
18093
+ const currencyCode = useMemo32(() => {
18015
18094
  return generateMoonpayCurrencyCode(depositToken, depositTokenChainId);
18016
18095
  }, [depositToken, depositTokenChainId]);
18017
18096
  const depositTokenAmountStringFormatted = formatTokenAmountForMoonpay(
@@ -18034,7 +18113,7 @@ function FunPaymentMoonpayType({
18034
18113
  });
18035
18114
  return signature || "";
18036
18115
  };
18037
- const moonpayButtonColor = useMemo31(() => {
18116
+ const moonpayButtonColor = useMemo32(() => {
18038
18117
  const primaryButtonHex = colorToHex(activeTheme.colors.buttonPrimary);
18039
18118
  if (["#FFF", "#FFFF", "#FFFFFF", "#FFFFFFFF"].includes(primaryButtonHex)) {
18040
18119
  return void 0;
@@ -18089,7 +18168,7 @@ function MoonpaySetup({
18089
18168
  depositAddress: paymentAddress
18090
18169
  });
18091
18170
  }, [onNext, paymentAddress]);
18092
- const MoonpayWidget = useMemo32(() => {
18171
+ const MoonpayWidget = useMemo33(() => {
18093
18172
  return /* @__PURE__ */ React185.createElement(
18094
18173
  FunPaymentMoonpayType,
18095
18174
  {
@@ -18118,17 +18197,18 @@ function MoonpaySetup({
18118
18197
  }
18119
18198
 
18120
18199
  // src/modals/CheckoutModal/SelectAsset.tsx
18200
+ import { FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST } from "@funkit/chains";
18121
18201
  import { formatCurrencyAndStringify as formatCurrencyAndStringify10 } from "@funkit/utils";
18122
- import React193, { useEffect as useEffect41, useMemo as useMemo35, useState as useState55 } from "react";
18202
+ import React195, { useEffect as useEffect40, useMemo as useMemo36, useState as useState55 } from "react";
18123
18203
  import { createPortal as createPortal8 } from "react-dom";
18124
18204
 
18125
- // src/components/Dropdown/ReceiveTokenDropdown.tsx
18126
- import React191, { useState as useState54 } from "react";
18205
+ // src/components/Dropdown/ChainDropdown.tsx
18206
+ import React191 from "react";
18127
18207
 
18128
18208
  // src/components/Dropdown/BaseDropdown.tsx
18129
18209
  import { isMobile as isMobile13 } from "@funkit/utils";
18130
18210
  import { AnimatePresence as AnimatePresence3, motion as motion6 } from "motion/react";
18131
- import React189, { useCallback as useCallback37, useMemo as useMemo33, useState as useState53 } from "react";
18211
+ import React189, { useCallback as useCallback37, useMemo as useMemo34, useState as useState53 } from "react";
18132
18212
 
18133
18213
  // src/components/FunNoResults/FunNoResults.tsx
18134
18214
  import React187 from "react";
@@ -18194,7 +18274,8 @@ var FunNoResults = ({ children }) => {
18194
18274
  justifyContent: "center",
18195
18275
  alignItems: "center",
18196
18276
  gap: "12",
18197
- color: "secondaryText"
18277
+ color: "secondaryText",
18278
+ style: { flex: 1 }
18198
18279
  },
18199
18280
  /* @__PURE__ */ React187.createElement(SearchSkeletonIcon, null),
18200
18281
  /* @__PURE__ */ React187.createElement(Text, { color: "secondaryText", size: "10" }, children)
@@ -18217,7 +18298,9 @@ function BaseActiveDropdownItem({
18217
18298
  onClick = noop6,
18218
18299
  horizontalIconGap = HORIZONTAL_ICON_GAP,
18219
18300
  alwaysVisibleLabel,
18220
- tagComponent
18301
+ tagComponent,
18302
+ size = "regular",
18303
+ color = "primaryText"
18221
18304
  }) {
18222
18305
  return /* @__PURE__ */ React188.createElement(
18223
18306
  Box,
@@ -18233,11 +18316,11 @@ function BaseActiveDropdownItem({
18233
18316
  hover: "offBackground"
18234
18317
  },
18235
18318
  borderColor: "mediumStroke",
18236
- borderWidth: "1",
18319
+ borderWidth: size === "compact" ? "0" : "1",
18237
18320
  borderRadius: BORDER_RADIUS,
18238
18321
  borderStyle: "solid",
18239
- paddingY: "8",
18240
- paddingX: HORIZONTAL_OUTER_PADDING_X
18322
+ paddingY: size === "compact" ? "2" : "8",
18323
+ paddingX: size === "compact" ? "4" : HORIZONTAL_OUTER_PADDING_X
18241
18324
  },
18242
18325
  /* @__PURE__ */ React188.createElement(
18243
18326
  Box,
@@ -18246,9 +18329,7 @@ function BaseActiveDropdownItem({
18246
18329
  alignItems: "center",
18247
18330
  justifyContent: "space-between",
18248
18331
  gap: horizontalIconGap,
18249
- style: {
18250
- flex: "1 0 auto"
18251
- }
18332
+ style: size === "compact" ? void 0 : { flex: "1 0 auto" }
18252
18333
  },
18253
18334
  alwaysVisibleLabel && /* @__PURE__ */ React188.createElement(Box, { style: { flex: 1 } }, /* @__PURE__ */ React188.createElement(Text, { color: "secondaryText", size: "12" }, alwaysVisibleLabel)),
18254
18335
  /* @__PURE__ */ React188.createElement(
@@ -18258,11 +18339,7 @@ function BaseActiveDropdownItem({
18258
18339
  alignItems: "center",
18259
18340
  justifyContent: "space-between",
18260
18341
  gap: horizontalIconGap,
18261
- ...alwaysVisibleLabel ? {} : {
18262
- style: {
18263
- flex: 1
18264
- }
18265
- }
18342
+ ...alwaysVisibleLabel ? {} : { style: { flex: 1 } }
18266
18343
  },
18267
18344
  /* @__PURE__ */ React188.createElement(
18268
18345
  Box,
@@ -18271,19 +18348,15 @@ function BaseActiveDropdownItem({
18271
18348
  alignItems: "center",
18272
18349
  justifyContent: "center",
18273
18350
  gap: horizontalIconGap,
18274
- ...alwaysVisibleLabel ? {
18275
- style: {
18276
- flexDirection: "row-reverse"
18277
- }
18278
- } : {}
18351
+ ...alwaysVisibleLabel ? { style: { flexDirection: "row-reverse" } } : {}
18279
18352
  },
18280
18353
  tagComponent,
18281
- /* @__PURE__ */ React188.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, iconComponent && /* @__PURE__ */ React188.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, iconComponent), /* @__PURE__ */ React188.createElement(Text, { color: "primaryText", size: "13", weight: "medium" }, label))
18354
+ /* @__PURE__ */ React188.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, iconComponent && /* @__PURE__ */ React188.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, iconComponent), /* @__PURE__ */ React188.createElement(Text, { color, size: "13", weight: "medium" }, label))
18282
18355
  ),
18283
18356
  /* @__PURE__ */ React188.createElement(
18284
18357
  Box,
18285
18358
  {
18286
- color: "primaryText",
18359
+ color,
18287
18360
  width: "16",
18288
18361
  height: "16",
18289
18362
  display: "flex",
@@ -18296,7 +18369,6 @@ function BaseActiveDropdownItem({
18296
18369
  /* @__PURE__ */ React188.createElement(
18297
18370
  Box,
18298
18371
  {
18299
- color: "primaryText",
18300
18372
  width: "8",
18301
18373
  height: "8",
18302
18374
  display: "flex",
@@ -18334,7 +18406,8 @@ function BaseDropdown({
18334
18406
  dropdownItemBackgroundColor = {
18335
18407
  hover: "offBackground"
18336
18408
  },
18337
- openDropdownBoxShadow = "dropdown"
18409
+ openDropdownBoxShadow = "dropdown",
18410
+ size = "regular"
18338
18411
  }) {
18339
18412
  const isMobileDevice = isMobile13();
18340
18413
  const [isOpened, setIsOpened] = useState53(false);
@@ -18343,7 +18416,7 @@ function BaseDropdown({
18343
18416
  const handleSearch = (event) => {
18344
18417
  setSearchInput(event.target.value);
18345
18418
  };
18346
- const filteredOptions = useMemo33(
18419
+ const filteredOptions = useMemo34(
18347
18420
  () => options.filter(
18348
18421
  (singleOption) => singleOption.label.toLowerCase().includes(searchInput?.toLowerCase())
18349
18422
  ),
@@ -18356,118 +18429,125 @@ function BaseDropdown({
18356
18429
  const openDrodpown = () => {
18357
18430
  setIsOpened(true);
18358
18431
  };
18359
- return /* @__PURE__ */ React189.createElement(FunClickOutside, { onClick: closeDropdown }, /* @__PURE__ */ React189.createElement(Box, { position: "relative" }, /* @__PURE__ */ React189.createElement(
18360
- BaseActiveDropdownItem_default,
18361
- {
18362
- horizontalIconGap,
18363
- onClick: isOpened ? closeDropdown : openDrodpown,
18364
- isOpened,
18365
- label: activeItemProps?.label ?? selectedOption?.label ?? placeholder ?? "",
18366
- iconComponent: activeItemProps?.iconComponent,
18367
- alwaysVisibleLabel: activeItemProps?.alwaysVisibleLabel,
18368
- tagComponent: activeItemProps?.tagComponent
18369
- }
18370
- ), /* @__PURE__ */ React189.createElement(AnimatePresence3, null, isOpened && /* @__PURE__ */ React189.createElement(
18371
- motion6.div,
18432
+ return /* @__PURE__ */ React189.createElement(FunClickOutside, { onClick: closeDropdown }, /* @__PURE__ */ React189.createElement(
18433
+ Box,
18372
18434
  {
18373
- style: {
18374
- transformOrigin: "top left",
18375
- position: "relative",
18376
- zIndex: 2
18377
- },
18378
- initial: {
18379
- opacity: 0,
18380
- scale: 0.97
18381
- },
18382
- animate: {
18383
- opacity: 1,
18384
- scale: 1,
18385
- transition: {
18386
- duration: 0.15,
18387
- ease: [0.4, 0, 0.2, 1]
18388
- }
18389
- },
18390
- exit: {
18391
- opacity: 0,
18392
- scale: 0.97,
18393
- transition: {
18394
- duration: 0.15,
18395
- ease: [0.4, 0, 0.2, 1]
18396
- }
18397
- }
18435
+ position: "relative",
18436
+ display: size === "compact" ? "flex" : void 0
18398
18437
  },
18399
18438
  /* @__PURE__ */ React189.createElement(
18400
- Box,
18439
+ BaseActiveDropdownItem_default,
18440
+ {
18441
+ size,
18442
+ horizontalIconGap,
18443
+ onClick: isOpened ? closeDropdown : openDrodpown,
18444
+ isOpened,
18445
+ color: activeItemProps?.color,
18446
+ label: activeItemProps?.label ?? selectedOption?.label ?? placeholder ?? "",
18447
+ iconComponent: activeItemProps?.iconComponent,
18448
+ alwaysVisibleLabel: activeItemProps?.alwaysVisibleLabel,
18449
+ tagComponent: activeItemProps?.tagComponent
18450
+ }
18451
+ ),
18452
+ /* @__PURE__ */ React189.createElement(AnimatePresence3, null, isOpened && /* @__PURE__ */ React189.createElement(
18453
+ motion6.div,
18401
18454
  {
18402
- position: "absolute",
18403
- background: openDropdownBackgroundColor,
18404
- borderColor: "transparent",
18405
- borderWidth: "1",
18406
- borderRadius: BORDER_RADIUS,
18407
- borderStyle: "solid",
18408
- boxShadow: openDropdownBoxShadow,
18409
18455
  style: {
18410
- width: openDropdownFullWidth ? "100%" : "180px",
18411
- ...alwaysOpenToTop || openToTopOnMobile && isMobileDevice ? {
18412
- bottom: "calc(100% + 6px)"
18413
- } : {
18414
- top: "calc(100% + 6px)"
18415
- },
18416
- right: 0
18456
+ transformOrigin: "top left",
18457
+ position: "relative",
18458
+ zIndex: 2
18459
+ },
18460
+ initial: {
18461
+ opacity: 0,
18462
+ scale: 0.97
18463
+ },
18464
+ animate: {
18465
+ opacity: 1,
18466
+ scale: 1,
18467
+ transition: {
18468
+ duration: 0.15,
18469
+ ease: [0.4, 0, 0.2, 1]
18470
+ }
18471
+ },
18472
+ exit: {
18473
+ opacity: 0,
18474
+ scale: 0.97,
18475
+ transition: {
18476
+ duration: 0.15,
18477
+ ease: [0.4, 0, 0.2, 1]
18478
+ }
18417
18479
  }
18418
18480
  },
18419
- /* @__PURE__ */ React189.createElement(Box, { display: "flex", flexDirection: "column" }, searchableOptions && /* @__PURE__ */ React189.createElement(Box, { paddingTop: "8", paddingLeft: "8", paddingRight: "8" }, /* @__PURE__ */ React189.createElement(
18420
- FunInput,
18421
- {
18422
- placeholder: searchPlaceholder ?? "Search tokens",
18423
- value: searchInput,
18424
- onChange: handleSearch,
18425
- prefixIcon: "SearchIcon"
18426
- }
18427
- )), filteredOptions.length === 0 ? /* @__PURE__ */ React189.createElement(FunNoResults, null, "No results found") : /* @__PURE__ */ React189.createElement(
18481
+ /* @__PURE__ */ React189.createElement(
18428
18482
  Box,
18429
18483
  {
18430
- as: "ul",
18431
- display: "flex",
18432
- flexDirection: "column",
18433
- padding: HORIZONTAL_OUTER_PADDING_X
18484
+ position: "absolute",
18485
+ background: openDropdownBackgroundColor,
18486
+ borderColor: "transparent",
18487
+ borderWidth: "1",
18488
+ borderRadius: BORDER_RADIUS,
18489
+ borderStyle: "solid",
18490
+ boxShadow: openDropdownBoxShadow,
18491
+ style: {
18492
+ width: openDropdownFullWidth ? "100%" : void 0,
18493
+ ...alwaysOpenToTop || openToTopOnMobile && isMobileDevice ? { bottom: "calc(100% + 6px)" } : { top: "calc(100% + 6px)" },
18494
+ right: 0
18495
+ }
18434
18496
  },
18435
- filteredOptions.map((singleOption) => {
18436
- const isSelected = singleOption.value === selectedOption?.value;
18437
- return /* @__PURE__ */ React189.createElement(
18438
- Box,
18439
- {
18440
- as: "li",
18441
- key: singleOption.value,
18442
- onClick: () => {
18443
- onOptionSelected?.(singleOption);
18444
- closeDropdown();
18497
+ /* @__PURE__ */ React189.createElement(Box, { display: "flex", flexDirection: "column" }, searchableOptions && /* @__PURE__ */ React189.createElement(Box, { paddingTop: "8", paddingX: "8" }, /* @__PURE__ */ React189.createElement(
18498
+ FunInput,
18499
+ {
18500
+ placeholder: searchPlaceholder ?? "Search tokens",
18501
+ value: searchInput,
18502
+ onChange: handleSearch,
18503
+ prefixIcon: "SearchIcon"
18504
+ }
18505
+ )), filteredOptions.length === 0 ? /* @__PURE__ */ React189.createElement(FunNoResults, null, "No results found") : /* @__PURE__ */ React189.createElement(
18506
+ Box,
18507
+ {
18508
+ as: "ul",
18509
+ display: "flex",
18510
+ flexDirection: "column",
18511
+ padding: size === "compact" ? "6" : HORIZONTAL_OUTER_PADDING_X
18512
+ },
18513
+ filteredOptions.map((singleOption) => {
18514
+ const isSelected = singleOption.value === selectedOption?.value;
18515
+ return /* @__PURE__ */ React189.createElement(
18516
+ Box,
18517
+ {
18518
+ as: "li",
18519
+ key: singleOption.value,
18520
+ onClick: () => {
18521
+ onOptionSelected?.(singleOption);
18522
+ closeDropdown();
18523
+ },
18524
+ background: dropdownItemBackgroundColor,
18525
+ className: baseDropdownItemWrapperStyles
18445
18526
  },
18446
- background: dropdownItemBackgroundColor,
18447
- className: baseDropdownItemWrapperStyles
18448
- },
18449
- renderDropdownOption(singleOption, isSelected)
18450
- );
18451
- })
18527
+ renderDropdownOption(singleOption, isSelected)
18528
+ );
18529
+ })
18530
+ ))
18531
+ )
18532
+ )),
18533
+ preloadIconUrls && /* @__PURE__ */ React189.createElement(
18534
+ Box,
18535
+ {
18536
+ display: "none",
18537
+ "aria-hidden": true,
18538
+ style: { position: "absolute", top: "-100%", left: "-100%" }
18539
+ },
18540
+ preloadIconUrls.map((url, index) => /* @__PURE__ */ React189.createElement(
18541
+ "img",
18542
+ {
18543
+ key: `${url}-${// biome-ignore lint/suspicious/noArrayIndexKey: <we need a unique key for each url combination so it's okay to rely on index here, if the order or the urls change, the key will change as well and rerender>
18544
+ index}`,
18545
+ src: url,
18546
+ alt: ""
18547
+ }
18452
18548
  ))
18453
18549
  )
18454
- )), preloadIconUrls && /* @__PURE__ */ React189.createElement(
18455
- Box,
18456
- {
18457
- display: "none",
18458
- "aria-hidden": true,
18459
- style: { position: "absolute", top: "-100%", left: "-100%" }
18460
- },
18461
- preloadIconUrls.map((url, index) => /* @__PURE__ */ React189.createElement(
18462
- "img",
18463
- {
18464
- key: `${url}-${// biome-ignore lint/suspicious/noArrayIndexKey: <we need a unique key for each url combination so it's okay to rely on index here, if the order or the urls change, the key will change as well and rerender>
18465
- index}`,
18466
- src: url,
18467
- alt: ""
18468
- }
18469
- ))
18470
- )));
18550
+ ));
18471
18551
  }
18472
18552
  var BaseDropdown_default = BaseDropdown;
18473
18553
 
@@ -18522,18 +18602,16 @@ function BaseDropdownItem({
18522
18602
  gap: horizontalIconGap
18523
18603
  },
18524
18604
  iconComponent && /* @__PURE__ */ React190.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, iconComponent),
18525
- /* @__PURE__ */ React190.createElement(Text, { color: "primaryText", size: "13", weight: "medium" }, label),
18526
- tagComponent
18605
+ /* @__PURE__ */ React190.createElement(Text, { size: "13", weight: "medium" }, label)
18527
18606
  ),
18528
- /* @__PURE__ */ React190.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center", gap: "16" }, isSelected && /* @__PURE__ */ React190.createElement(
18607
+ /* @__PURE__ */ React190.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center", gap: "16" }, tagComponent, /* @__PURE__ */ React190.createElement(
18529
18608
  Box,
18530
18609
  {
18531
18610
  width: "16",
18532
18611
  height: "16",
18533
- display: "flex",
18534
18612
  alignItems: "center",
18535
18613
  justifyContent: "center",
18536
- color: "primaryText"
18614
+ color: isSelected ? "primaryText" : "transparent"
18537
18615
  },
18538
18616
  /* @__PURE__ */ React190.createElement(CheckIcon, null)
18539
18617
  ))
@@ -18541,12 +18619,99 @@ function BaseDropdownItem({
18541
18619
  }
18542
18620
  var BaseDropdownItem_default = BaseDropdownItem;
18543
18621
 
18622
+ // src/components/Dropdown/ChainDropdown.tsx
18623
+ var CHAIN_ICON_SIZE = 16;
18624
+ var DEFAULT_VALUE = "";
18625
+ var ChainDropdown = ({
18626
+ assets,
18627
+ chainIds: chains,
18628
+ selectedChainId,
18629
+ selectedToken,
18630
+ allowUnselect,
18631
+ onChainSelected,
18632
+ activeItemProps,
18633
+ size = "regular",
18634
+ openDropdownBackgroundColor,
18635
+ dropdownItemBackgroundColor,
18636
+ openDropdownBoxShadow
18637
+ }) => {
18638
+ const chainIds = chains ?? Object.keys(assets).map(Number);
18639
+ const enabledChainIds = selectedToken ? chainIds.filter((chainId) => assets[chainId].includes(selectedToken)) : chainIds;
18640
+ const options = allowUnselect ? [DEFAULT_VALUE, ...chainIds] : chainIds;
18641
+ const handleOptionSelect = (value) => {
18642
+ if (!value) return onChainSelected(void 0);
18643
+ const chainId = Number(value);
18644
+ if (allowUnselect && chainId === selectedChainId) {
18645
+ onChainSelected(void 0);
18646
+ } else {
18647
+ onChainSelected(chainId);
18648
+ }
18649
+ };
18650
+ return /* @__PURE__ */ React191.createElement(
18651
+ BaseDropdown_default,
18652
+ {
18653
+ openDropdownBoxShadow,
18654
+ openDropdownBackgroundColor,
18655
+ dropdownItemBackgroundColor,
18656
+ size,
18657
+ openToTopOnMobile: false,
18658
+ openDropdownFullWidth: size === "regular",
18659
+ placeholder: "All chains",
18660
+ activeItemProps: {
18661
+ iconComponent: !!selectedChainId && /* @__PURE__ */ React191.createElement(
18662
+ AsyncImage,
18663
+ {
18664
+ alt: chainMetadataById[selectedChainId].name,
18665
+ background: chainMetadataById[selectedChainId].iconBackground,
18666
+ borderRadius: "full",
18667
+ height: CHAIN_ICON_SIZE,
18668
+ width: CHAIN_ICON_SIZE,
18669
+ src: chainMetadataById[selectedChainId].iconUrl
18670
+ }
18671
+ ),
18672
+ ...activeItemProps
18673
+ },
18674
+ value: selectedChainId?.toString() ?? DEFAULT_VALUE,
18675
+ options: options.map((chainId) => ({
18676
+ value: chainId.toString(),
18677
+ label: chainId === DEFAULT_VALUE ? "All chains" : chainMetadataById[chainId].name ?? ""
18678
+ })),
18679
+ renderDropdownOption: (option, isSelected) => {
18680
+ const metadata = chainMetadataById[option.value];
18681
+ return /* @__PURE__ */ React191.createElement(
18682
+ BaseDropdownItem_default,
18683
+ {
18684
+ iconComponent: metadata && /* @__PURE__ */ React191.createElement(
18685
+ AsyncImage,
18686
+ {
18687
+ alt: metadata.name,
18688
+ background: metadata.iconBackground,
18689
+ borderRadius: "full",
18690
+ height: CHAIN_ICON_SIZE,
18691
+ width: CHAIN_ICON_SIZE,
18692
+ src: metadata.iconUrl
18693
+ }
18694
+ ),
18695
+ id: option.value,
18696
+ onClick: handleOptionSelect,
18697
+ label: option.label,
18698
+ isSelected,
18699
+ isDisabled: option.value !== DEFAULT_VALUE && !enabledChainIds.includes(Number(option.value))
18700
+ }
18701
+ );
18702
+ },
18703
+ preloadIconUrls: chainIds.map((id) => chainMetadataById[id].iconUrl)
18704
+ }
18705
+ );
18706
+ };
18707
+
18544
18708
  // src/components/Dropdown/ReceiveTokenDropdown.tsx
18709
+ import React192, { useState as useState54 } from "react";
18545
18710
  var TOKEN_ICON_SIZE = 16;
18546
18711
  var getTokenIconUrl = (symbol) => {
18547
18712
  return ASSET_LOGO_SRCS[symbol.toUpperCase()];
18548
18713
  };
18549
- var aprTag = (badgeText) => /* @__PURE__ */ React191.createElement(
18714
+ var aprTag = (badgeText) => /* @__PURE__ */ React192.createElement(
18550
18715
  FunAssetBadge,
18551
18716
  {
18552
18717
  background: "badgeBackgroundSuccess",
@@ -18575,7 +18740,7 @@ var ReceiveTokenDropdown = ({
18575
18740
  onTokenSelected(matchingToken);
18576
18741
  }
18577
18742
  };
18578
- return /* @__PURE__ */ React191.createElement(
18743
+ return /* @__PURE__ */ React192.createElement(
18579
18744
  BaseDropdown_default,
18580
18745
  {
18581
18746
  openDropdownBoxShadow: "vertexDropdown",
@@ -18586,7 +18751,7 @@ var ReceiveTokenDropdown = ({
18586
18751
  horizontalIconGap: "8",
18587
18752
  openToTopOnMobile: false,
18588
18753
  activeItemProps: {
18589
- iconComponent: /* @__PURE__ */ React191.createElement(
18754
+ iconComponent: /* @__PURE__ */ React192.createElement(
18590
18755
  AsyncImage,
18591
18756
  {
18592
18757
  alt: selectedSymbol,
@@ -18612,23 +18777,22 @@ var ReceiveTokenDropdown = ({
18612
18777
  (token) => token.tokenSymbol === symbol
18613
18778
  )?.badgeText;
18614
18779
  const tagComponent = tokenBadgeText2 ? aprTag(tokenBadgeText2) : void 0;
18615
- return /* @__PURE__ */ React191.createElement(
18780
+ return /* @__PURE__ */ React192.createElement(
18616
18781
  BaseDropdownItem_default,
18617
18782
  {
18618
18783
  horizontalIconGap: "8",
18619
- iconComponent: /* @__PURE__ */ React191.createElement(
18784
+ iconComponent: /* @__PURE__ */ React192.createElement(
18620
18785
  FunAssetAvatar,
18621
18786
  {
18622
18787
  assetIconSize: `${TOKEN_ICON_SIZE}`,
18623
18788
  assetName: "receive-token-asset",
18624
18789
  assetSrc: iconUrl,
18625
18790
  chainId,
18626
- borderedChainIcon: false,
18627
18791
  largeChainIcon: true
18628
18792
  }
18629
18793
  ),
18630
18794
  id: option.value,
18631
- onClick: (newSymbol) => handleChangeSymbol(newSymbol),
18795
+ onClick: handleChangeSymbol,
18632
18796
  label: option.label,
18633
18797
  isSelected,
18634
18798
  tagComponent
@@ -18643,13 +18807,104 @@ var ReceiveTokenDropdown = ({
18643
18807
  };
18644
18808
  var ReceiveTokenDropdown_default = ReceiveTokenDropdown;
18645
18809
 
18810
+ // src/components/SourcePaymentMethodItem/SourcePaymentMethodItem.tsx
18811
+ import React194 from "react";
18812
+
18813
+ // src/components/FunPaymentMethodItem/FunPaymentMethodItem.tsx
18814
+ import React193 from "react";
18815
+ var ValueIcon = ({ valueIcon }) => {
18816
+ if (!valueIcon) return null;
18817
+ return /* @__PURE__ */ React193.createElement(
18818
+ Box,
18819
+ {
18820
+ height: "max",
18821
+ flexDirection: "row",
18822
+ display: "flex",
18823
+ alignItems: "center",
18824
+ justifyContent: "flex-end"
18825
+ },
18826
+ valueIcon
18827
+ );
18828
+ };
18829
+ var PaymentMethodWrapper = ({
18830
+ paddingY,
18831
+ isActive,
18832
+ isDisabled,
18833
+ onClick,
18834
+ children
18835
+ }) => {
18836
+ return /* @__PURE__ */ React193.createElement(
18837
+ FunOptionBox,
18838
+ {
18839
+ type: "bordered",
18840
+ isActive,
18841
+ disabled: isDisabled,
18842
+ onClick,
18843
+ paddingY,
18844
+ paddingRight: "11",
18845
+ paddingLeft: "11"
18846
+ },
18847
+ children
18848
+ );
18849
+ };
18850
+ var FunPaymentMethodItem = ({
18851
+ keyIcon,
18852
+ keyText,
18853
+ valueIcon,
18854
+ disclaimerText,
18855
+ onClick,
18856
+ isError = false,
18857
+ isDisabled = false,
18858
+ isActive = false
18859
+ }) => {
18860
+ return /* @__PURE__ */ React193.createElement(
18861
+ PaymentMethodWrapper,
18862
+ {
18863
+ isActive,
18864
+ isDisabled,
18865
+ onClick,
18866
+ paddingY: "11"
18867
+ },
18868
+ /* @__PURE__ */ React193.createElement(Box, { display: "flex", alignItems: "center", gap: "12" }, keyIcon ? /* @__PURE__ */ React193.createElement(Box, { flexDirection: "row", display: "flex", alignItems: "center" }, keyIcon) : null, /* @__PURE__ */ React193.createElement(Box, { display: "flex", gap: "4", flexDirection: "column" }, /* @__PURE__ */ React193.createElement(Text, { color: "primaryText", weight: "medium", size: "12" }, keyText), disclaimerText ? /* @__PURE__ */ React193.createElement(Text, { size: "12", color: isError ? "error" : "secondaryText" }, disclaimerText) : null)),
18869
+ /* @__PURE__ */ React193.createElement(ValueIcon, { valueIcon })
18870
+ );
18871
+ };
18872
+
18873
+ // src/components/SourcePaymentMethodItem/SourcePaymentMethodItem.css.ts
18874
+ var badgeStyle = "_1yofefl0";
18875
+
18876
+ // src/components/SourcePaymentMethodItem/SourcePaymentMethodItem.tsx
18877
+ var SourcePaymentMethodItem = ({
18878
+ keyIcon,
18879
+ keyText,
18880
+ disclaimerText,
18881
+ onClick,
18882
+ otherSourcesCount,
18883
+ isError = false,
18884
+ isDisabled = false,
18885
+ isActive = false
18886
+ }) => {
18887
+ const { textCustomizations } = useFunkitConfig();
18888
+ return /* @__PURE__ */ React194.createElement(
18889
+ PaymentMethodWrapper,
18890
+ {
18891
+ isActive,
18892
+ isDisabled,
18893
+ onClick,
18894
+ paddingY: "7"
18895
+ },
18896
+ /* @__PURE__ */ React194.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React194.createElement(Text, { color: "secondaryText", size: "10" }, textCustomizations.sourceMethodTitle), /* @__PURE__ */ React194.createElement(Box, { display: "flex", gap: "6", alignItems: "center" }, keyIcon ? /* @__PURE__ */ React194.createElement(Box, { flexDirection: "row", display: "flex", alignItems: "center" }, keyIcon) : null, /* @__PURE__ */ React194.createElement(Text, { color: "primaryText", weight: "medium", size: "12" }, keyText), disclaimerText ? /* @__PURE__ */ React194.createElement(Text, { size: "12", color: isError ? "error" : "secondaryText" }, disclaimerText) : null)),
18897
+ /* @__PURE__ */ React194.createElement(Box, { color: "tertiaryText", display: "flex", alignItems: "center", gap: "6" }, otherSourcesCount > 0 && /* @__PURE__ */ React194.createElement(FunBadge, { borderRadius: "full" }, /* @__PURE__ */ React194.createElement(Box, { className: badgeStyle }, otherSourcesCount)), /* @__PURE__ */ React194.createElement(ArrowIcon, { direction: "right", size: 20 }))
18898
+ );
18899
+ };
18900
+
18646
18901
  // src/hooks/useAllowedAssets.ts
18647
18902
  import { getAllowedAssets } from "@funkit/api-base";
18648
- import { useQuery as useQuery9 } from "@tanstack/react-query";
18649
- import { useCallback as useCallback38, useMemo as useMemo34 } from "react";
18903
+ import { useQuery as useQuery8 } from "@tanstack/react-query";
18904
+ import { useCallback as useCallback38, useMemo as useMemo35 } from "react";
18650
18905
  function useAllowedAssets() {
18651
18906
  const { apiKey } = useFunkitConfig();
18652
- const { data, isLoading } = useQuery9({
18907
+ const { data, isLoading } = useQuery8({
18653
18908
  queryKey: ["getAllowedAssets", apiKey],
18654
18909
  queryFn: () => getAllowedAssets({ apiKey, logger }),
18655
18910
  refetchOnMount: false,
@@ -18658,7 +18913,7 @@ function useAllowedAssets() {
18658
18913
  staleTime: 5 * 60 * 1e3,
18659
18914
  gcTime: Number.POSITIVE_INFINITY
18660
18915
  });
18661
- const tokens = useMemo34(() => {
18916
+ const tokens = useMemo35(() => {
18662
18917
  const ret = {};
18663
18918
  if (!data) {
18664
18919
  return ret;
@@ -18717,120 +18972,32 @@ var usePaymentSources = (paymentMethodInfo, targetChainId) => {
18717
18972
  const accountPaymentMethodInfo = createPaymentMethodInfo({
18718
18973
  paymentMethod: "balance" /* ACCOUNT_BALANCE */,
18719
18974
  walletAddress
18720
- });
18721
- const connectedAccountInfo = paymentMethodInfo?.paymentMethod !== "balance" /* ACCOUNT_BALANCE */ && isUserLoggedIn && hasUsableBalance ? accountPaymentMethodInfo : null;
18722
- const connected = [
18723
- paymentMethodInfo,
18724
- connectedAccountInfo,
18725
- ...activeConnections
18726
- ].filter(isNotNullish12);
18727
- const isCardEnabled = uiCustomizations?.paymentMethods?.isCardEnabled ?? true;
18728
- const ignoreFallback = isUserLoggedIn && !hasUsableBalance;
18729
- const fallback2 = connected.length === 0 && !ignoreFallback ? isTokenTransferEnabled ? ["token_transfer" /* TOKEN_TRANSFER */] : isCardEnabled ? ["card" /* CARD */] : isDydxCustomer(apiKey) ? [] : ["balance" /* ACCOUNT_BALANCE */] : [];
18730
- const isTokenInNewSources = !fallback2.includes("token_transfer" /* TOKEN_TRANSFER */) && isTokenTransferEnabled;
18731
- const isWalletInNewSources = !isUserLoggedIn && !isDydxCustomer(apiKey);
18732
- const newSources = [
18733
- isTokenInNewSources && "token_transfer" /* TOKEN_TRANSFER */,
18734
- "brokerage" /* BROKERAGE */,
18735
- isWalletInNewSources && "balance" /* ACCOUNT_BALANCE */,
18736
- !fallback2.includes("card" /* CARD */) && isCardEnabled && "card" /* CARD */
18737
- ].filter((b) => !!b);
18738
- return {
18739
- preferred: connected.length > 0 ? connected : fallback2,
18740
- moreSources: newSources
18741
- };
18742
- };
18743
- var useRemainingPaymentSourcesCount = (targetChainId) => {
18744
- const { moreSources, preferred } = usePaymentSources(null, targetChainId);
18745
- return Math.max(moreSources.length + preferred.length - 1, 0);
18746
- };
18747
-
18748
- // src/components/FunPaymentMethodItem/FunPaymentMethodItem.tsx
18749
- import React192 from "react";
18750
-
18751
- // src/components/FunPaymentMethodItem/FunPaymentMethodItem.css.ts
18752
- var badgeStyle = "_74u6re0";
18753
-
18754
- // src/components/FunPaymentMethodItem/FunPaymentMethodItem.tsx
18755
- var ValueIcon = ({ valueIcon }) => {
18756
- if (!valueIcon) return null;
18757
- return /* @__PURE__ */ React192.createElement(
18758
- Box,
18759
- {
18760
- height: "max",
18761
- flexDirection: "row",
18762
- display: "flex",
18763
- alignItems: "center",
18764
- justifyContent: "flex-end"
18765
- },
18766
- valueIcon
18767
- );
18768
- };
18769
- var PaymentMethodWrapper = ({
18770
- paddingY,
18771
- isActive,
18772
- isDisabled,
18773
- onClick,
18774
- children
18775
- }) => {
18776
- return /* @__PURE__ */ React192.createElement(
18777
- FunOptionBox,
18778
- {
18779
- type: "bordered",
18780
- isActive,
18781
- disabled: isDisabled,
18782
- onClick,
18783
- paddingY,
18784
- paddingRight: "11",
18785
- paddingLeft: "11"
18786
- },
18787
- children
18788
- );
18789
- };
18790
- var FunPaymentMethodItem = ({
18791
- keyIcon,
18792
- keyText,
18793
- valueIcon,
18794
- disclaimerText,
18795
- onClick,
18796
- isError = false,
18797
- isDisabled = false,
18798
- isActive = false
18799
- }) => {
18800
- return /* @__PURE__ */ React192.createElement(
18801
- PaymentMethodWrapper,
18802
- {
18803
- isActive,
18804
- isDisabled,
18805
- onClick,
18806
- paddingY: "11"
18807
- },
18808
- /* @__PURE__ */ React192.createElement(Box, { display: "flex", alignItems: "center", gap: "12" }, keyIcon ? /* @__PURE__ */ React192.createElement(Box, { flexDirection: "row", display: "flex", alignItems: "center" }, keyIcon) : null, /* @__PURE__ */ React192.createElement(Box, { display: "flex", gap: "4", flexDirection: "column" }, /* @__PURE__ */ React192.createElement(Text, { color: "primaryText", weight: "medium", size: "12" }, keyText), disclaimerText ? /* @__PURE__ */ React192.createElement(Text, { size: "12", color: isError ? "error" : "secondaryText" }, disclaimerText) : null)),
18809
- /* @__PURE__ */ React192.createElement(ValueIcon, { valueIcon })
18810
- );
18975
+ });
18976
+ const connectedAccountInfo = paymentMethodInfo?.paymentMethod !== "balance" /* ACCOUNT_BALANCE */ && isUserLoggedIn && hasUsableBalance ? accountPaymentMethodInfo : null;
18977
+ const connected = [
18978
+ paymentMethodInfo,
18979
+ connectedAccountInfo,
18980
+ ...activeConnections
18981
+ ].filter(isNotNullish12);
18982
+ const isCardEnabled = uiCustomizations?.paymentMethods?.isCardEnabled ?? true;
18983
+ const ignoreFallback = isUserLoggedIn && !hasUsableBalance;
18984
+ const fallback2 = connected.length === 0 && !ignoreFallback ? isTokenTransferEnabled ? ["token_transfer" /* TOKEN_TRANSFER */] : isCardEnabled ? ["card" /* CARD */] : isDydxCustomer(apiKey) ? [] : ["balance" /* ACCOUNT_BALANCE */] : [];
18985
+ const isTokenInNewSources = !fallback2.includes("token_transfer" /* TOKEN_TRANSFER */) && isTokenTransferEnabled;
18986
+ const isWalletInNewSources = !isUserLoggedIn && !isDydxCustomer(apiKey);
18987
+ const newSources = [
18988
+ isTokenInNewSources && "token_transfer" /* TOKEN_TRANSFER */,
18989
+ "brokerage" /* BROKERAGE */,
18990
+ isWalletInNewSources && "balance" /* ACCOUNT_BALANCE */,
18991
+ !fallback2.includes("card" /* CARD */) && isCardEnabled && "card" /* CARD */
18992
+ ].filter((b) => !!b);
18993
+ return {
18994
+ preferred: connected.length > 0 ? connected : fallback2,
18995
+ moreSources: newSources
18996
+ };
18811
18997
  };
18812
- var SourcePaymentMethodItem = ({
18813
- keyIcon,
18814
- keyText,
18815
- disclaimerText,
18816
- onClick,
18817
- otherSourcesCount,
18818
- isError = false,
18819
- isDisabled = false,
18820
- isActive = false
18821
- }) => {
18822
- const { textCustomizations } = useFunkitConfig();
18823
- return /* @__PURE__ */ React192.createElement(
18824
- PaymentMethodWrapper,
18825
- {
18826
- isActive,
18827
- isDisabled,
18828
- onClick,
18829
- paddingY: "7"
18830
- },
18831
- /* @__PURE__ */ React192.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React192.createElement(Text, { color: "secondaryText", size: "10" }, textCustomizations.sourceMethodTitle), /* @__PURE__ */ React192.createElement(Box, { display: "flex", gap: "6", alignItems: "center" }, keyIcon ? /* @__PURE__ */ React192.createElement(Box, { flexDirection: "row", display: "flex", alignItems: "center" }, keyIcon) : null, /* @__PURE__ */ React192.createElement(Text, { color: "primaryText", weight: "medium", size: "12" }, keyText), disclaimerText ? /* @__PURE__ */ React192.createElement(Text, { size: "12", color: isError ? "error" : "secondaryText" }, disclaimerText) : null)),
18832
- /* @__PURE__ */ React192.createElement(Box, { color: "tertiaryText", display: "flex", alignItems: "center", gap: "6" }, otherSourcesCount > 0 && /* @__PURE__ */ React192.createElement(FunBadge, { borderRadius: "full" }, /* @__PURE__ */ React192.createElement(Box, { className: badgeStyle }, otherSourcesCount)), /* @__PURE__ */ React192.createElement(ArrowIcon, { direction: "right", size: 20 }))
18833
- );
18998
+ var useRemainingPaymentSourcesCount = (targetChainId) => {
18999
+ const { moreSources, preferred } = usePaymentSources(null, targetChainId);
19000
+ return Math.max(moreSources.length + preferred.length - 1, 0);
18834
19001
  };
18835
19002
 
18836
19003
  // src/modals/CheckoutModal/SelectAsset.tsx
@@ -18868,7 +19035,7 @@ function useEnrichedAccountHoldings({
18868
19035
  const { isAllowed, isLoading: isLoadingAllowed } = useAllowedAssets();
18869
19036
  const { flags, isLoading: isLoadingFlags } = useFlags();
18870
19037
  const { loginType } = useGeneralWallet();
18871
- const enrichedAccountHoldings = useMemo35(() => {
19038
+ const enrichedAccountHoldings = useMemo36(() => {
18872
19039
  if (!checkoutItem) return [];
18873
19040
  return Object.values(accountHoldings).map((asset) => {
18874
19041
  const usableForCheckout = isAssetUsableToPayForCheckout(
@@ -18900,13 +19067,16 @@ function useAssetOptions({
18900
19067
  checkoutItem,
18901
19068
  enrichedAccountHoldings,
18902
19069
  isLoadingFlags,
18903
- defaultTokenSymbols
19070
+ defaultTokenSymbols,
19071
+ chainId
18904
19072
  }) {
18905
- const assetOptions = useMemo35(() => {
19073
+ const assetOptions = useMemo36(() => {
18906
19074
  if (!checkoutItem || isLoadingFlags) {
18907
19075
  return [];
18908
19076
  }
18909
- return enrichedAccountHoldings.map(({ asset, usableForCheckout }) => {
19077
+ return enrichedAccountHoldings.filter(
19078
+ ({ asset }) => chainId !== void 0 ? asset.pickedChainId === chainId.toString() : true
19079
+ ).map(({ asset, usableForCheckout }) => {
18910
19080
  const { isUsable, reason } = usableForCheckout;
18911
19081
  const isKnown = isKnownAsset2(asset);
18912
19082
  const isDisabled = !isUsable || !isKnown;
@@ -18936,7 +19106,8 @@ function useAssetOptions({
18936
19106
  defaultTokenSymbols,
18937
19107
  enrichedAccountHoldings,
18938
19108
  checkoutItem,
18939
- isLoadingFlags
19109
+ isLoadingFlags,
19110
+ chainId
18940
19111
  ]);
18941
19112
  return { assetOptions };
18942
19113
  }
@@ -18946,12 +19117,13 @@ function MeshOrAccountSelectAsset({
18946
19117
  accountHoldings,
18947
19118
  fetchHoldingsError
18948
19119
  }) {
19120
+ const [selectedChainId, setSelectedChainId] = useState55();
18949
19121
  const { apiKey } = useFunkitConfig();
18950
19122
  const { checkoutItem, updateSourceAsset, updateTargetAsset } = useCheckoutContext();
18951
19123
  const [explicitlySelectedChainTokenSymbol, setSelectedChainTokenSymbol] = useState55("");
18952
19124
  const candidates = checkoutItem?.initSettings.config.dynamicTargetAssetCandidates;
18953
19125
  const [userSelectedTargetAssetVertex, setUserSelectedTargetAssetVertex] = useState55(isVertexCustomer(apiKey) && candidates ? candidates[0] : null);
18954
- const defaultTokenSymbols = useMemo35(() => {
19126
+ const defaultTokenSymbols = useMemo36(() => {
18955
19127
  if (!checkoutItem) {
18956
19128
  return [];
18957
19129
  }
@@ -18972,7 +19144,8 @@ function MeshOrAccountSelectAsset({
18972
19144
  checkoutItem,
18973
19145
  enrichedAccountHoldings,
18974
19146
  isLoadingFlags,
18975
- defaultTokenSymbols
19147
+ defaultTokenSymbols,
19148
+ chainId: selectedChainId
18976
19149
  });
18977
19150
  const updateTargetAssetForVertex = (tokenItem) => {
18978
19151
  const candidates2 = checkoutItem?.initSettings.config.dynamicTargetAssetCandidates;
@@ -19022,9 +19195,12 @@ function MeshOrAccountSelectAsset({
19022
19195
  updateTargetAssetForVertex(tokenItem);
19023
19196
  onFinish();
19024
19197
  });
19025
- const selectedChainTokenSymbol = useMemo35(() => {
19198
+ const selectedChainTokenSymbol = useMemo36(() => {
19026
19199
  if (explicitlySelectedChainTokenSymbol) {
19027
- return explicitlySelectedChainTokenSymbol;
19200
+ const assetExists = assetOptions.find(
19201
+ ({ asset }) => asset.chainSymbolKey === explicitlySelectedChainTokenSymbol
19202
+ );
19203
+ if (assetExists) return explicitlySelectedChainTokenSymbol;
19028
19204
  }
19029
19205
  if (checkoutItem?.selectedSourceAssetInfo.symbol) {
19030
19206
  const key = combineChainSymbolOrAddress({
@@ -19045,7 +19221,7 @@ function MeshOrAccountSelectAsset({
19045
19221
  checkoutItem?.selectedSourceAssetInfo,
19046
19222
  explicitlySelectedChainTokenSymbol
19047
19223
  ]);
19048
- useEffect41(() => {
19224
+ useEffect40(() => {
19049
19225
  const optionEl = document.getElementById(
19050
19226
  `option-${selectedChainTokenSymbol}`
19051
19227
  );
@@ -19059,9 +19235,21 @@ function MeshOrAccountSelectAsset({
19059
19235
  const isAssetsEmpty = assetOptions.length === 0;
19060
19236
  const isDisabled = isAssetsEmpty || !selectedChainTokenSymbol;
19061
19237
  if (isLoadingFlags || isLoadingAllowed) {
19062
- return /* @__PURE__ */ React193.createElement(FunAssetLoading, { count: 5 });
19238
+ return /* @__PURE__ */ React195.createElement(FunAssetLoading, { count: isVertexCustomer(apiKey) ? 7 : 5 });
19063
19239
  }
19064
- return /* @__PURE__ */ React193.createElement(Box, null, /* @__PURE__ */ React193.createElement(
19240
+ const assetList = isAssetsEmpty ? /* @__PURE__ */ React195.createElement(FunNoResults, null, "No assets found") : /* @__PURE__ */ React195.createElement(Box, { display: "flex", flexDirection: "column" }, assetOptions.map(({ asset, isDisabled: isDisabled2, badgeColors, badgeText }) => /* @__PURE__ */ React195.createElement(
19241
+ FunAssetItem,
19242
+ {
19243
+ key: asset.chainSymbolKey,
19244
+ asset,
19245
+ isActive: selectedChainTokenSymbol === asset.chainSymbolKey,
19246
+ isDisabled: isDisabled2,
19247
+ badgeColors,
19248
+ badgeText,
19249
+ onClick: () => setSelectedChainTokenSymbol(asset.chainSymbolKey)
19250
+ }
19251
+ )));
19252
+ return /* @__PURE__ */ React195.createElement(React195.Fragment, null, /* @__PURE__ */ React195.createElement(
19065
19253
  Box,
19066
19254
  {
19067
19255
  width: "full",
@@ -19069,50 +19257,49 @@ function MeshOrAccountSelectAsset({
19069
19257
  borderColor: "generalBorderDim",
19070
19258
  display: "flex",
19071
19259
  flexDirection: "column",
19072
- gap: "4"
19260
+ gap: "4",
19261
+ style: { flex: 1 }
19073
19262
  },
19074
- isAssetsEmpty ? /* @__PURE__ */ React193.createElement(FunNoResults, null, "No assets found") : isVertexCustomer(apiKey) && candidates ? /* @__PURE__ */ React193.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, /* @__PURE__ */ React193.createElement(
19075
- ReceiveTokenDropdown_default,
19263
+ isVertexCustomer(apiKey) && candidates ? /* @__PURE__ */ React195.createElement(
19264
+ Box,
19076
19265
  {
19077
- tokens: candidates,
19078
- chainId: Number(checkoutItem?.initSettings.config.targetChain),
19079
- defaultSelectedToken: checkoutItem?.initSettings.config.targetAssetTicker || void 0,
19080
- onTokenSelected: (token) => {
19081
- setUserSelectedTargetAssetVertex(token);
19082
- }
19083
- }
19084
- ), /* @__PURE__ */ React193.createElement(Box, { display: "flex", flexDirection: "column" }, assetOptions.map(
19085
- ({ asset, isDisabled: isDisabled2, badgeColors, badgeText }) => /* @__PURE__ */ React193.createElement(
19086
- FunAssetItem,
19266
+ display: "flex",
19267
+ flexDirection: "column",
19268
+ gap: "12",
19269
+ style: { flex: 1 }
19270
+ },
19271
+ /* @__PURE__ */ React195.createElement(
19272
+ ReceiveTokenDropdown_default,
19087
19273
  {
19088
- key: asset.chainSymbolKey,
19089
- asset,
19090
- isActive: selectedChainTokenSymbol === asset.chainSymbolKey,
19091
- isDisabled: isDisabled2,
19092
- badgeColors,
19093
- badgeText,
19094
- onClick: () => setSelectedChainTokenSymbol(asset.chainSymbolKey)
19274
+ tokens: candidates,
19275
+ chainId: Number(checkoutItem?.initSettings.config.targetChain),
19276
+ defaultSelectedToken: checkoutItem?.initSettings.config.targetAssetTicker || void 0,
19277
+ onTokenSelected: setUserSelectedTargetAssetVertex
19095
19278
  }
19096
- )
19097
- ))) : /* @__PURE__ */ React193.createElement(Box, { display: "flex", flexDirection: "column" }, assetOptions.map(
19098
- ({ asset, isDisabled: isDisabled2, badgeColors, badgeText }) => /* @__PURE__ */ React193.createElement(
19099
- FunAssetItem,
19279
+ ),
19280
+ /* @__PURE__ */ React195.createElement(
19281
+ Box,
19100
19282
  {
19101
- key: asset.chainSymbolKey,
19102
- asset,
19103
- isActive: selectedChainTokenSymbol === asset.chainSymbolKey,
19104
- isDisabled: isDisabled2,
19105
- badgeColors,
19106
- badgeText,
19107
- onClick: () => setSelectedChainTokenSymbol(asset.chainSymbolKey)
19108
- }
19283
+ display: "flex",
19284
+ flexDirection: "column",
19285
+ gap: "4",
19286
+ style: { flex: 1 }
19287
+ },
19288
+ /* @__PURE__ */ React195.createElement(
19289
+ FilterAssets,
19290
+ {
19291
+ value: selectedChainId,
19292
+ onFilterChange: setSelectedChainId
19293
+ }
19294
+ ),
19295
+ assetList
19109
19296
  )
19110
- ))
19297
+ ) : assetList
19111
19298
  ), bottomSectionRef && createPortal8(
19112
- /* @__PURE__ */ React193.createElement(
19299
+ /* @__PURE__ */ React195.createElement(
19113
19300
  Dialog.BottomBar,
19114
19301
  {
19115
- topSection: /* @__PURE__ */ React193.createElement(
19302
+ topSection: /* @__PURE__ */ React195.createElement(
19116
19303
  FunNotification,
19117
19304
  {
19118
19305
  isVisible: !!fetchHoldingsError,
@@ -19130,6 +19317,38 @@ function MeshOrAccountSelectAsset({
19130
19317
  bottomSectionRef
19131
19318
  ));
19132
19319
  }
19320
+ var FilterAssets = ({ value, onFilterChange }) => {
19321
+ const enabledChainIds = FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST.sort(
19322
+ (a, b) => a.name.localeCompare(b.name)
19323
+ ).map((chain) => chain.id);
19324
+ return /* @__PURE__ */ React195.createElement(
19325
+ Box,
19326
+ {
19327
+ display: "flex",
19328
+ justifyContent: "space-between",
19329
+ alignItems: "center",
19330
+ color: "secondaryText"
19331
+ },
19332
+ /* @__PURE__ */ React195.createElement(Text, { size: "12", color: "secondaryText" }, "Your tokens"),
19333
+ /* @__PURE__ */ React195.createElement(
19334
+ ChainDropdown,
19335
+ {
19336
+ openDropdownBoxShadow: "vertexDropdown",
19337
+ dropdownItemBackgroundColor: {
19338
+ hover: "offBackgroundComplimentary"
19339
+ },
19340
+ openDropdownBackgroundColor: "offBackground",
19341
+ activeItemProps: { color: "secondaryText" },
19342
+ allowUnselect: true,
19343
+ size: "compact",
19344
+ chainIds: enabledChainIds,
19345
+ assets: [],
19346
+ selectedChainId: value,
19347
+ onChainSelected: onFilterChange
19348
+ }
19349
+ )
19350
+ );
19351
+ };
19133
19352
  function SelectWalletAsset({
19134
19353
  paymentMethodInfo,
19135
19354
  targetChainId,
@@ -19137,20 +19356,20 @@ function SelectWalletAsset({
19137
19356
  onSelectSource
19138
19357
  }) {
19139
19358
  const label = usePaymentMethodInfoLabel(paymentMethodInfo, 16);
19140
- const { textCustomizations } = useFunkitConfig();
19359
+ const { apiKey, textCustomizations } = useFunkitConfig();
19141
19360
  const { walletAddress } = useGeneralWallet();
19142
19361
  const otherSourcesCount = useRemainingPaymentSourcesCount(targetChainId);
19143
19362
  const { data, isLoading, totalBalance } = useWalletAssetHoldings(targetChainId);
19144
- return /* @__PURE__ */ React193.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, /* @__PURE__ */ React193.createElement(
19363
+ return /* @__PURE__ */ React195.createElement(React195.Fragment, null, /* @__PURE__ */ React195.createElement(
19145
19364
  SourcePaymentMethodItem,
19146
19365
  {
19147
19366
  otherSourcesCount,
19148
19367
  keyText: getWalletLabel(textCustomizations, walletAddress),
19149
- disclaimerText: formatCurrencyAndStringify10(totalBalance),
19368
+ disclaimerText: isVertexCustomer(apiKey) ? void 0 : formatCurrencyAndStringify10(totalBalance),
19150
19369
  keyIcon: label.icon,
19151
19370
  onClick: onSelectSource
19152
19371
  }
19153
- ), isLoading ? /* @__PURE__ */ React193.createElement(FunAssetLoading, { count: 5 }) : /* @__PURE__ */ React193.createElement(
19372
+ ), isLoading ? /* @__PURE__ */ React195.createElement(FunAssetLoading, { count: isVertexCustomer(apiKey) ? 7 : 5 }) : /* @__PURE__ */ React195.createElement(
19154
19373
  MeshOrAccountSelectAsset,
19155
19374
  {
19156
19375
  paymentMethodInfo,
@@ -19173,9 +19392,9 @@ function SelectMeshAsset({
19173
19392
  targetChainId,
19174
19393
  paymentMethodInfo.meta
19175
19394
  );
19176
- const accountHoldings = data ?? {};
19177
19395
  const { unlinkBrokerage } = useFunkitMesh();
19178
- const fetchHoldingsError = isError ? /* @__PURE__ */ React193.createElement("div", null, "Unable to retrieve your account balance. Please retry.", " ", /* @__PURE__ */ React193.createElement(
19396
+ const { apiKey } = useFunkitConfig();
19397
+ const fetchHoldingsError = isError ? /* @__PURE__ */ React195.createElement("div", null, "Unable to retrieve your account balance. Please retry.", " ", /* @__PURE__ */ React195.createElement(
19179
19398
  FunLinkButton,
19180
19399
  {
19181
19400
  text: "Unlink.",
@@ -19188,17 +19407,18 @@ function SelectMeshAsset({
19188
19407
  }
19189
19408
  }
19190
19409
  )) : null;
19410
+ const accountHoldings = data ?? {};
19191
19411
  const totalBalance = getTotalAssetBalance(accountHoldings);
19192
- return /* @__PURE__ */ React193.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, /* @__PURE__ */ React193.createElement(
19412
+ return /* @__PURE__ */ React195.createElement(React195.Fragment, null, /* @__PURE__ */ React195.createElement(
19193
19413
  SourcePaymentMethodItem,
19194
19414
  {
19195
19415
  otherSourcesCount,
19196
19416
  keyText: label.text,
19197
- disclaimerText: formatCurrencyAndStringify10(totalBalance),
19417
+ disclaimerText: isVertexCustomer(apiKey) ? void 0 : formatCurrencyAndStringify10(totalBalance),
19198
19418
  keyIcon: label.icon,
19199
19419
  onClick: onSelectSource
19200
19420
  }
19201
- ), isLoading ? /* @__PURE__ */ React193.createElement(FunAssetLoading, { count: 5 }) : /* @__PURE__ */ React193.createElement(
19421
+ ), isLoading ? /* @__PURE__ */ React195.createElement(FunAssetLoading, { count: isVertexCustomer(apiKey) ? 7 : 5 }) : /* @__PURE__ */ React195.createElement(
19202
19422
  MeshOrAccountSelectAsset,
19203
19423
  {
19204
19424
  paymentMethodInfo,
@@ -19223,7 +19443,7 @@ function SelectAsset({
19223
19443
  const handleBrokerageDisconnected = () => {
19224
19444
  onNext({ disconnectedBrokerage: true });
19225
19445
  };
19226
- return paymentMethodInfo.paymentMethod === "brokerage" /* BROKERAGE */ ? /* @__PURE__ */ React193.createElement(
19446
+ return /* @__PURE__ */ React195.createElement(Box, { display: "flex", flexDirection: "column", gap: "12", style: { flex: 1 } }, paymentMethodInfo.paymentMethod === "brokerage" /* BROKERAGE */ ? /* @__PURE__ */ React195.createElement(
19227
19447
  SelectMeshAsset,
19228
19448
  {
19229
19449
  paymentMethodInfo,
@@ -19232,7 +19452,7 @@ function SelectAsset({
19232
19452
  onSelectSource: handleSelectSource,
19233
19453
  onBrokerageDisconnected: handleBrokerageDisconnected
19234
19454
  }
19235
- ) : /* @__PURE__ */ React193.createElement(
19455
+ ) : /* @__PURE__ */ React195.createElement(
19236
19456
  SelectWalletAsset,
19237
19457
  {
19238
19458
  paymentMethodInfo,
@@ -19240,15 +19460,15 @@ function SelectAsset({
19240
19460
  onFinish: handleFinish,
19241
19461
  onSelectSource: handleSelectSource
19242
19462
  }
19243
- );
19463
+ ));
19244
19464
  }
19245
19465
 
19246
19466
  // src/modals/CheckoutModal/SelectBrokerage.tsx
19247
- import React195, { useState as useState56 } from "react";
19467
+ import React197, { useState as useState56 } from "react";
19248
19468
 
19249
19469
  // src/components/FunSelectBrokerage/FunSelectBrokerage.tsx
19250
19470
  import clsx19 from "clsx";
19251
- import React194 from "react";
19471
+ import React196 from "react";
19252
19472
 
19253
19473
  // src/components/FunSelectBrokerage/FunSelectBrokerage.css.ts
19254
19474
  var selectBrokerageStyle = "_1whuldv0";
@@ -19259,7 +19479,7 @@ function FunSelectBrokerage({
19259
19479
  options,
19260
19480
  selectedValue
19261
19481
  }) {
19262
- return /* @__PURE__ */ React194.createElement(
19482
+ return /* @__PURE__ */ React196.createElement(
19263
19483
  Box,
19264
19484
  {
19265
19485
  className: clsx19(hideScrollBar, selectBrokerageStyle),
@@ -19269,7 +19489,7 @@ function FunSelectBrokerage({
19269
19489
  },
19270
19490
  options.map((optionItem) => {
19271
19491
  const isActive = selectedValue === optionItem.value;
19272
- return /* @__PURE__ */ React194.createElement(
19492
+ return /* @__PURE__ */ React196.createElement(
19273
19493
  FunOptionBox,
19274
19494
  {
19275
19495
  key: optionItem.value,
@@ -19344,7 +19564,7 @@ function SelectBrokerage({
19344
19564
  });
19345
19565
  }
19346
19566
  };
19347
- return /* @__PURE__ */ React195.createElement(Box, { display: "flex", flexDirection: "column", gap: VERTICAL_SECTION_GAP }, /* @__PURE__ */ React195.createElement(
19567
+ return /* @__PURE__ */ React197.createElement(Box, { display: "flex", flexDirection: "column", gap: VERTICAL_SECTION_GAP }, /* @__PURE__ */ React197.createElement(
19348
19568
  FunInput,
19349
19569
  {
19350
19570
  placeholder: "Search exchanges",
@@ -19352,7 +19572,7 @@ function SelectBrokerage({
19352
19572
  onChange: handleSearch,
19353
19573
  prefixIcon: "SearchIcon"
19354
19574
  }
19355
- ), /* @__PURE__ */ React195.createElement(Box, { display: "flex", justifyContent: "center", style: { minHeight: 200 } }, filteredOptions.length === 0 ? /* @__PURE__ */ React195.createElement(FunNoResults, null, "No results found") : /* @__PURE__ */ React195.createElement(
19575
+ ), /* @__PURE__ */ React197.createElement(Box, { display: "flex", justifyContent: "center", style: { minHeight: 200 } }, filteredOptions.length === 0 ? /* @__PURE__ */ React197.createElement(FunNoResults, null, "No results found") : /* @__PURE__ */ React197.createElement(
19356
19576
  FunSelectBrokerage,
19357
19577
  {
19358
19578
  onSelect: handleSelect,
@@ -19363,7 +19583,7 @@ function SelectBrokerage({
19363
19583
  }
19364
19584
 
19365
19585
  // src/modals/CheckoutModal/SourceChange/SourceChange.tsx
19366
- import React197, { useEffect as useEffect43, useState as useState58 } from "react";
19586
+ import React199, { useEffect as useEffect42, useState as useState58 } from "react";
19367
19587
  import { POLYMARKET_API_KEY as POLYMARKET_API_KEY4 } from "@funkit/api-base";
19368
19588
 
19369
19589
  // src/components/FunPayments/FunPaymentMethods.tsx
@@ -19371,7 +19591,7 @@ import {
19371
19591
  formatCurrencyAndStringify as formatCurrencyAndStringify11,
19372
19592
  formatSecondsToReadableForm as formatSecondsToReadableForm3
19373
19593
  } from "@funkit/utils";
19374
- import React196, { Fragment as Fragment4, useEffect as useEffect42 } from "react";
19594
+ import React198, { Fragment as Fragment4, useEffect as useEffect41 } from "react";
19375
19595
 
19376
19596
  // src/hooks/useEnabledTokenTransferChainTokens.ts
19377
19597
  import { FlagKey as FlagKey20 } from "@funkit/utils";
@@ -19396,7 +19616,7 @@ function useEnabledTokenTransferChainTokens() {
19396
19616
  // src/config/getDefaultConfig.ts
19397
19617
  import {
19398
19618
  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO10,
19399
- FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST
19619
+ FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST as FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST2
19400
19620
  } from "@funkit/chains";
19401
19621
  import { fallback } from "viem";
19402
19622
  import {
@@ -20072,21 +20292,21 @@ var getDefaultConfig = ({
20072
20292
  ...restWagmiParameters
20073
20293
  });
20074
20294
  };
20075
- var getDefaultChains = () => FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST;
20295
+ var getDefaultChains = () => FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST2;
20076
20296
  var getDefaultTransports = () => {
20077
20297
  const chains = getDefaultChains();
20078
20298
  return createDefaultTransports(chains);
20079
20299
  };
20080
20300
 
20081
20301
  // src/hooks/useUsableWalletAssetsForCheckout.ts
20082
- import { useMemo as useMemo36 } from "react";
20302
+ import { useMemo as useMemo37 } from "react";
20083
20303
  function useUsableWalletAssetsForCheckout() {
20084
20304
  const { checkoutItem } = useCheckoutContext();
20085
20305
  const { flags } = useFlags();
20086
20306
  const { loginType } = useGeneralWallet();
20087
20307
  const { walletAssets } = useWalletAssets({ enableRefetchInterval: false });
20088
20308
  const { isAllowed } = useAllowedAssets();
20089
- return useMemo36(() => {
20309
+ return useMemo37(() => {
20090
20310
  if (!walletAssets || !checkoutItem) return;
20091
20311
  const usableAssets = {};
20092
20312
  for (const [assetKey, asset] of Object.entries(walletAssets)) {
@@ -20114,37 +20334,37 @@ var BrokerageConditionalIcons = () => {
20114
20334
  const { getActiveConnection } = useFunkitMesh();
20115
20335
  return supportedExchanges.filter((brokerType) => !getActiveConnection(brokerType)).map((brokerType) => {
20116
20336
  const icon = getExchangeIcon(brokerType, 12);
20117
- return icon ? /* @__PURE__ */ React196.createElement(Fragment4, { key: brokerType }, icon) : null;
20337
+ return icon ? /* @__PURE__ */ React198.createElement(Fragment4, { key: brokerType }, icon) : null;
20118
20338
  }).filter((icon) => icon !== null).slice(0, 5);
20119
20339
  };
20340
+ var getDynamicValueIconComponent = () => {
20341
+ const defaultChains = getDefaultChains();
20342
+ return /* @__PURE__ */ React198.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "flex-end" }, defaultChains.map(({ id: chainId }, index) => {
20343
+ const metadata = chainMetadataById[chainId];
20344
+ return /* @__PURE__ */ React198.createElement(
20345
+ Box,
20346
+ {
20347
+ key: chainId,
20348
+ position: "relative",
20349
+ style: { right: `${(defaultChains.length - index - 1) * -2}px` }
20350
+ },
20351
+ /* @__PURE__ */ React198.createElement(
20352
+ AsyncImage,
20353
+ {
20354
+ alt: metadata.name,
20355
+ borderRadius: "full",
20356
+ src: metadata.iconUrl,
20357
+ height: 12,
20358
+ width: 12
20359
+ }
20360
+ )
20361
+ );
20362
+ }));
20363
+ };
20120
20364
  function ConnectWalletItem({ isClickable = true }) {
20121
20365
  const { openConnectModal } = useConnectModal();
20122
20366
  const { checkoutItem } = useCheckoutContext();
20123
20367
  const { textCustomizations } = useFunkitConfig();
20124
- const getDynamicValueIconComponent = () => {
20125
- const defaultChains = getDefaultChains();
20126
- return /* @__PURE__ */ React196.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "flex-end" }, defaultChains.map(({ id: chainId }, index) => {
20127
- const metadata = chainMetadataById[chainId];
20128
- return /* @__PURE__ */ React196.createElement(
20129
- Box,
20130
- {
20131
- key: chainId,
20132
- position: "relative",
20133
- style: { right: `${(defaultChains.length - index - 1) * -2}px` }
20134
- },
20135
- /* @__PURE__ */ React196.createElement(
20136
- AsyncImage,
20137
- {
20138
- alt: metadata.name,
20139
- borderRadius: "full",
20140
- src: metadata.iconUrl,
20141
- height: 12,
20142
- width: 12
20143
- }
20144
- )
20145
- );
20146
- }));
20147
- };
20148
20368
  const handleWalletConnection = () => {
20149
20369
  if (checkoutItem?.initSettings.onLoginRequired) {
20150
20370
  checkoutItem.initSettings.onLoginRequired();
@@ -20153,10 +20373,10 @@ function ConnectWalletItem({ isClickable = true }) {
20153
20373
  }
20154
20374
  };
20155
20375
  const walletLabel = getWalletLabel(textCustomizations);
20156
- return /* @__PURE__ */ React196.createElement(
20376
+ return /* @__PURE__ */ React198.createElement(
20157
20377
  FunPaymentMethodItem,
20158
20378
  {
20159
- keyIcon: /* @__PURE__ */ React196.createElement(
20379
+ keyIcon: /* @__PURE__ */ React198.createElement(
20160
20380
  Box,
20161
20381
  {
20162
20382
  height: "20",
@@ -20165,7 +20385,7 @@ function ConnectWalletItem({ isClickable = true }) {
20165
20385
  alignItems: "center",
20166
20386
  justifyContent: "center"
20167
20387
  },
20168
- /* @__PURE__ */ React196.createElement(EvmWallet, null)
20388
+ /* @__PURE__ */ React198.createElement(EvmWallet, null)
20169
20389
  ),
20170
20390
  keyText: walletLabel,
20171
20391
  valueIcon: getDynamicValueIconComponent(),
@@ -20176,16 +20396,16 @@ function ConnectWalletItem({ isClickable = true }) {
20176
20396
  );
20177
20397
  }
20178
20398
  function SupportedChainList({ chainIdList }) {
20179
- return /* @__PURE__ */ React196.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "flex-end" }, chainIdList.map((chainId, index) => {
20399
+ return /* @__PURE__ */ React198.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "flex-end" }, chainIdList.map((chainId, index) => {
20180
20400
  const metadata = chainMetadataById[chainId];
20181
- return /* @__PURE__ */ React196.createElement(
20401
+ return /* @__PURE__ */ React198.createElement(
20182
20402
  Box,
20183
20403
  {
20184
20404
  key: chainId,
20185
20405
  position: "relative",
20186
20406
  style: { right: `${(chainIdList.length - index - 1) * -2}px` }
20187
20407
  },
20188
- /* @__PURE__ */ React196.createElement(
20408
+ /* @__PURE__ */ React198.createElement(
20189
20409
  AsyncImage,
20190
20410
  {
20191
20411
  alt: metadata.name,
@@ -20202,7 +20422,7 @@ function PaymentMethodIcon({
20202
20422
  paymentIcon,
20203
20423
  keyIconSize
20204
20424
  }) {
20205
- return /* @__PURE__ */ React196.createElement(
20425
+ return /* @__PURE__ */ React198.createElement(
20206
20426
  Box,
20207
20427
  {
20208
20428
  display: "flex",
@@ -20235,7 +20455,7 @@ var ConnectedMeshPaymentMethodItem = ({
20235
20455
  const timeEstimate = useCheckoutTimeEstimate(3 * 60, "brokerage" /* BROKERAGE */);
20236
20456
  const disclaimerText = isPending ? "Fetching balance..." : balanceError ? "Couldn't fetch balance" : `${formatCurrencyAndStringify11(sourceBalance)} \u2022 ${formatSecondsToReadableForm3(timeEstimate, true)}`;
20237
20457
  const isDisabled = !!balanceError || sourceBalance < MIN_CHECKOUT_AMOUNT_USD;
20238
- useEffect42(() => {
20458
+ useEffect41(() => {
20239
20459
  if (isPending || isLoading || isFetching) {
20240
20460
  return;
20241
20461
  }
@@ -20249,7 +20469,7 @@ var ConnectedMeshPaymentMethodItem = ({
20249
20469
  isFetching,
20250
20470
  paymentMethodInfo.meta.brokerType
20251
20471
  ]);
20252
- return /* @__PURE__ */ React196.createElement(
20472
+ return /* @__PURE__ */ React198.createElement(
20253
20473
  FunPaymentMethodItem,
20254
20474
  {
20255
20475
  isDisabled,
@@ -20257,7 +20477,7 @@ var ConnectedMeshPaymentMethodItem = ({
20257
20477
  isActive: isSelected,
20258
20478
  keyIcon: label.icon,
20259
20479
  keyText: label.text,
20260
- valueIcon: isSelected ? /* @__PURE__ */ React196.createElement(CheckIcon, null) : null,
20480
+ valueIcon: isSelected ? /* @__PURE__ */ React198.createElement(CheckIcon, null) : null,
20261
20481
  onClick: onSelect,
20262
20482
  disclaimerText
20263
20483
  }
@@ -20279,17 +20499,17 @@ var AccountBalancePaymentMethodItem = ({
20279
20499
  const uniqueChainIds = Array.from(
20280
20500
  new Set(Object.values(usableWalletAssets).map((asset) => asset.chainId))
20281
20501
  );
20282
- return /* @__PURE__ */ React196.createElement(SupportedChainList, { chainIdList: uniqueChainIds });
20502
+ return /* @__PURE__ */ React198.createElement(SupportedChainList, { chainIdList: uniqueChainIds });
20283
20503
  };
20284
20504
  const dynamicLimit = formatCurrencyAndStringify11(totalBalance);
20285
20505
  const disclaimerText = `${dynamicLimit ?? "No limit"} \u2022 Instant`;
20286
20506
  const walletLabel = getWalletLabel(textCustomizations, walletAddress);
20287
20507
  const keyIconSize = "20";
20288
- return /* @__PURE__ */ React196.createElement(
20508
+ return /* @__PURE__ */ React198.createElement(
20289
20509
  FunPaymentMethodItem,
20290
20510
  {
20291
20511
  isActive,
20292
- keyIcon: isLoadingAssets ? /* @__PURE__ */ React196.createElement(SpinnerIcon, { size: keyIconSize }) : /* @__PURE__ */ React196.createElement(
20512
+ keyIcon: isLoadingAssets ? /* @__PURE__ */ React198.createElement(SpinnerIcon, { size: keyIconSize }) : /* @__PURE__ */ React198.createElement(
20293
20513
  PaymentMethodIcon,
20294
20514
  {
20295
20515
  keyIconSize,
@@ -20314,11 +20534,11 @@ var CardPaymentMethodItem = ({
20314
20534
  textCustomizations
20315
20535
  }) => {
20316
20536
  const timeEstimate = useCheckoutTimeEstimate(2 * 60, "card" /* CARD */);
20317
- return /* @__PURE__ */ React196.createElement(
20537
+ return /* @__PURE__ */ React198.createElement(
20318
20538
  FunPaymentMethodItem,
20319
20539
  {
20320
20540
  isActive,
20321
- keyIcon: /* @__PURE__ */ React196.createElement(
20541
+ keyIcon: /* @__PURE__ */ React198.createElement(
20322
20542
  PaymentMethodIcon,
20323
20543
  {
20324
20544
  keyIconSize,
@@ -20326,7 +20546,7 @@ var CardPaymentMethodItem = ({
20326
20546
  }
20327
20547
  ),
20328
20548
  keyText: textCustomizations.debitOrCredit,
20329
- valueIcon: customValueIcon !== void 0 ? customValueIcon : /* @__PURE__ */ React196.createElement(CombinedCreditCardOptionsIcon, null),
20549
+ valueIcon: customValueIcon !== void 0 ? customValueIcon : /* @__PURE__ */ React198.createElement(CombinedCreditCardOptionsIcon, null),
20330
20550
  onClick,
20331
20551
  isDisabled: !isClickable,
20332
20552
  disclaimerText: `$10,000 limit \u2022 ${formatSecondsToReadableForm3(timeEstimate, true)}`
@@ -20345,13 +20565,13 @@ var TransferPaymentMethodItem = ({
20345
20565
  const enabledChainTokens = useEnabledTokenTransferChainTokens();
20346
20566
  const getTokenTransferIcon = () => {
20347
20567
  const uniqueChainIds = Array.from(new Set(Object.keys(enabledChainTokens)));
20348
- return /* @__PURE__ */ React196.createElement(SupportedChainList, { chainIdList: uniqueChainIds });
20568
+ return /* @__PURE__ */ React198.createElement(SupportedChainList, { chainIdList: uniqueChainIds });
20349
20569
  };
20350
- return /* @__PURE__ */ React196.createElement(
20570
+ return /* @__PURE__ */ React198.createElement(
20351
20571
  FunPaymentMethodItem,
20352
20572
  {
20353
20573
  isActive,
20354
- keyIcon: /* @__PURE__ */ React196.createElement(
20574
+ keyIcon: /* @__PURE__ */ React198.createElement(
20355
20575
  PaymentMethodIcon,
20356
20576
  {
20357
20577
  keyIconSize,
@@ -20376,11 +20596,11 @@ var BrokeragePaymentMethodItem = ({
20376
20596
  textCustomizations
20377
20597
  }) => {
20378
20598
  const timeEstimate = useCheckoutTimeEstimate(3 * 60, "brokerage" /* BROKERAGE */);
20379
- return /* @__PURE__ */ React196.createElement(
20599
+ return /* @__PURE__ */ React198.createElement(
20380
20600
  FunPaymentMethodItem,
20381
20601
  {
20382
20602
  isActive,
20383
- keyIcon: /* @__PURE__ */ React196.createElement(
20603
+ keyIcon: /* @__PURE__ */ React198.createElement(
20384
20604
  PaymentMethodIcon,
20385
20605
  {
20386
20606
  keyIconSize,
@@ -20388,7 +20608,7 @@ var BrokeragePaymentMethodItem = ({
20388
20608
  }
20389
20609
  ),
20390
20610
  keyText: textCustomizations.brokerageOrExchange,
20391
- valueIcon: customValueIcon ?? /* @__PURE__ */ React196.createElement(Box, { display: "flex", gap: "2", alignItems: "center" }, /* @__PURE__ */ React196.createElement(BrokerageConditionalIcons, null)),
20611
+ valueIcon: customValueIcon ?? /* @__PURE__ */ React198.createElement(Box, { display: "flex", gap: "2", alignItems: "center" }, /* @__PURE__ */ React198.createElement(BrokerageConditionalIcons, null)),
20392
20612
  onClick,
20393
20613
  isDisabled: !isClickable,
20394
20614
  disclaimerText: `No limit \u2022 ${formatSecondsToReadableForm3(timeEstimate, true)}`
@@ -20414,16 +20634,16 @@ function AddPaymentMethodItem({
20414
20634
  keyIconSize: "20"
20415
20635
  };
20416
20636
  if (paymentMethod === "balance" /* ACCOUNT_BALANCE */) {
20417
- return /* @__PURE__ */ React196.createElement(ConnectWalletItem, { isClickable });
20637
+ return /* @__PURE__ */ React198.createElement(ConnectWalletItem, { isClickable });
20418
20638
  }
20419
20639
  if (paymentMethod === "card" /* CARD */) {
20420
- return /* @__PURE__ */ React196.createElement(CardPaymentMethodItem, { ...commonProps });
20640
+ return /* @__PURE__ */ React198.createElement(CardPaymentMethodItem, { ...commonProps });
20421
20641
  }
20422
20642
  if (paymentMethod === "token_transfer" /* TOKEN_TRANSFER */) {
20423
- return /* @__PURE__ */ React196.createElement(TransferPaymentMethodItem, { ...commonProps });
20643
+ return /* @__PURE__ */ React198.createElement(TransferPaymentMethodItem, { ...commonProps });
20424
20644
  }
20425
20645
  if (paymentMethod === "brokerage" /* BROKERAGE */) {
20426
- return /* @__PURE__ */ React196.createElement(BrokeragePaymentMethodItem, { ...commonProps });
20646
+ return /* @__PURE__ */ React198.createElement(BrokeragePaymentMethodItem, { ...commonProps });
20427
20647
  }
20428
20648
  }
20429
20649
 
@@ -20558,18 +20778,18 @@ var ConnectedSource = ({
20558
20778
  }) => {
20559
20779
  if (paymentInfo.paymentMethod === "balance" /* ACCOUNT_BALANCE */) {
20560
20780
  const isSelected2 = selectedPaymentInfo?.paymentMethod === "balance" /* ACCOUNT_BALANCE */;
20561
- return /* @__PURE__ */ React197.createElement(
20781
+ return /* @__PURE__ */ React199.createElement(
20562
20782
  AccountBalancePaymentMethodItem,
20563
20783
  {
20564
20784
  isActive: isSelected2,
20565
20785
  onClick: onSelect,
20566
- customValueIcon: isSelected2 ? /* @__PURE__ */ React197.createElement(CheckIcon, null) : null,
20786
+ customValueIcon: isSelected2 ? /* @__PURE__ */ React199.createElement(CheckIcon, null) : null,
20567
20787
  targetChainId
20568
20788
  }
20569
20789
  );
20570
20790
  }
20571
20791
  const isSelected = selectedPaymentInfo?.paymentMethod === "brokerage" /* BROKERAGE */ && selectedPaymentInfo.meta.brokerType === paymentInfo.meta.brokerType;
20572
- return /* @__PURE__ */ React197.createElement(
20792
+ return /* @__PURE__ */ React199.createElement(
20573
20793
  ConnectedMeshPaymentMethodItem,
20574
20794
  {
20575
20795
  paymentMethodInfo: paymentInfo,
@@ -20589,7 +20809,7 @@ function SourceChange({
20589
20809
  const { updateSelectedPaymentMethodInfo, checkoutItem } = useCheckoutContext();
20590
20810
  const [connectedSource, setConnectedSource] = useState58(paymentMethodInfo);
20591
20811
  const [newSource, setNewSource] = useState58();
20592
- useEffect43(() => {
20812
+ useEffect42(() => {
20593
20813
  if (!paymentMethodInfo) return;
20594
20814
  updateSelectedPaymentMethodInfo(paymentMethodInfo);
20595
20815
  }, [paymentMethodInfo, updateSelectedPaymentMethodInfo]);
@@ -20659,7 +20879,7 @@ function SourceChange({
20659
20879
  );
20660
20880
  function renderSource(source) {
20661
20881
  if (typeof source === "object") {
20662
- return /* @__PURE__ */ React197.createElement(
20882
+ return /* @__PURE__ */ React199.createElement(
20663
20883
  ConnectedSource,
20664
20884
  {
20665
20885
  key: source.title,
@@ -20671,7 +20891,7 @@ function SourceChange({
20671
20891
  }
20672
20892
  );
20673
20893
  }
20674
- return /* @__PURE__ */ React197.createElement(
20894
+ return /* @__PURE__ */ React199.createElement(
20675
20895
  AddPaymentMethodItem,
20676
20896
  {
20677
20897
  key: source,
@@ -20681,16 +20901,16 @@ function SourceChange({
20681
20901
  }
20682
20902
  );
20683
20903
  }
20684
- return /* @__PURE__ */ React197.createElement(Box, { display: "flex", flexDirection: "column", gap: "4" }, preferred.map(renderSource), preferred.length > 0 && /* @__PURE__ */ React197.createElement(FunDivider, { label: "more", marginTop: "8", marginBottom: "8" }), moreSources.map(renderSource));
20904
+ return /* @__PURE__ */ React199.createElement(Box, { display: "flex", flexDirection: "column", gap: "4" }, preferred.map(renderSource), preferred.length > 0 && /* @__PURE__ */ React199.createElement(FunDivider, { label: "more", marginTop: "8", marginBottom: "8" }), moreSources.map(renderSource));
20685
20905
  }
20686
20906
 
20687
20907
  // src/modals/CheckoutModal/TransferToken.tsx
20688
20908
  import { FlagKey as FlagKey21, formatCurrencyAndStringify as formatCurrencyAndStringify12 } from "@funkit/utils";
20689
- import React201, { useRef as useRef19, useState as useState60 } from "react";
20909
+ import React203, { useRef as useRef19, useState as useState60 } from "react";
20690
20910
  import { mainnet as mainnet8, polygon as polygon5 } from "viem/chains";
20691
20911
 
20692
20912
  // src/components/CopyAddress/CopyInputDisplayedAddress.tsx
20693
- import React198 from "react";
20913
+ import React200 from "react";
20694
20914
  import { truncateMiddleOfAddress as truncateMiddleOfAddressFn } from "@funkit/utils";
20695
20915
  function CopyInputDisplayedAddress({
20696
20916
  address,
@@ -20698,7 +20918,7 @@ function CopyInputDisplayedAddress({
20698
20918
  }) {
20699
20919
  const { copied: copiedAddress, copy: copyAddressAction } = useCopyToClipboard(address);
20700
20920
  const truncatedAddress = truncateMiddleOfAddress ? truncateMiddleOfAddressFn(address, 40, 24, 8) : address;
20701
- return /* @__PURE__ */ React198.createElement(
20921
+ return /* @__PURE__ */ React200.createElement(
20702
20922
  Box,
20703
20923
  {
20704
20924
  display: "flex",
@@ -20718,8 +20938,8 @@ function CopyInputDisplayedAddress({
20718
20938
  borderRadius: BORDER_RADIUS,
20719
20939
  borderStyle: "solid"
20720
20940
  },
20721
- /* @__PURE__ */ React198.createElement(Text, { size: "10", color: "primaryText" }, truncatedAddress),
20722
- /* @__PURE__ */ React198.createElement(
20941
+ /* @__PURE__ */ React200.createElement(Text, { size: "10", color: "primaryText" }, truncatedAddress),
20942
+ /* @__PURE__ */ React200.createElement(
20723
20943
  CopyIconButton,
20724
20944
  {
20725
20945
  isAddressCopied: copiedAddress,
@@ -20730,7 +20950,7 @@ function CopyInputDisplayedAddress({
20730
20950
  }
20731
20951
 
20732
20952
  // src/components/Dropdown/TokenDropdown.tsx
20733
- import React199, { useState as useState59 } from "react";
20953
+ import React201, { useState as useState59 } from "react";
20734
20954
  var TOKEN_ICON_SIZE2 = 16;
20735
20955
  var getTokenIconUrl2 = (symbol) => {
20736
20956
  return ASSET_LOGO_SRCS[symbol.toUpperCase()];
@@ -20763,12 +20983,12 @@ var TokenDropdown = ({
20763
20983
  handleChangeSymbol(enabledTokens[0]);
20764
20984
  }
20765
20985
  }, [selectedSymbol, enabledTokens]);
20766
- return /* @__PURE__ */ React199.createElement(
20986
+ return /* @__PURE__ */ React201.createElement(
20767
20987
  BaseDropdown_default,
20768
20988
  {
20769
20989
  openToTopOnMobile: false,
20770
20990
  activeItemProps: {
20771
- iconComponent: /* @__PURE__ */ React199.createElement(
20991
+ iconComponent: /* @__PURE__ */ React201.createElement(
20772
20992
  AsyncImage,
20773
20993
  {
20774
20994
  alt: selectedSymbol,
@@ -20788,10 +21008,10 @@ var TokenDropdown = ({
20788
21008
  renderDropdownOption: (option, isSelected) => {
20789
21009
  const symbol = option.value;
20790
21010
  const iconUrl = getTokenIconUrl2(symbol);
20791
- return /* @__PURE__ */ React199.createElement(
21011
+ return /* @__PURE__ */ React201.createElement(
20792
21012
  BaseDropdownItem_default,
20793
21013
  {
20794
- iconComponent: /* @__PURE__ */ React199.createElement(
21014
+ iconComponent: /* @__PURE__ */ React201.createElement(
20795
21015
  AsyncImage,
20796
21016
  {
20797
21017
  alt: option.label,
@@ -20815,81 +21035,46 @@ var TokenDropdown = ({
20815
21035
  };
20816
21036
  var TokenDropdown_default = TokenDropdown;
20817
21037
 
20818
- // src/components/Dropdown/ChainDropdown.tsx
20819
- import React200 from "react";
20820
- var CHAIN_ICON_SIZE = 16;
20821
- var ChainDropdown = ({
20822
- assets,
20823
- selectedChainId,
20824
- selectedToken,
20825
- onChainSelected
21038
+ // src/components/QRCode/QRCodeSkeletonLoader.tsx
21039
+ import React202 from "react";
21040
+ var QRCodeSkeletonLoader = ({
21041
+ diagonalDimension = 12
20826
21042
  }) => {
20827
- const chainIds = Object.keys(assets).map(Number);
20828
- const enabledChainIds = chainIds.filter(
20829
- (chainId) => assets[chainId].includes(selectedToken)
20830
- );
20831
- const selectedChain = chainMetadataById[selectedChainId];
20832
- return /* @__PURE__ */ React200.createElement(
20833
- BaseDropdown_default,
21043
+ const gapBetweenDots = "4";
21044
+ const size = diagonalDimension * 8 + (diagonalDimension - 1) * Number(gapBetweenDots);
21045
+ return /* @__PURE__ */ React202.createElement(
21046
+ Box,
20834
21047
  {
20835
- openToTopOnMobile: false,
20836
- activeItemProps: {
20837
- iconComponent: /* @__PURE__ */ React200.createElement(
20838
- AsyncImage,
20839
- {
20840
- alt: selectedChain.name,
20841
- background: selectedChain.iconBackground,
20842
- borderRadius: "full",
20843
- height: CHAIN_ICON_SIZE,
20844
- width: CHAIN_ICON_SIZE,
20845
- src: selectedChain.iconUrl
20846
- }
20847
- )
20848
- },
20849
- value: selectedChainId.toString(),
20850
- options: chainIds.map((chainId) => ({
20851
- value: chainId.toString(),
20852
- label: chainMetadataById[chainId].name ?? ""
20853
- })),
20854
- renderDropdownOption: (option, isSelected) => {
20855
- const metadata = chainMetadataById[option.value];
20856
- return /* @__PURE__ */ React200.createElement(
20857
- BaseDropdownItem_default,
20858
- {
20859
- iconComponent: /* @__PURE__ */ React200.createElement(
20860
- AsyncImage,
20861
- {
20862
- alt: metadata.name,
20863
- background: metadata.iconBackground,
20864
- borderRadius: "full",
20865
- height: CHAIN_ICON_SIZE,
20866
- width: CHAIN_ICON_SIZE,
20867
- src: metadata.iconUrl
20868
- }
20869
- ),
20870
- id: option.value,
20871
- onClick: (chainId) => {
20872
- onChainSelected(Number.parseInt(chainId));
20873
- },
20874
- label: metadata.name ?? "",
20875
- isSelected,
20876
- isDisabled: !enabledChainIds.includes(Number(option.value))
20877
- }
20878
- );
21048
+ display: "flex",
21049
+ flexDirection: "column",
21050
+ alignItems: "center",
21051
+ justifyContent: "center",
21052
+ gap: "4",
21053
+ style: { width: `${size}px`, height: `${size}px` }
21054
+ },
21055
+ Array.from({ length: diagonalDimension }, (_, index) => /* @__PURE__ */ React202.createElement(
21056
+ Box,
21057
+ {
21058
+ display: "flex",
21059
+ alignItems: "center",
21060
+ justifyContent: "center",
21061
+ gap: gapBetweenDots,
21062
+ key: index
20879
21063
  },
20880
- preloadIconUrls: chainIds.map(
20881
- (chainId) => chainMetadataById[chainId].iconUrl
20882
- )
20883
- }
21064
+ Array.from({ length: diagonalDimension }, (_2, index2) => (
21065
+ // biome-ignore lint/suspicious/noArrayIndexKey: no better key
21066
+ /* @__PURE__ */ React202.createElement(FunSkeletonCircle, { size: "8", key: index2 })
21067
+ ))
21068
+ ))
20884
21069
  );
20885
21070
  };
20886
- var ChainDropdown_default = ChainDropdown;
21071
+ var QRCodeSkeletonLoader_default = QRCodeSkeletonLoader;
20887
21072
 
20888
21073
  // src/hooks/useCheckoutTransferDepositAddress.ts
20889
21074
  import {
20890
21075
  initializeCheckoutTokenTransferAddress
20891
21076
  } from "@funkit/api-base";
20892
- import { useQuery as useQuery10 } from "@tanstack/react-query";
21077
+ import { useQuery as useQuery9 } from "@tanstack/react-query";
20893
21078
  var useCheckoutTransferDepositAddress = (checkoutItem, userId, recipientAddr) => {
20894
21079
  const { apiKey } = useFunkitConfig();
20895
21080
  const queryKey = {
@@ -20901,7 +21086,7 @@ var useCheckoutTransferDepositAddress = (checkoutItem, userId, recipientAddr) =>
20901
21086
  logger,
20902
21087
  clientMetadata: generateClientMetadataForTokenTransfer()
20903
21088
  };
20904
- const { data, isFetching } = useQuery10({
21089
+ const { data, isFetching } = useQuery9({
20905
21090
  queryKey: ["initializeCheckoutTokenTransferAddress", queryKey],
20906
21091
  queryFn: ({ queryKey: [_, params] }) => initializeCheckoutTokenTransferAddress(params),
20907
21092
  refetchOnWindowFocus: false
@@ -20985,7 +21170,7 @@ function TransferToken({
20985
21170
  selectedChainId.toString()
20986
21171
  );
20987
21172
  const isLoadingDepositAddress = depositAddress === void 0;
20988
- return /* @__PURE__ */ React201.createElement(Box, { id: "token-transfer-page" }, /* @__PURE__ */ React201.createElement(
21173
+ return /* @__PURE__ */ React203.createElement(Box, { id: "token-transfer-page" }, /* @__PURE__ */ React203.createElement(
20989
21174
  Box,
20990
21175
  {
20991
21176
  display: "flex",
@@ -20994,17 +21179,17 @@ function TransferToken({
20994
21179
  justifyContent: "center",
20995
21180
  gap: "14"
20996
21181
  },
20997
- /* @__PURE__ */ React201.createElement(Box, { display: "flex", flexDirection: "column", width: "full" }, /* @__PURE__ */ React201.createElement(
21182
+ /* @__PURE__ */ React203.createElement(Box, { display: "flex", flexDirection: "column", width: "full" }, /* @__PURE__ */ React203.createElement(
20998
21183
  SourcePaymentMethodItem,
20999
21184
  {
21000
21185
  otherSourcesCount,
21001
21186
  keyText: textCustomizations.transferTokens,
21002
21187
  disclaimerText: "No limit",
21003
- keyIcon: /* @__PURE__ */ React201.createElement(LightningBoltIcon, null),
21188
+ keyIcon: /* @__PURE__ */ React203.createElement(LightningBoltIcon, null),
21004
21189
  onClick: () => onNext({})
21005
21190
  }
21006
21191
  )),
21007
- /* @__PURE__ */ React201.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React201.createElement(
21192
+ /* @__PURE__ */ React203.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React203.createElement(
21008
21193
  Text,
21009
21194
  {
21010
21195
  size: "12",
@@ -21013,7 +21198,7 @@ function TransferToken({
21013
21198
  style: { textTransform: "uppercase" }
21014
21199
  },
21015
21200
  "Token"
21016
- ), /* @__PURE__ */ React201.createElement(
21201
+ ), /* @__PURE__ */ React203.createElement(
21017
21202
  TokenDropdown_default,
21018
21203
  {
21019
21204
  defaultSelectedToken,
@@ -21038,7 +21223,7 @@ function TransferToken({
21038
21223
  }
21039
21224
  }
21040
21225
  )),
21041
- /* @__PURE__ */ React201.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React201.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React201.createElement(
21226
+ /* @__PURE__ */ React203.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React203.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React203.createElement(
21042
21227
  Text,
21043
21228
  {
21044
21229
  size: "12",
@@ -21047,13 +21232,14 @@ function TransferToken({
21047
21232
  style: { textTransform: "uppercase" }
21048
21233
  },
21049
21234
  "Chain"
21050
- ), /* @__PURE__ */ React201.createElement(
21051
- ChainDropdown_default,
21235
+ ), /* @__PURE__ */ React203.createElement(
21236
+ ChainDropdown,
21052
21237
  {
21053
21238
  selectedToken,
21054
21239
  selectedChainId,
21055
21240
  assets: filteredAssets,
21056
21241
  onChainSelected: (chainId) => {
21242
+ if (chainId === void 0) return;
21057
21243
  logger.log(`${TRANSFER_TOKEN_LOG_PREFIX}_changeChain`, {
21058
21244
  previousChainId: selectedChainId,
21059
21245
  newChainId: chainId,
@@ -21063,7 +21249,7 @@ function TransferToken({
21063
21249
  setSelectedChainId(chainId);
21064
21250
  }
21065
21251
  }
21066
- )), /* @__PURE__ */ React201.createElement(
21252
+ )), /* @__PURE__ */ React203.createElement(
21067
21253
  Box,
21068
21254
  {
21069
21255
  display: "flex",
@@ -21071,10 +21257,10 @@ function TransferToken({
21071
21257
  alignItems: "center",
21072
21258
  width: "full"
21073
21259
  },
21074
- /* @__PURE__ */ React201.createElement(Text, { size: "12", color: "primaryText" }, "Minimum deposit"),
21075
- /* @__PURE__ */ React201.createElement(Text, { size: "12", color: "primaryText" }, minTransferUsd === 0 ? "No minimum" : formatCurrencyAndStringify12(minTransferUsd))
21260
+ /* @__PURE__ */ React203.createElement(Text, { size: "12", color: "primaryText" }, "Minimum deposit"),
21261
+ /* @__PURE__ */ React203.createElement(Text, { size: "12", color: "primaryText" }, minTransferUsd === 0 ? "No minimum" : formatCurrencyAndStringify12(minTransferUsd))
21076
21262
  )),
21077
- /* @__PURE__ */ React201.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React201.createElement(
21263
+ /* @__PURE__ */ React203.createElement(Box, { width: "full", display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React203.createElement(
21078
21264
  Text,
21079
21265
  {
21080
21266
  size: "12",
@@ -21083,15 +21269,8 @@ function TransferToken({
21083
21269
  style: { textTransform: "uppercase" }
21084
21270
  },
21085
21271
  "Your deposit address"
21086
- ), isLoadingDepositAddress ? /* @__PURE__ */ React201.createElement(
21087
- FunSkeletonBlock,
21088
- {
21089
- height: "24",
21090
- style: { height: "33px" },
21091
- width: "full"
21092
- }
21093
- ) : /* @__PURE__ */ React201.createElement(CopyInputDisplayedAddress, { address: depositAddress })),
21094
- /* @__PURE__ */ React201.createElement(
21272
+ ), isLoadingDepositAddress ? /* @__PURE__ */ React203.createElement(FunSkeletonBlock, { height: "33", width: "full" }) : /* @__PURE__ */ React203.createElement(CopyInputDisplayedAddress, { address: depositAddress })),
21273
+ /* @__PURE__ */ React203.createElement(
21095
21274
  Box,
21096
21275
  {
21097
21276
  display: "flex",
@@ -21099,31 +21278,7 @@ function TransferToken({
21099
21278
  justifyContent: "center",
21100
21279
  paddingY: "4"
21101
21280
  },
21102
- isLoadingDepositAddress ? /* @__PURE__ */ React201.createElement(
21103
- Box,
21104
- {
21105
- display: "flex",
21106
- flexDirection: "column",
21107
- alignItems: "center",
21108
- justifyContent: "center",
21109
- gap: "4",
21110
- style: { width: "140px" }
21111
- },
21112
- Array.from({ length: 12 }, (_, index) => /* @__PURE__ */ React201.createElement(
21113
- Box,
21114
- {
21115
- display: "flex",
21116
- alignItems: "center",
21117
- justifyContent: "center",
21118
- gap: "4",
21119
- key: index
21120
- },
21121
- Array.from({ length: 12 }, (_2, index2) => (
21122
- // biome-ignore lint/suspicious/noArrayIndexKey: no better key
21123
- /* @__PURE__ */ React201.createElement(FunSkeletonCircle, { size: "8", key: index2 })
21124
- ))
21125
- ))
21126
- ) : /* @__PURE__ */ React201.createElement(
21281
+ isLoadingDepositAddress ? /* @__PURE__ */ React203.createElement(QRCodeSkeletonLoader_default, { diagonalDimension: 12 }) : /* @__PURE__ */ React203.createElement(
21127
21282
  QRCode,
21128
21283
  {
21129
21284
  logoSize: 24,
@@ -21137,7 +21292,7 @@ function TransferToken({
21137
21292
  }
21138
21293
  )
21139
21294
  ),
21140
- /* @__PURE__ */ React201.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React201.createElement(FunInfoBanner, null), /* @__PURE__ */ React201.createElement(
21295
+ /* @__PURE__ */ React203.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React203.createElement(FunInfoBanner, null), /* @__PURE__ */ React203.createElement(
21141
21296
  Box,
21142
21297
  {
21143
21298
  display: "flex",
@@ -21146,21 +21301,21 @@ function TransferToken({
21146
21301
  width: "full",
21147
21302
  ref: disclaimerTextWrapperRef
21148
21303
  },
21149
- /* @__PURE__ */ React201.createElement(Text, { size: "10", color: "secondaryText", weight: "medium" }, "Send in the accepted token to the address above and it will auto swap to ", targetAssetTicker, " in your ", appNameWalletDisplayText, ", minus", " ", /* @__PURE__ */ React201.createElement(
21304
+ /* @__PURE__ */ React203.createElement(Text, { size: "10", color: "secondaryText", weight: "medium" }, "Send in the accepted token to the address above and it will auto swap to ", targetAssetTicker, " in your ", appNameWalletDisplayText, ", minus", " ", /* @__PURE__ */ React203.createElement(
21150
21305
  FunLinkButton,
21151
21306
  {
21152
21307
  href: "https://intercom.help/funxyz/en/articles/10073209-fun-xyz-s-fee-breakdown",
21153
21308
  inline: true,
21154
21309
  text: "fees"
21155
21310
  }
21156
- ), ".", " ", /* @__PURE__ */ React201.createElement(
21311
+ ), ".", " ", /* @__PURE__ */ React203.createElement(
21157
21312
  FunLinkButton,
21158
21313
  {
21159
21314
  href: "https://fun.xyz/terms",
21160
21315
  inline: true,
21161
21316
  text: "Terms & conditions"
21162
21317
  }
21163
- ), " ", "apply. Experiencing problems?", " ", /* @__PURE__ */ React201.createElement(
21318
+ ), " ", "apply. Experiencing problems?", " ", /* @__PURE__ */ React203.createElement(
21164
21319
  FunLinkButton,
21165
21320
  {
21166
21321
  href: "https://intercom.help/funxyz/en/articles/10003876-direct-deposit-guide-faqs",
@@ -21296,7 +21451,7 @@ function useTitleConfig(checkoutItem, state) {
21296
21451
  const baseTitle = checkoutItem.initSettings.config.modalTitle ?? fallback2;
21297
21452
  return {
21298
21453
  disableBack: disableBack ?? false,
21299
- showFullHeight: showFullHeight ?? false,
21454
+ showFullHeight: showFullHeight ?? (isVertexCustomer(apiKey) && state.step === "select_asset" /* SELECT_ASSET */),
21300
21455
  title: title?.(textCustomizations, isDydxCustomer(apiKey)) ?? baseTitle
21301
21456
  };
21302
21457
  }
@@ -21304,7 +21459,7 @@ function useTitleConfig(checkoutItem, state) {
21304
21459
  // src/modals/CheckoutModal/FunCheckoutModal.tsx
21305
21460
  function FunCheckoutModalStepComponent(props) {
21306
21461
  const { Component: Component2 } = CheckoutModalSteps[props.modalState.step];
21307
- return /* @__PURE__ */ React202.createElement(Component2, { ...props });
21462
+ return /* @__PURE__ */ React204.createElement(Component2, { ...props });
21308
21463
  }
21309
21464
  function FunCheckoutModalInner({
21310
21465
  checkoutItem,
@@ -21312,7 +21467,6 @@ function FunCheckoutModalInner({
21312
21467
  open
21313
21468
  }) {
21314
21469
  const { isUserGeoblocked } = useFunkitUserIp();
21315
- const { isCheckoutRisky } = useIsCheckoutRisky(checkoutItem);
21316
21470
  const {
21317
21471
  animation,
21318
21472
  modalState,
@@ -21342,7 +21496,7 @@ function FunCheckoutModalInner({
21342
21496
  setModalState
21343
21497
  };
21344
21498
  const isInitialStep = modalState.step === "loading_account" /* LOADING_ACCOUNT */;
21345
- const isBlocked = isUserGeoblocked || isCheckoutRisky;
21499
+ const isBlocked = isUserGeoblocked || modalState.isBlocked;
21346
21500
  const hasBack = hasHistoryEntry && !disableBack;
21347
21501
  const checkoutConfig = checkoutItem.initSettings.config;
21348
21502
  const showDydxSwitch = !hasBack && modalState.step !== "checkout_complete" /* CHECKOUT_COMPLETE */;
@@ -21350,7 +21504,7 @@ function FunCheckoutModalInner({
21350
21504
  depositAddress: checkoutItem.depositAddress ?? void 0,
21351
21505
  isCheckoutDetailView: modalState.step === "checkout_complete" /* CHECKOUT_COMPLETE */,
21352
21506
  paddingTop: 0,
21353
- topbar: /* @__PURE__ */ React202.createElement(
21507
+ topbar: /* @__PURE__ */ React204.createElement(
21354
21508
  Dialog.Title,
21355
21509
  {
21356
21510
  hasBackButton: hasBack && !isBlocked,
@@ -21364,7 +21518,7 @@ function FunCheckoutModalInner({
21364
21518
  ),
21365
21519
  withTopDivider: checkoutConfig.modalTitleMeta ? "always" : "scroll"
21366
21520
  });
21367
- return /* @__PURE__ */ React202.createElement(
21521
+ return /* @__PURE__ */ React204.createElement(
21368
21522
  Dialog,
21369
21523
  {
21370
21524
  open,
@@ -21373,7 +21527,7 @@ function FunCheckoutModalInner({
21373
21527
  isHidden: modalState.isSoftHidden
21374
21528
  },
21375
21529
  topbar,
21376
- /* @__PURE__ */ React202.createElement(
21530
+ /* @__PURE__ */ React204.createElement(
21377
21531
  Dialog.Content,
21378
21532
  {
21379
21533
  fullHeight: showFullHeight,
@@ -21383,22 +21537,22 @@ function FunCheckoutModalInner({
21383
21537
  withTopDivider,
21384
21538
  withBottomDivider: modalState.step === "transfer_token" /* TRANSFER_TOKEN */ ? "never" : "scroll"
21385
21539
  },
21386
- isBlocked ? /* @__PURE__ */ React202.createElement(
21540
+ isBlocked ? /* @__PURE__ */ React204.createElement(
21387
21541
  FunCheckoutBlocked,
21388
21542
  {
21389
21543
  reason: isUserGeoblocked ? "geoblock" : "security"
21390
21544
  }
21391
- ) : /* @__PURE__ */ React202.createElement(React202.Fragment, null, /* @__PURE__ */ React202.createElement(
21545
+ ) : /* @__PURE__ */ React204.createElement(React204.Fragment, null, /* @__PURE__ */ React204.createElement(
21392
21546
  DydxSwitchTab,
21393
21547
  {
21394
21548
  checkoutItem,
21395
21549
  showSwitch: showDydxSwitch,
21396
21550
  onClose: onCloseWrapper
21397
21551
  }
21398
- ), /* @__PURE__ */ React202.createElement(FunCheckoutModalStepComponent, { ...modalProps }))
21552
+ ), /* @__PURE__ */ React204.createElement(FunCheckoutModalStepComponent, { ...modalProps }))
21399
21553
  ),
21400
- /* @__PURE__ */ React202.createElement(Dialog.BottomSection, { id: CHECKOUT_MODAL_BOTTOM_BAR_ID }),
21401
- !isBlocked && /* @__PURE__ */ React202.createElement(
21554
+ /* @__PURE__ */ React204.createElement(Dialog.BottomSection, { id: CHECKOUT_MODAL_BOTTOM_BAR_ID }),
21555
+ !isBlocked && /* @__PURE__ */ React204.createElement(
21402
21556
  CheckoutNotifications,
21403
21557
  {
21404
21558
  onHelp: handleCheckoutHelp,
@@ -21412,7 +21566,7 @@ function FunCheckoutModal({ onClose, open }) {
21412
21566
  if (!checkoutItem) {
21413
21567
  return null;
21414
21568
  }
21415
- return /* @__PURE__ */ React202.createElement(
21569
+ return /* @__PURE__ */ React204.createElement(
21416
21570
  FunCheckoutModalInner,
21417
21571
  {
21418
21572
  checkoutItem,
@@ -21423,7 +21577,7 @@ function FunCheckoutModal({ onClose, open }) {
21423
21577
  }
21424
21578
 
21425
21579
  // src/modals/ConnectModal/ConnectModal.tsx
21426
- import React203 from "react";
21580
+ import React205 from "react";
21427
21581
  import { useAccount as useAccount9 } from "wagmi";
21428
21582
  var TITLE_ID2 = "rk_connect_title";
21429
21583
  function ConnectModal({
@@ -21434,12 +21588,12 @@ function ConnectModal({
21434
21588
  const connectionStatus = useConnectionStatus();
21435
21589
  const { disconnect } = useFunkitDisconnect();
21436
21590
  const { isConnecting } = useAccount9();
21437
- const onConnectModalCancel = React203.useCallback(() => {
21591
+ const onConnectModalCancel = React205.useCallback(() => {
21438
21592
  if (isConnecting) disconnect();
21439
21593
  onClose();
21440
21594
  }, [onClose, disconnect, isConnecting]);
21441
21595
  if (connectionStatus === "disconnected" || connectionStatus === "loading") {
21442
- return /* @__PURE__ */ React203.createElement(
21596
+ return /* @__PURE__ */ React205.createElement(
21443
21597
  Dialog,
21444
21598
  {
21445
21599
  onClose: onConnectModalCancel,
@@ -21447,7 +21601,7 @@ function ConnectModal({
21447
21601
  titleId: TITLE_ID2,
21448
21602
  isSmartCloseable: true
21449
21603
  },
21450
- /* @__PURE__ */ React203.createElement(
21604
+ /* @__PURE__ */ React205.createElement(
21451
21605
  FunConnectOptions,
21452
21606
  {
21453
21607
  onClose: onConnectModalCancel,
@@ -21535,13 +21689,13 @@ function ModalProvider({ children }) {
21535
21689
  onConnect: () => closeModals(isUnauthenticated),
21536
21690
  onDisconnect: closeModals
21537
21691
  });
21538
- useEffect44(() => {
21692
+ useEffect43(() => {
21539
21693
  if (isUnauthenticated) closeModals();
21540
21694
  }, [isUnauthenticated]);
21541
- return /* @__PURE__ */ React204.createElement(
21695
+ return /* @__PURE__ */ React206.createElement(
21542
21696
  ModalContext.Provider,
21543
21697
  {
21544
- value: useMemo37(
21698
+ value: useMemo38(
21545
21699
  () => ({
21546
21700
  accountModalOpen,
21547
21701
  accountModalTab,
@@ -21576,7 +21730,7 @@ function ModalProvider({ children }) {
21576
21730
  )
21577
21731
  },
21578
21732
  children,
21579
- /* @__PURE__ */ React204.createElement(
21733
+ /* @__PURE__ */ React206.createElement(
21580
21734
  ConnectModal,
21581
21735
  {
21582
21736
  onClose: closeConnectModal,
@@ -21584,7 +21738,7 @@ function ModalProvider({ children }) {
21584
21738
  walletsOnly: !!walletsOnly
21585
21739
  }
21586
21740
  ),
21587
- /* @__PURE__ */ React204.createElement(
21741
+ /* @__PURE__ */ React206.createElement(
21588
21742
  AccountModal,
21589
21743
  {
21590
21744
  onClose: closeAccountModal,
@@ -21592,8 +21746,8 @@ function ModalProvider({ children }) {
21592
21746
  defaultTab: accountModalTab
21593
21747
  }
21594
21748
  ),
21595
- /* @__PURE__ */ React204.createElement(ChainModal, { onClose: closeChainModal, open: chainModalOpen }),
21596
- /* @__PURE__ */ React204.createElement(
21749
+ /* @__PURE__ */ React206.createElement(ChainModal, { onClose: closeChainModal, open: chainModalOpen }),
21750
+ /* @__PURE__ */ React206.createElement(
21597
21751
  FunCheckoutModal,
21598
21752
  {
21599
21753
  onClose: closeFunCheckoutModal,
@@ -21939,7 +22093,7 @@ var FunkitWeb2Provider = ({
21939
22093
  },
21940
22094
  []
21941
22095
  );
21942
- useEffect45(() => {
22096
+ useEffect44(() => {
21943
22097
  const newPrivy = new PrivyJS({
21944
22098
  appId: DEFAULT_PRIVY_APP_ID,
21945
22099
  storage: new LocalStorage(),
@@ -22146,7 +22300,7 @@ var FunkitWeb2Provider = ({
22146
22300
  }
22147
22301
  }
22148
22302
  }, [handleFunkitWeb2Login, initChainId, loginMethod]);
22149
- useEffect45(() => {
22303
+ useEffect44(() => {
22150
22304
  if (privy && privyIframeUrl && isNotNullish13(initChainId)) {
22151
22305
  const iframe = document.getElementById(
22152
22306
  PRIVY_IFRAME_ID
@@ -22261,7 +22415,7 @@ var FunkitWeb2Provider = ({
22261
22415
  },
22262
22416
  [privy]
22263
22417
  );
22264
- const web2UserInfo = useMemo38(() => {
22418
+ const web2UserInfo = useMemo39(() => {
22265
22419
  if (!loggedInUser || !loggedInUser?.linked_accounts || !loggedInUser?.linked_accounts?.length) {
22266
22420
  return PLACEHOLDER_FUNKIT_USER_INFO;
22267
22421
  }
@@ -22328,7 +22482,7 @@ var FunkitWeb2Provider = ({
22328
22482
  handleFunkitWeb2Logout,
22329
22483
  web2UserInfo
22330
22484
  };
22331
- return /* @__PURE__ */ React205.createElement(FunkitWeb2Context.Provider, { value: contextValue }, privyIframeUrl ? /* @__PURE__ */ React205.createElement(
22485
+ return /* @__PURE__ */ React207.createElement(FunkitWeb2Context.Provider, { value: contextValue }, privyIframeUrl ? /* @__PURE__ */ React207.createElement(
22332
22486
  "iframe",
22333
22487
  {
22334
22488
  id: PRIVY_IFRAME_ID,
@@ -22361,7 +22515,7 @@ function useConnectionStatus() {
22361
22515
  }
22362
22516
 
22363
22517
  // src/providers/ShowBalanceContext.tsx
22364
- import React206, {
22518
+ import React208, {
22365
22519
  createContext as createContext19,
22366
22520
  useContext as useContext19,
22367
22521
  useState as useState64
@@ -22372,20 +22526,20 @@ var ShowBalanceContext = createContext19({
22372
22526
  });
22373
22527
  function ShowBalanceProvider({ children }) {
22374
22528
  const [showBalance, setShowBalance] = useState64();
22375
- return /* @__PURE__ */ React206.createElement(ShowBalanceContext.Provider, { value: { showBalance, setShowBalance } }, children);
22529
+ return /* @__PURE__ */ React208.createElement(ShowBalanceContext.Provider, { value: { showBalance, setShowBalance } }, children);
22376
22530
  }
22377
22531
  var useShowBalance = () => useContext19(ShowBalanceContext);
22378
22532
 
22379
22533
  // src/components/ConnectButton/ConnectButtonRenderer.tsx
22380
22534
  import { formatCurrencyAndStringify as formatCurrencyAndStringify13, isMobile as isMobile14, noop as noop8 } from "@funkit/utils";
22381
- import React207 from "react";
22535
+ import React209 from "react";
22382
22536
  import { useAccount as useAccount12, useBalance, useConfig as useConfig6 } from "wagmi";
22383
22537
 
22384
22538
  // src/hooks/useIsMounted.ts
22385
- import { useCallback as useCallback43, useEffect as useEffect46, useState as useState65 } from "react";
22539
+ import { useCallback as useCallback43, useEffect as useEffect45, useState as useState65 } from "react";
22386
22540
  function useIsMounted() {
22387
22541
  const [isMounted, setIsMounted] = useState65(false);
22388
- useEffect46(() => {
22542
+ useEffect45(() => {
22389
22543
  setIsMounted(true);
22390
22544
  return () => {
22391
22545
  setIsMounted(false);
@@ -22469,7 +22623,7 @@ function ConnectButtonRenderer({
22469
22623
  const { openChainModal } = useChainModal();
22470
22624
  const { openAccountModal } = useAccountModal();
22471
22625
  const { accountModalOpen, chainModalOpen, connectModalOpen } = useModalState();
22472
- return /* @__PURE__ */ React207.createElement(React207.Fragment, null, children({
22626
+ return /* @__PURE__ */ React209.createElement(React209.Fragment, null, children({
22473
22627
  account: address ? {
22474
22628
  address,
22475
22629
  balanceDecimals: balanceData?.decimals,
@@ -22525,7 +22679,7 @@ function ChainSelectorButton({
22525
22679
  openChainModal,
22526
22680
  chain
22527
22681
  }) {
22528
- return /* @__PURE__ */ React208.createElement(
22682
+ return /* @__PURE__ */ React210.createElement(
22529
22683
  Box,
22530
22684
  {
22531
22685
  alignItems: "center",
@@ -22553,7 +22707,7 @@ function ChainSelectorButton({
22553
22707
  type: "button",
22554
22708
  ...connectButtonStyles
22555
22709
  },
22556
- unsupportedChain ? /* @__PURE__ */ React208.createElement(Box, { alignItems: "center", display: "flex", height: "24", paddingX: "4" }, "Wrong network") : /* @__PURE__ */ React208.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, chain.hasIcon ? /* @__PURE__ */ React208.createElement(
22710
+ unsupportedChain ? /* @__PURE__ */ React210.createElement(Box, { alignItems: "center", display: "flex", height: "24", paddingX: "4" }, "Wrong network") : /* @__PURE__ */ React210.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, chain.hasIcon ? /* @__PURE__ */ React210.createElement(
22557
22711
  Box,
22558
22712
  {
22559
22713
  display: mapResponsiveValue(
@@ -22563,7 +22717,7 @@ function ChainSelectorButton({
22563
22717
  height: "12",
22564
22718
  width: "12"
22565
22719
  },
22566
- /* @__PURE__ */ React208.createElement(
22720
+ /* @__PURE__ */ React210.createElement(
22567
22721
  AsyncImage,
22568
22722
  {
22569
22723
  alt: chain.name ?? "Chain icon",
@@ -22574,7 +22728,7 @@ function ChainSelectorButton({
22574
22728
  src: chain.iconUrl
22575
22729
  }
22576
22730
  )
22577
- ) : null, /* @__PURE__ */ React208.createElement(
22731
+ ) : null, /* @__PURE__ */ React210.createElement(
22578
22732
  Box,
22579
22733
  {
22580
22734
  display: mapResponsiveValue(chainStatus, (value) => {
@@ -22594,7 +22748,7 @@ function AccountButton({
22594
22748
  showBalance,
22595
22749
  accountStatus
22596
22750
  }) {
22597
- return /* @__PURE__ */ React208.createElement(
22751
+ return /* @__PURE__ */ React210.createElement(
22598
22752
  Box,
22599
22753
  {
22600
22754
  alignItems: "center",
@@ -22614,7 +22768,7 @@ function AccountButton({
22614
22768
  gap: "16",
22615
22769
  ...connectButtonStyles
22616
22770
  },
22617
- account.displayBalance && /* @__PURE__ */ React208.createElement(
22771
+ account.displayBalance && /* @__PURE__ */ React210.createElement(
22618
22772
  Box,
22619
22773
  {
22620
22774
  display: mapResponsiveValue(
@@ -22624,7 +22778,7 @@ function AccountButton({
22624
22778
  },
22625
22779
  account.displayBalance
22626
22780
  ),
22627
- /* @__PURE__ */ React208.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, /* @__PURE__ */ React208.createElement(
22781
+ /* @__PURE__ */ React210.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, /* @__PURE__ */ React210.createElement(
22628
22782
  Box,
22629
22783
  {
22630
22784
  display: mapResponsiveValue(
@@ -22632,7 +22786,7 @@ function AccountButton({
22632
22786
  (value) => value === "full" || value === "avatar" ? "block" : "none"
22633
22787
  )
22634
22788
  },
22635
- /* @__PURE__ */ React208.createElement(
22789
+ /* @__PURE__ */ React210.createElement(
22636
22790
  Avatar,
22637
22791
  {
22638
22792
  address: account.address,
@@ -22641,7 +22795,7 @@ function AccountButton({
22641
22795
  size: 12
22642
22796
  }
22643
22797
  )
22644
- ), /* @__PURE__ */ React208.createElement(
22798
+ ), /* @__PURE__ */ React210.createElement(
22645
22799
  Box,
22646
22800
  {
22647
22801
  display: mapResponsiveValue(
@@ -22668,11 +22822,11 @@ function ConnectButton({
22668
22822
  const connectionStatus = useConnectionStatus();
22669
22823
  const { setShowBalance } = useShowBalance();
22670
22824
  const [ready, setReady] = useState66(false);
22671
- useEffect47(() => {
22825
+ useEffect46(() => {
22672
22826
  setShowBalance(showBalance);
22673
22827
  if (!ready) setReady(true);
22674
22828
  }, [showBalance, setShowBalance, ready]);
22675
- return ready ? /* @__PURE__ */ React208.createElement(ConnectButtonRenderer, null, ({
22829
+ return ready ? /* @__PURE__ */ React210.createElement(ConnectButtonRenderer, null, ({
22676
22830
  account,
22677
22831
  chain,
22678
22832
  mounted,
@@ -22682,7 +22836,7 @@ function ConnectButton({
22682
22836
  }) => {
22683
22837
  const ready2 = mounted && connectionStatus !== "loading";
22684
22838
  const unsupportedChain = chain?.unsupported ?? false;
22685
- return /* @__PURE__ */ React208.createElement(
22839
+ return /* @__PURE__ */ React210.createElement(
22686
22840
  Box,
22687
22841
  {
22688
22842
  display: "flex",
@@ -22698,7 +22852,7 @@ function ConnectButton({
22698
22852
  },
22699
22853
  ready2 && account && connectionStatus === "connected" ? (
22700
22854
  // Logged in: Chain Button & Account Button
22701
- /* @__PURE__ */ React208.createElement(React208.Fragment, null, showChainSelector && chain && (chains.length > 1 || unsupportedChain) && /* @__PURE__ */ React208.createElement(
22855
+ /* @__PURE__ */ React210.createElement(React210.Fragment, null, showChainSelector && chain && (chains.length > 1 || unsupportedChain) && /* @__PURE__ */ React210.createElement(
22702
22856
  ChainSelectorButton,
22703
22857
  {
22704
22858
  unsupportedChain,
@@ -22706,7 +22860,7 @@ function ConnectButton({
22706
22860
  openChainModal,
22707
22861
  chain
22708
22862
  }
22709
- ), !unsupportedChain && /* @__PURE__ */ React208.createElement(
22863
+ ), !unsupportedChain && /* @__PURE__ */ React210.createElement(
22710
22864
  AccountButton,
22711
22865
  {
22712
22866
  openAccountModal,
@@ -22717,7 +22871,7 @@ function ConnectButton({
22717
22871
  ))
22718
22872
  ) : (
22719
22873
  // Not logged in: Connect Button
22720
- /* @__PURE__ */ React208.createElement(
22874
+ /* @__PURE__ */ React210.createElement(
22721
22875
  Box,
22722
22876
  {
22723
22877
  as: "button",
@@ -22735,19 +22889,19 @@ function ConnectButton({
22735
22889
  type: "button",
22736
22890
  ...connectButtonStyles
22737
22891
  },
22738
- /* @__PURE__ */ React208.createElement(Box, { display: "flex", gap: "8", alignItems: "center" }, mounted && label, suffixIcon)
22892
+ /* @__PURE__ */ React210.createElement(Box, { display: "flex", gap: "8", alignItems: "center" }, mounted && label, suffixIcon)
22739
22893
  )
22740
22894
  )
22741
22895
  );
22742
- }) : /* @__PURE__ */ React208.createElement(React208.Fragment, null);
22896
+ }) : /* @__PURE__ */ React210.createElement(React210.Fragment, null);
22743
22897
  }
22744
22898
  ConnectButton.__defaultProps = defaultProps;
22745
22899
  ConnectButton.Custom = ConnectButtonRenderer;
22746
22900
 
22747
22901
  // src/components/Icons/FunkitPaymentsIconLine.tsx
22748
- import React209 from "react";
22902
+ import React211 from "react";
22749
22903
  function MetaMaskPaymentIcon({ size = 16 }) {
22750
- return /* @__PURE__ */ React209.createElement(
22904
+ return /* @__PURE__ */ React211.createElement(
22751
22905
  "svg",
22752
22906
  {
22753
22907
  width: size,
@@ -22756,7 +22910,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22756
22910
  fill: "none",
22757
22911
  xmlns: "http://www.w3.org/2000/svg"
22758
22912
  },
22759
- /* @__PURE__ */ React209.createElement(
22913
+ /* @__PURE__ */ React211.createElement(
22760
22914
  "path",
22761
22915
  {
22762
22916
  d: "M24.0891 3.1199L15.3446 9.61456L16.9617 5.7828L24.0891 3.1199Z",
@@ -22767,7 +22921,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22767
22921
  strokeLinejoin: "round"
22768
22922
  }
22769
22923
  ),
22770
- /* @__PURE__ */ React209.createElement(
22924
+ /* @__PURE__ */ React211.createElement(
22771
22925
  "path",
22772
22926
  {
22773
22927
  d: "M3.90207 3.1199L12.5763 9.67608L11.0383 5.7828L3.90207 3.1199Z",
@@ -22778,7 +22932,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22778
22932
  strokeLinejoin: "round"
22779
22933
  }
22780
22934
  ),
22781
- /* @__PURE__ */ React209.createElement(
22935
+ /* @__PURE__ */ React211.createElement(
22782
22936
  "path",
22783
22937
  {
22784
22938
  d: "M20.9429 18.1745L18.6139 21.7426L23.597 23.1136L25.0295 18.2536L20.9429 18.1745Z",
@@ -22789,7 +22943,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22789
22943
  strokeLinejoin: "round"
22790
22944
  }
22791
22945
  ),
22792
- /* @__PURE__ */ React209.createElement(
22946
+ /* @__PURE__ */ React211.createElement(
22793
22947
  "path",
22794
22948
  {
22795
22949
  d: "M2.97929 18.2536L4.40301 23.1136L9.38607 21.7426L7.05713 18.1745L2.97929 18.2536Z",
@@ -22800,7 +22954,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22800
22954
  strokeLinejoin: "round"
22801
22955
  }
22802
22956
  ),
22803
- /* @__PURE__ */ React209.createElement(
22957
+ /* @__PURE__ */ React211.createElement(
22804
22958
  "path",
22805
22959
  {
22806
22960
  d: "M9.10483 12.1456L7.71626 14.2461L12.6642 14.4658L12.4884 9.14877L9.10483 12.1456Z",
@@ -22811,7 +22965,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22811
22965
  strokeLinejoin: "round"
22812
22966
  }
22813
22967
  ),
22814
- /* @__PURE__ */ React209.createElement(
22968
+ /* @__PURE__ */ React211.createElement(
22815
22969
  "path",
22816
22970
  {
22817
22971
  d: "M18.8864 12.1456L15.4589 9.08725L15.3446 14.4658L20.2837 14.2461L18.8864 12.1456Z",
@@ -22822,7 +22976,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22822
22976
  strokeLinejoin: "round"
22823
22977
  }
22824
22978
  ),
22825
- /* @__PURE__ */ React209.createElement(
22979
+ /* @__PURE__ */ React211.createElement(
22826
22980
  "path",
22827
22981
  {
22828
22982
  d: "M9.38606 21.7426L12.3566 20.2925L9.79033 18.2888L9.38606 21.7426Z",
@@ -22833,7 +22987,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22833
22987
  strokeLinejoin: "round"
22834
22988
  }
22835
22989
  ),
22836
- /* @__PURE__ */ React209.createElement(
22990
+ /* @__PURE__ */ React211.createElement(
22837
22991
  "path",
22838
22992
  {
22839
22993
  d: "M15.6347 20.2925L18.6139 21.7426L18.2009 18.2888L15.6347 20.2925Z",
@@ -22844,7 +22998,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22844
22998
  strokeLinejoin: "round"
22845
22999
  }
22846
23000
  ),
22847
- /* @__PURE__ */ React209.createElement(
23001
+ /* @__PURE__ */ React211.createElement(
22848
23002
  "path",
22849
23003
  {
22850
23004
  d: "M18.6139 21.7426L15.6347 20.2925L15.8719 22.2348L15.8456 23.0521L18.6139 21.7426Z",
@@ -22855,7 +23009,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22855
23009
  strokeLinejoin: "round"
22856
23010
  }
22857
23011
  ),
22858
- /* @__PURE__ */ React209.createElement(
23012
+ /* @__PURE__ */ React211.createElement(
22859
23013
  "path",
22860
23014
  {
22861
23015
  d: "M9.38606 21.7426L12.1544 23.0521L12.1368 22.2348L12.3566 20.2925L9.38606 21.7426Z",
@@ -22866,7 +23020,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22866
23020
  strokeLinejoin: "round"
22867
23021
  }
22868
23022
  ),
22869
- /* @__PURE__ */ React209.createElement(
23023
+ /* @__PURE__ */ React211.createElement(
22870
23024
  "path",
22871
23025
  {
22872
23026
  d: "M12.1984 17.0056L9.72002 16.2762L11.4689 15.4765L12.1984 17.0056Z",
@@ -22877,7 +23031,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22877
23031
  strokeLinejoin: "round"
22878
23032
  }
22879
23033
  ),
22880
- /* @__PURE__ */ React209.createElement(
23034
+ /* @__PURE__ */ React211.createElement(
22881
23035
  "path",
22882
23036
  {
22883
23037
  d: "M15.7928 17.0056L16.5223 15.4765L18.28 16.2762L15.7928 17.0056Z",
@@ -22888,7 +23042,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22888
23042
  strokeLinejoin: "round"
22889
23043
  }
22890
23044
  ),
22891
- /* @__PURE__ */ React209.createElement(
23045
+ /* @__PURE__ */ React211.createElement(
22892
23046
  "path",
22893
23047
  {
22894
23048
  d: "M9.38606 21.7426L9.80791 18.1745L7.05712 18.2536L9.38606 21.7426Z",
@@ -22899,7 +23053,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22899
23053
  strokeLinejoin: "round"
22900
23054
  }
22901
23055
  ),
22902
- /* @__PURE__ */ React209.createElement(
23056
+ /* @__PURE__ */ React211.createElement(
22903
23057
  "path",
22904
23058
  {
22905
23059
  d: "M18.1921 18.1745L18.6139 21.7426L20.9429 18.2536L18.1921 18.1745Z",
@@ -22910,7 +23064,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22910
23064
  strokeLinejoin: "round"
22911
23065
  }
22912
23066
  ),
22913
- /* @__PURE__ */ React209.createElement(
23067
+ /* @__PURE__ */ React211.createElement(
22914
23068
  "path",
22915
23069
  {
22916
23070
  d: "M20.2837 14.2461L15.3446 14.4658L15.8016 17.0057L16.5311 15.4765L18.2888 16.2762L20.2837 14.2461Z",
@@ -22921,7 +23075,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22921
23075
  strokeLinejoin: "round"
22922
23076
  }
22923
23077
  ),
22924
- /* @__PURE__ */ React209.createElement(
23078
+ /* @__PURE__ */ React211.createElement(
22925
23079
  "path",
22926
23080
  {
22927
23081
  d: "M9.72002 16.2762L11.4777 15.4765L12.1984 17.0057L12.6642 14.4658L7.71626 14.2461L9.72002 16.2762Z",
@@ -22932,7 +23086,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22932
23086
  strokeLinejoin: "round"
22933
23087
  }
22934
23088
  ),
22935
- /* @__PURE__ */ React209.createElement(
23089
+ /* @__PURE__ */ React211.createElement(
22936
23090
  "path",
22937
23091
  {
22938
23092
  d: "M7.71626 14.2461L9.79033 18.2888L9.72002 16.2762L7.71626 14.2461Z",
@@ -22943,7 +23097,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22943
23097
  strokeLinejoin: "round"
22944
23098
  }
22945
23099
  ),
22946
- /* @__PURE__ */ React209.createElement(
23100
+ /* @__PURE__ */ React211.createElement(
22947
23101
  "path",
22948
23102
  {
22949
23103
  d: "M18.2888 16.2762L18.2009 18.2888L20.2837 14.2461L18.2888 16.2762Z",
@@ -22954,7 +23108,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22954
23108
  strokeLinejoin: "round"
22955
23109
  }
22956
23110
  ),
22957
- /* @__PURE__ */ React209.createElement(
23111
+ /* @__PURE__ */ React211.createElement(
22958
23112
  "path",
22959
23113
  {
22960
23114
  d: "M12.6642 14.4658L12.1984 17.0057L12.7784 20.0025L12.9102 16.0565L12.6642 14.4658Z",
@@ -22965,7 +23119,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22965
23119
  strokeLinejoin: "round"
22966
23120
  }
22967
23121
  ),
22968
- /* @__PURE__ */ React209.createElement(
23122
+ /* @__PURE__ */ React211.createElement(
22969
23123
  "path",
22970
23124
  {
22971
23125
  d: "M15.3446 14.4658L15.1073 16.0477L15.2128 20.0025L15.8016 17.0057L15.3446 14.4658Z",
@@ -22976,7 +23130,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22976
23130
  strokeLinejoin: "round"
22977
23131
  }
22978
23132
  ),
22979
- /* @__PURE__ */ React209.createElement(
23133
+ /* @__PURE__ */ React211.createElement(
22980
23134
  "path",
22981
23135
  {
22982
23136
  d: "M15.8016 17.0056L15.2128 20.0025L15.6347 20.2925L18.2009 18.2888L18.2888 16.2762L15.8016 17.0056Z",
@@ -22987,7 +23141,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22987
23141
  strokeLinejoin: "round"
22988
23142
  }
22989
23143
  ),
22990
- /* @__PURE__ */ React209.createElement(
23144
+ /* @__PURE__ */ React211.createElement(
22991
23145
  "path",
22992
23146
  {
22993
23147
  d: "M9.72002 16.2762L9.79033 18.2888L12.3566 20.2925L12.7784 20.0025L12.1984 17.0056L9.72002 16.2762Z",
@@ -22998,7 +23152,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
22998
23152
  strokeLinejoin: "round"
22999
23153
  }
23000
23154
  ),
23001
- /* @__PURE__ */ React209.createElement(
23155
+ /* @__PURE__ */ React211.createElement(
23002
23156
  "path",
23003
23157
  {
23004
23158
  d: "M15.8456 23.0521L15.8719 22.2348L15.6522 22.0414H12.339L12.1368 22.2348L12.1544 23.0521L9.38606 21.7426L10.3528 22.5336L12.3126 23.8958H15.6786L17.6472 22.5336L18.6139 21.7426L15.8456 23.0521Z",
@@ -23009,7 +23163,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
23009
23163
  strokeLinejoin: "round"
23010
23164
  }
23011
23165
  ),
23012
- /* @__PURE__ */ React209.createElement(
23166
+ /* @__PURE__ */ React211.createElement(
23013
23167
  "path",
23014
23168
  {
23015
23169
  d: "M15.6347 20.2925L15.2128 20.0025H12.7784L12.3566 20.2925L12.1368 22.2348L12.339 22.0414H15.6522L15.8719 22.2348L15.6347 20.2925Z",
@@ -23020,7 +23174,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
23020
23174
  strokeLinejoin: "round"
23021
23175
  }
23022
23176
  ),
23023
- /* @__PURE__ */ React209.createElement(
23177
+ /* @__PURE__ */ React211.createElement(
23024
23178
  "path",
23025
23179
  {
23026
23180
  d: "M24.4583 10.0364L25.2053 6.45072L24.0891 3.1199L15.6347 9.39485L18.8864 12.1456L23.4827 13.4903L24.5022 12.3038L24.0628 11.9874L24.7658 11.3459L24.221 10.924L24.924 10.3879L24.4583 10.0364Z",
@@ -23031,7 +23185,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
23031
23185
  strokeLinejoin: "round"
23032
23186
  }
23033
23187
  ),
23034
- /* @__PURE__ */ React209.createElement(
23188
+ /* @__PURE__ */ React211.createElement(
23035
23189
  "path",
23036
23190
  {
23037
23191
  d: "M2.79472 6.45072L3.54174 10.0364L3.06717 10.3879L3.77024 10.924L3.23415 11.3459L3.93722 11.9874L3.4978 12.3038L4.50847 13.4903L9.10483 12.1456L12.3566 9.39485L3.90207 3.1199L2.79472 6.45072Z",
@@ -23042,7 +23196,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
23042
23196
  strokeLinejoin: "round"
23043
23197
  }
23044
23198
  ),
23045
- /* @__PURE__ */ React209.createElement(
23199
+ /* @__PURE__ */ React211.createElement(
23046
23200
  "path",
23047
23201
  {
23048
23202
  d: "M23.4827 13.4903L18.8864 12.1456L20.2837 14.2461L18.2009 18.2888L20.9429 18.2536H25.0295L23.4827 13.4903Z",
@@ -23053,7 +23207,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
23053
23207
  strokeLinejoin: "round"
23054
23208
  }
23055
23209
  ),
23056
- /* @__PURE__ */ React209.createElement(
23210
+ /* @__PURE__ */ React211.createElement(
23057
23211
  "path",
23058
23212
  {
23059
23213
  d: "M9.10484 12.1456L4.50848 13.4903L2.97929 18.2536H7.05713L9.79033 18.2888L7.71626 14.2461L9.10484 12.1456Z",
@@ -23064,7 +23218,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
23064
23218
  strokeLinejoin: "round"
23065
23219
  }
23066
23220
  ),
23067
- /* @__PURE__ */ React209.createElement(
23221
+ /* @__PURE__ */ React211.createElement(
23068
23222
  "path",
23069
23223
  {
23070
23224
  d: "M15.3446 14.4658L15.6347 9.39485L16.9705 5.7828H11.0383L12.3566 9.39485L12.6642 14.4658L12.7696 16.0653L12.7784 20.0025H15.2128L15.2304 16.0653L15.3446 14.4658Z",
@@ -23078,14 +23232,14 @@ function MetaMaskPaymentIcon({ size = 16 }) {
23078
23232
  );
23079
23233
  }
23080
23234
  function MastercardPaymentIcon({ size = 16 }) {
23081
- return /* @__PURE__ */ React209.createElement(
23235
+ return /* @__PURE__ */ React211.createElement(
23082
23236
  "svg",
23083
23237
  {
23084
23238
  xmlns: "http://www.w3.org/2000/svg",
23085
23239
  height: size,
23086
23240
  viewBox: "0 0 152.407 108"
23087
23241
  },
23088
- /* @__PURE__ */ React209.createElement("g", null, /* @__PURE__ */ React209.createElement("rect", { width: "152.407", height: "108", fill: "transparent" }), /* @__PURE__ */ React209.createElement("g", null, /* @__PURE__ */ React209.createElement(
23242
+ /* @__PURE__ */ React211.createElement("g", null, /* @__PURE__ */ React211.createElement("rect", { width: "152.407", height: "108", fill: "transparent" }), /* @__PURE__ */ React211.createElement("g", null, /* @__PURE__ */ React211.createElement(
23089
23243
  "rect",
23090
23244
  {
23091
23245
  x: "60.4117",
@@ -23094,21 +23248,21 @@ function MastercardPaymentIcon({ size = 16 }) {
23094
23248
  height: "56.6064",
23095
23249
  fill: "#ff5f00"
23096
23250
  }
23097
- ), /* @__PURE__ */ React209.createElement(
23251
+ ), /* @__PURE__ */ React211.createElement(
23098
23252
  "path",
23099
23253
  {
23100
23254
  d: "M382.20839,306a35.9375,35.9375,0,0,1,13.7499-28.3032,36,36,0,1,0,0,56.6064A35.938,35.938,0,0,1,382.20839,306Z",
23101
23255
  transform: "translate(-319.79649 -252)",
23102
23256
  fill: "#eb001b"
23103
23257
  }
23104
- ), /* @__PURE__ */ React209.createElement(
23258
+ ), /* @__PURE__ */ React211.createElement(
23105
23259
  "path",
23106
23260
  {
23107
23261
  d: "M454.20349,306a35.99867,35.99867,0,0,1-58.2452,28.3032,36.00518,36.00518,0,0,0,0-56.6064A35.99867,35.99867,0,0,1,454.20349,306Z",
23108
23262
  transform: "translate(-319.79649 -252)",
23109
23263
  fill: "#f79e1b"
23110
23264
  }
23111
- ), /* @__PURE__ */ React209.createElement(
23265
+ ), /* @__PURE__ */ React211.createElement(
23112
23266
  "path",
23113
23267
  {
23114
23268
  d: "M450.76889,328.3077v-1.1589h.4673v-.2361h-1.1901v.2361h.4675v1.1589Zm2.3105,0v-1.3973h-.3648l-.41959.9611-.41971-.9611h-.365v1.3973h.2576v-1.054l.3935.9087h.2671l.39351-.911v1.0563Z",
@@ -23122,7 +23276,7 @@ function FunkitPaymentsIconLine({
23122
23276
  size = 16,
23123
23277
  gap = "2"
23124
23278
  }) {
23125
- return /* @__PURE__ */ React209.createElement(
23279
+ return /* @__PURE__ */ React211.createElement(
23126
23280
  Box,
23127
23281
  {
23128
23282
  display: "flex",
@@ -23131,9 +23285,9 @@ function FunkitPaymentsIconLine({
23131
23285
  alignItems: "center",
23132
23286
  justifyContent: "center"
23133
23287
  },
23134
- /* @__PURE__ */ React209.createElement(MetaMaskPaymentIcon, { size }),
23135
- /* @__PURE__ */ React209.createElement(MastercardPaymentIcon, { size }),
23136
- /* @__PURE__ */ React209.createElement(CoinbaseIcon, { size })
23288
+ /* @__PURE__ */ React211.createElement(MetaMaskPaymentIcon, { size }),
23289
+ /* @__PURE__ */ React211.createElement(MastercardPaymentIcon, { size }),
23290
+ /* @__PURE__ */ React211.createElement(CoinbaseIcon, { size })
23137
23291
  );
23138
23292
  }
23139
23293
 
@@ -23192,7 +23346,7 @@ var useUpdateActiveFunkitCheckout = () => {
23192
23346
 
23193
23347
  // src/providers/FunkitProvider.tsx
23194
23348
  import { QueryClientProvider } from "@tanstack/react-query";
23195
- import React210, { createContext as createContext20, useContext as useContext20 } from "react";
23349
+ import React212, { createContext as createContext20, useContext as useContext20 } from "react";
23196
23350
  import { WagmiProvider, useAccountEffect as useAccountEffect3 } from "wagmi";
23197
23351
 
23198
23352
  // src/utils/funkitProvider.ts
@@ -23270,26 +23424,26 @@ function validateFunkitProviderProps(props) {
23270
23424
  }
23271
23425
 
23272
23426
  // src/providers/useFingerprint.ts
23273
- import { useCallback as useCallback44, useEffect as useEffect48 } from "react";
23427
+ import { useCallback as useCallback44, useEffect as useEffect47 } from "react";
23274
23428
  var storageKey5 = "funkit-connect-version";
23275
23429
  function setFunkitConnectVersion({ version }) {
23276
23430
  localStorage.setItem(storageKey5, version);
23277
23431
  }
23278
23432
  function getCurrentSdkVersion() {
23279
- return "5.0.4";
23433
+ return "5.0.6";
23280
23434
  }
23281
23435
  function useFingerprint() {
23282
23436
  const fingerprint = useCallback44(() => {
23283
23437
  setFunkitConnectVersion({ version: getCurrentSdkVersion() });
23284
23438
  }, []);
23285
- useEffect48(() => {
23439
+ useEffect47(() => {
23286
23440
  fingerprint();
23287
23441
  }, [fingerprint]);
23288
23442
  }
23289
23443
 
23290
23444
  // src/providers/usePreloadImages.ts
23291
23445
  import { isNotNullish as isNotNullish14 } from "@funkit/utils";
23292
- import { useCallback as useCallback45, useEffect as useEffect49 } from "react";
23446
+ import { useCallback as useCallback45, useEffect as useEffect48 } from "react";
23293
23447
  function usePreloadImages() {
23294
23448
  const funkitConnectChains = useFunkitConnectChains();
23295
23449
  const walletConnectors = useWalletConnectors();
@@ -23299,7 +23453,7 @@ function usePreloadImages() {
23299
23453
  ...funkitConnectChains.map((chain) => chain.iconUrl).filter(isNotNullish14)
23300
23454
  );
23301
23455
  }, [walletConnectors, funkitConnectChains]);
23302
- useEffect49(() => {
23456
+ useEffect48(() => {
23303
23457
  preloadImages();
23304
23458
  }, [preloadImages]);
23305
23459
  }
@@ -23327,7 +23481,7 @@ function FunkitProvider(props) {
23327
23481
  !!props.debug,
23328
23482
  getCurrentSdkVersion()
23329
23483
  );
23330
- const MainChild = /* @__PURE__ */ React210.createElement(FunkitThemeProvider, { theme: props.theme }, /* @__PURE__ */ React210.createElement(
23484
+ const MainChild = /* @__PURE__ */ React212.createElement(FunkitThemeProvider, { theme: props.theme }, /* @__PURE__ */ React212.createElement(
23331
23485
  FunkitProviderInner,
23332
23486
  {
23333
23487
  avatar: props.avatar,
@@ -23340,7 +23494,7 @@ function FunkitProvider(props) {
23340
23494
  },
23341
23495
  props.children
23342
23496
  ));
23343
- return finalWagmiConfig && finalQueryClient ? /* @__PURE__ */ React210.createElement(WagmiProvider, { config: finalWagmiConfig }, /* @__PURE__ */ React210.createElement(QueryClientProvider, { client: finalQueryClient }, MainChild)) : MainChild;
23497
+ return finalWagmiConfig && finalQueryClient ? /* @__PURE__ */ React212.createElement(WagmiProvider, { config: finalWagmiConfig }, /* @__PURE__ */ React212.createElement(QueryClientProvider, { client: finalQueryClient }, MainChild)) : MainChild;
23344
23498
  }
23345
23499
  function FunkitProviderInner({
23346
23500
  avatar,
@@ -23360,7 +23514,7 @@ function FunkitProviderInner({
23360
23514
  const avatarContext = avatar ?? defaultAvatar;
23361
23515
  const isSandboxMode = !!sandbox;
23362
23516
  const modalSizeFinal = modalSize || ModalSizeOptions.COMPACT;
23363
- return /* @__PURE__ */ React210.createElement(FunkitConfigContext.Provider, { value: funkitConfig }, /* @__PURE__ */ React210.createElement(FunkitConnectChainProvider, { initialChain }, /* @__PURE__ */ React210.createElement(ModalSizeProvider, { modalSize: modalSizeFinal }, /* @__PURE__ */ React210.createElement(FunkitWeb2Provider, null, /* @__PURE__ */ React210.createElement(GeneralWalletProvider, null, /* @__PURE__ */ React210.createElement(FunkitFlagsProvider, null, /* @__PURE__ */ React210.createElement(FunkitCheckoutHistoryProvider, null, /* @__PURE__ */ React210.createElement(FunkitCheckoutProvider, null, /* @__PURE__ */ React210.createElement(FunkitQuoteProvider, null, /* @__PURE__ */ React210.createElement(FunkitSandboxContext.Provider, { value: isSandboxMode }, /* @__PURE__ */ React210.createElement(FunkitMeshProvider, null, /* @__PURE__ */ React210.createElement(AvatarContext.Provider, { value: avatarContext }, /* @__PURE__ */ React210.createElement(ThemeIdContext2.Provider, { value: id }, /* @__PURE__ */ React210.createElement(ShowBalanceProvider, null, /* @__PURE__ */ React210.createElement(FunkitMoonpayProvider, { debug: !!debug }, /* @__PURE__ */ React210.createElement(UserPresenceProvider, null, /* @__PURE__ */ React210.createElement(ModalProvider, null, activeTheme ? /* @__PURE__ */ React210.createElement(
23517
+ return /* @__PURE__ */ React212.createElement(FunkitConfigContext.Provider, { value: funkitConfig }, /* @__PURE__ */ React212.createElement(FunkitConnectChainProvider, { initialChain }, /* @__PURE__ */ React212.createElement(ModalSizeProvider, { modalSize: modalSizeFinal }, /* @__PURE__ */ React212.createElement(FunkitWeb2Provider, null, /* @__PURE__ */ React212.createElement(GeneralWalletProvider, null, /* @__PURE__ */ React212.createElement(FunkitFlagsProvider, null, /* @__PURE__ */ React212.createElement(FunkitCheckoutHistoryProvider, null, /* @__PURE__ */ React212.createElement(FunkitCheckoutProvider, null, /* @__PURE__ */ React212.createElement(FunkitQuoteProvider, null, /* @__PURE__ */ React212.createElement(FunkitSandboxContext.Provider, { value: isSandboxMode }, /* @__PURE__ */ React212.createElement(FunkitMeshProvider, null, /* @__PURE__ */ React212.createElement(AvatarContext.Provider, { value: avatarContext }, /* @__PURE__ */ React212.createElement(ThemeIdContext2.Provider, { value: id }, /* @__PURE__ */ React212.createElement(ShowBalanceProvider, null, /* @__PURE__ */ React212.createElement(FunkitMoonpayProvider, { debug: !!debug }, /* @__PURE__ */ React212.createElement(UserPresenceProvider, null, /* @__PURE__ */ React212.createElement(ModalProvider, null, activeTheme ? /* @__PURE__ */ React212.createElement(
23364
23518
  "div",
23365
23519
  {
23366
23520
  ...createThemeRootProps2(id),
@@ -23369,7 +23523,7 @@ function FunkitProviderInner({
23369
23523
  height: "100%"
23370
23524
  }
23371
23525
  },
23372
- /* @__PURE__ */ React210.createElement(
23526
+ /* @__PURE__ */ React212.createElement(
23373
23527
  "style",
23374
23528
  {
23375
23529
  dangerouslySetInnerHTML: {