@funkit/connect 1.1.0 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/{chunk-UK5FXGK3.js → chunk-FECCKVZV.js} +15 -3
  3. package/dist/{chunk-4SROXH24.js → chunk-RRG76BJM.js} +3 -1
  4. package/dist/{chunk-EYTYHIPM.js → chunk-UDJBGTFV.js} +3 -1
  5. package/dist/components/Box/Box.d.ts +22 -22
  6. package/dist/components/ConnectButton/formatAccountName.d.ts +14 -0
  7. package/dist/components/FunKeyValue/FunKeyValue.d.ts +2 -1
  8. package/dist/components/FunSelect/FunSelect.d.ts +2 -1
  9. package/dist/components/FunTransactionSummary/FunTransactionSummary.d.ts +3 -14
  10. package/dist/components/FunTransactionSummary/FunTxSummaryComponents.d.ts +11 -1
  11. package/dist/components/FunkitProvider/FunkitCheckoutContext.d.ts +2 -0
  12. package/dist/components/FunkitProvider/FunkitConfigContext.d.ts +19 -3
  13. package/dist/components/FunkitProvider/FunkitThemeProvider.d.ts +36 -0
  14. package/dist/components/Icons/ClockIcon.d.ts +3 -1
  15. package/dist/components/Icons/FunArrows.d.ts +0 -2
  16. package/dist/components/Icons/LightningIcon.d.ts +3 -1
  17. package/dist/consts/funkit.d.ts +1 -0
  18. package/dist/consts/payment.d.ts +1 -1
  19. package/dist/css/sprinkles.css.d.ts +41 -23
  20. package/dist/index.css +1395 -1302
  21. package/dist/index.js +2474 -2239
  22. package/dist/themes/baseTheme.d.ts +2 -1
  23. package/dist/themes/baseTheme.js +1 -1
  24. package/dist/themes/darkTheme.d.ts +9 -0
  25. package/dist/themes/darkTheme.js +2 -2
  26. package/dist/themes/lightTheme.d.ts +9 -0
  27. package/dist/themes/lightTheme.js +2 -2
  28. package/dist/wallets/walletConnectors/index.js +36 -36
  29. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,29 @@
1
1
  # @funkit/connect
2
2
 
3
+ ## 1.1.2
4
+
5
+ ### Patch Changes
6
+
7
+ - 891ab59: fix: conditional targetAssetTicker
8
+ - e5e0262: refactor: tx summary payment route field
9
+ - f765c12: feat: On checkout show chain information as seperate line items
10
+ - 17e31e8: feat: standardized truncation for account names
11
+
12
+ ## 1.1.1
13
+
14
+ ### Patch Changes
15
+
16
+ - 84f8dff: feat: new `optionsConfig` in `funkitConfig`
17
+ - 5225dc6: feat: new `optionBackgroundSecondary` color theme
18
+ - 84f8dff: refactor: standardize border radiuses across elements in `FunCheckoutModal`
19
+ - 77f159a: feat: dynamic time icon customization
20
+ - fe43c96: refactor: increase asset interval
21
+ - 12e62d9: feat: new `methodsConfig` to configure payment method icons and colors
22
+ - 12e62d9: refactor: more spacing and icon standardizations
23
+ - 21c11ba: feat: add `targetAssetTicker` to configuration
24
+ - 84f8dff: refactor: hover color changes for checkout input switcher
25
+ - 5225dc6: feat: custom themeing - fontWeights
26
+
3
27
  ## 1.1.0
4
28
 
5
29
  ### Minor Changes
@@ -15,7 +15,7 @@ var radiusScales = {
15
15
  },
16
16
  medium: {
17
17
  actionButton: "10px",
18
- connectButton: "8px",
18
+ connectButton: "10px",
19
19
  modal: "16px",
20
20
  modalMobile: "18px"
21
21
  },
@@ -26,8 +26,8 @@ var radiusScales = {
26
26
  modalMobile: "0px"
27
27
  },
28
28
  small: {
29
- actionButton: "4px",
30
- connectButton: "4px",
29
+ actionButton: "8px",
30
+ connectButton: "8px",
31
31
  modal: "8px",
32
32
  modalMobile: "8px"
33
33
  }
@@ -43,10 +43,18 @@ var blurs = {
43
43
  modalOverlay: "blur(4px)"
44
44
  }
45
45
  };
46
+ var DEFAULT_FONT_WEIGHTS = {
47
+ regular: "400",
48
+ medium: "500",
49
+ semibold: "600",
50
+ bold: "700",
51
+ heavy: "800"
52
+ };
46
53
  var baseTheme = ({
47
54
  borderRadius = "large",
48
55
  fontStack = "fun",
49
56
  customFontFamily = "",
57
+ customFontWeights = DEFAULT_FONT_WEIGHTS,
50
58
  overlayBlur = "none"
51
59
  }) => ({
52
60
  blurs: {
@@ -55,6 +63,10 @@ var baseTheme = ({
55
63
  fonts: {
56
64
  body: customFontFamily || fontStacks[fontStack]
57
65
  },
66
+ fontWeight: {
67
+ ...DEFAULT_FONT_WEIGHTS,
68
+ ...customFontWeights
69
+ },
58
70
  radii: {
59
71
  actionButton: radiusScales[borderRadius].actionButton,
60
72
  connectButton: radiusScales[borderRadius].connectButton,
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  baseTheme
4
- } from "./chunk-UK5FXGK3.js";
4
+ } from "./chunk-FECCKVZV.js";
5
5
 
6
6
  // src/themes/darkTheme.ts
7
7
  var accentColors = {
@@ -68,6 +68,8 @@ var darkTheme = ({
68
68
  inputFieldPrimary: "#FFF",
69
69
  inputFieldPlaceholder: "",
70
70
  inputFieldDisabled: "",
71
+ optionBackground: "rgba(255, 255, 255, 0.10)",
72
+ optionBackgroundSecondary: "transparent",
71
73
  strokePrimary: "",
72
74
  strokeSecondary: "",
73
75
  buttonPrimary: accentColor,
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  baseTheme
4
- } from "./chunk-UK5FXGK3.js";
4
+ } from "./chunk-FECCKVZV.js";
5
5
 
6
6
  // src/themes/lightTheme.ts
7
7
  var accentColors = {
@@ -68,6 +68,8 @@ var lightTheme = ({
68
68
  inputFieldPrimary: "#000000",
69
69
  inputFieldPlaceholder: "rgba(26, 27, 31, 0.60)",
70
70
  inputFieldDisabled: "#1A1B1F99",
71
+ optionBackground: "rgba(0, 0, 0, 0.05)",
72
+ optionBackgroundSecondary: "transparent",
71
73
  strokePrimary: "#0000000D",
72
74
  strokeSecondary: "",
73
75
  buttonPrimary: accentColor,
@@ -2,17 +2,17 @@ import { ClassValue } from 'clsx';
2
2
  import * as React from 'react';
3
3
  type HTMLProperties<T = HTMLElement> = Omit<React.AllHTMLAttributes<T>, 'as' | 'className' | 'color' | 'height' | 'width'>;
4
4
  export declare const Box: React.ForwardRefExoticComponent<{
5
- background?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | {
6
- base?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
7
- hover?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
8
- active?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
9
- selection?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
5
+ background?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | {
6
+ base?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
7
+ hover?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
8
+ active?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
9
+ selection?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
10
10
  } | undefined;
11
- borderColor?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | {
12
- base?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
13
- hover?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
14
- active?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
15
- selection?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
11
+ borderColor?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | {
12
+ base?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
13
+ hover?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
14
+ active?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
15
+ selection?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
16
16
  } | undefined;
17
17
  boxShadow?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | {
18
18
  base?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | undefined;
@@ -20,11 +20,11 @@ export declare const Box: React.ForwardRefExoticComponent<{
20
20
  active?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | undefined;
21
21
  selection?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | undefined;
22
22
  } | undefined;
23
- color?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | {
24
- base?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
25
- hover?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
26
- active?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
27
- selection?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
23
+ color?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | {
24
+ base?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
25
+ hover?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
26
+ active?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
27
+ selection?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "actionButtonDisabled" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "solidLine" | "leftTranslucentLine" | "rightTranslucentLine" | "loadingBase" | "loadingAccent" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "textPrimary" | "textSecondary" | "textTertiary" | "textDisabled" | "textSelection" | "inputFieldPrimary" | "inputFieldPlaceholder" | "inputFieldDisabled" | "optionBackground" | "optionBackgroundSecondary" | "strokePrimary" | "strokeSecondary" | "buttonPrimary" | "buttonProcessing" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextSecondary" | "buttonTextDisabled" | undefined;
28
28
  } | undefined;
29
29
  } & {
30
30
  alignItems?: "center" | "flex-end" | "flex-start" | {
@@ -47,17 +47,17 @@ export declare const Box: React.ForwardRefExoticComponent<{
47
47
  readonly fontSize?: "10" | "13" | "16" | "12" | "14" | "18" | "20" | "23" | "57" | undefined;
48
48
  readonly fontWeight?: "medium" | "bold" | "regular" | "semibold" | "heavy" | undefined;
49
49
  readonly gap?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
50
- readonly height?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "400" | "600" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "440" | "half" | "max" | undefined;
50
+ readonly height?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "400" | "440" | "600" | "half" | "max" | undefined;
51
51
  readonly justifyContent?: "center" | "space-around" | "space-between" | "flex-end" | "flex-start" | undefined;
52
- readonly textAlign?: "inherit" | "left" | "center" | undefined;
52
+ readonly textAlign?: "inherit" | "left" | "right" | "center" | undefined;
53
53
  readonly marginBottom?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
54
54
  readonly marginLeft?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
55
55
  readonly marginRight?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
56
56
  readonly marginTop?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
57
- readonly minHeight?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "400" | "600" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "440" | "half" | "max" | undefined;
58
- readonly maxHeight?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "400" | "600" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "440" | "half" | "max" | undefined;
59
- readonly maxWidth?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "400" | "600" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "440" | "half" | "max" | undefined;
60
- readonly minWidth?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "400" | "600" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "440" | "half" | "max" | undefined;
57
+ readonly minHeight?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "400" | "440" | "600" | "half" | "max" | undefined;
58
+ readonly maxHeight?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "400" | "440" | "600" | "half" | "max" | undefined;
59
+ readonly maxWidth?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "400" | "440" | "600" | "half" | "max" | undefined;
60
+ readonly minWidth?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "400" | "440" | "600" | "half" | "max" | undefined;
61
61
  readonly overflow?: "hidden" | undefined;
62
62
  readonly paddingBottom?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
63
63
  readonly paddingLeft?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
@@ -67,7 +67,7 @@ export declare const Box: React.ForwardRefExoticComponent<{
67
67
  readonly right?: "0" | undefined;
68
68
  readonly transition?: "transform" | "default" | undefined;
69
69
  readonly userSelect?: "none" | undefined;
70
- readonly width?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "400" | "600" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "440" | "half" | "max" | undefined;
70
+ readonly width?: "1" | "2" | "10" | "16" | "24" | "full" | "4" | "12" | "14" | "20" | "8" | "28" | "30" | "32" | "34" | "36" | "40" | "44" | "48" | "50" | "54" | "60" | "93" | "100" | "108" | "162" | "192" | "200" | "210" | "220" | "230" | "240" | "256" | "320" | "400" | "440" | "600" | "half" | "max" | undefined;
71
71
  readonly backdropFilter?: "modalOverlay" | undefined;
72
72
  margin?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
73
73
  marginX?: "0" | "1" | "2" | "3" | "6" | "10" | "16" | "24" | "4" | "12" | "14" | "18" | "20" | "8" | "28" | "30" | "32" | "36" | "44" | "-1" | "5" | "64" | undefined;
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Formats users' account name for display
3
+ * - If the account name is shorter than 15 characters, it will be displayed as is
4
+ * - If the account name is longer than 15 characters, it will be shortened to 12 characters + 3 ellipsis
5
+ * - Additionally, If it is an email, the suffix will be removed
6
+ *
7
+ * Examples:
8
+ * - `chloe@fun.xyz` -> `chloe@fun.xyz`
9
+ * - `longname@outlook.com` -> `longname`
10
+ * - `supersuperlongname@gmail.com` -> `supersuperlo...`
11
+ * - `@chloefunxyz` -> `@chloefunxyz`
12
+ * - `@chloefunxyzlongtwittername` -> `@chloefunxyz...`
13
+ */
14
+ export declare function formatAccountName(accountName: string, isEmail: boolean): string;
@@ -12,6 +12,7 @@ export interface FunKeyValueProps {
12
12
  keyTextColor?: BoxProps['color'];
13
13
  keyTextSize?: TextProps['size'];
14
14
  keyTextWeight?: TextProps['weight'];
15
+ keyGap?: BoxProps['gap'];
15
16
  keySectionMaxWidth?: BoxProps['maxWidth'];
16
17
  valueTextColor?: BoxProps['color'];
17
18
  valueTextSize?: TextProps['size'];
@@ -26,4 +27,4 @@ export interface FunKeyValueProps {
26
27
  isDisabled?: boolean;
27
28
  }
28
29
  export declare function FunKeyValue({ keyIcon, keyText, valueIcon, valueText, disclaimerText, onClick, hasBorder, backgroundBaseColor, // 'actionButtonSecondaryBackground'
29
- keyTextColor, keyTextSize, keyTextWeight, keySectionMaxWidth, valueTextColor, valueTextSize, valueTextWeight, valueGap, reverseValueItems, customValueComponent, disclaimerTextColor, paddingY, paddingX, isDisabled, }: FunKeyValueProps): React.JSX.Element;
30
+ keyTextColor, keyTextSize, keyTextWeight, keyGap, keySectionMaxWidth, valueTextColor, valueTextSize, valueTextWeight, valueGap, reverseValueItems, customValueComponent, disclaimerTextColor, paddingY, paddingX, isDisabled, }: FunKeyValueProps): React.JSX.Element;
@@ -6,7 +6,7 @@ export interface FunSelectOption {
6
6
  label: ReactNode;
7
7
  isDisabled: boolean;
8
8
  }
9
- export declare function FunSelectDropdown({ handleSelect, isDropdownOpen, options, selectedValue, containerPaddingY, containerMarginTop, optionItemPadding, showBorder, activeOptionBackgroundColor, }: {
9
+ export declare function FunSelectDropdown({ handleSelect, isDropdownOpen, options, selectedValue, containerPaddingY, containerMarginTop, optionItemPadding, showBorder, activeOptionBackgroundColor, baseOptionBackgroundColor, }: {
10
10
  handleSelect: (newValue: FunSelectOption['value']) => void;
11
11
  isDropdownOpen: boolean;
12
12
  options: FunSelectOption[];
@@ -16,6 +16,7 @@ export declare function FunSelectDropdown({ handleSelect, isDropdownOpen, option
16
16
  optionItemPadding?: BoxProps['padding'];
17
17
  showBorder?: boolean;
18
18
  activeOptionBackgroundColor?: BoxProps['background'];
19
+ baseOptionBackgroundColor?: BoxProps['background'];
19
20
  }): React.JSX.Element | null;
20
21
  interface FunSelectProps {
21
22
  initValue?: FunSelectOption['value'];
@@ -1,6 +1,4 @@
1
- import './FunTransactionSummary.css';
2
- import React, { ReactNode } from 'react';
3
- import { PaymentMethod } from '../../consts/payment';
1
+ import React from 'react';
4
2
  export type FeesItem = null | {
5
3
  totalUsd: string | number | null;
6
4
  transactionFeesUsd: string | number | null;
@@ -10,16 +8,7 @@ export type FeesItem = null | {
10
8
  platformFeesTokenAmount?: string | number | null;
11
9
  platformFeesTokenSymbol?: string | null;
12
10
  };
13
- export declare function FunTransactionSummary({ estFees, estTime, isLoading, hasTotal, total, hasPaymentToken, symbol, paymentTokenString, suffixComponent, errorMessage, paymentMethod, }: {
14
- estFees: FeesItem;
15
- estTime: string | number | null;
16
- isLoading?: boolean;
17
- hasTotal?: boolean;
18
- hasPaymentToken?: boolean;
19
- symbol?: string | null;
20
- paymentTokenString?: string;
21
- total?: string | number | null;
22
- suffixComponent?: ReactNode;
11
+ export declare function FunTransactionSummary({ checkoutId, errorMessage, }: {
12
+ checkoutId: string | null;
23
13
  errorMessage?: string;
24
- paymentMethod: PaymentMethod;
25
14
  }): React.JSX.Element;
@@ -1,8 +1,18 @@
1
- import React from 'react';
1
+ import './FunTxSummaryComponents.css';
2
+ import React, { ReactNode } from 'react';
2
3
  export declare function FunTxSummaryBox({ children }: {
3
4
  children: any;
4
5
  }): React.JSX.Element;
5
6
  export declare function FunTxSummaryLineItem({ children, ...otherProps }: any): React.JSX.Element;
7
+ export declare function FunTxSummaryLineItemCollapsibleTrigger({ children, isDisabled, onClick, }: {
8
+ children: ReactNode;
9
+ isDisabled: boolean;
10
+ onClick: () => void;
11
+ }): React.JSX.Element;
12
+ export declare function FunTxSummaryCollapsibleBox({ isExpanded, children, }: {
13
+ isExpanded: boolean;
14
+ children: ReactNode;
15
+ }): React.JSX.Element;
6
16
  export declare function FunTxSummaryLineItemKeyText({ text }: {
7
17
  text: string;
8
18
  }): React.JSX.Element;
@@ -28,6 +28,8 @@ export interface FunkitCheckoutConfig {
28
28
  targetAsset: Address;
29
29
  /** The amount of wanted asset for the checkout operation. **/
30
30
  targetAssetAmount: number;
31
+ /** The asset unit information for the wanted asset for the checkout operation **/
32
+ targetAssetTicker?: string;
31
33
  /** Timestamp (in milliseconds) after which the checkout should not be performed, and the funds will become rescuable. Min: 300000 (5 mins), Max: 3600000 (1 hour). **/
32
34
  expirationTimestampMs: number;
33
35
  /** Custom recipient address of the checkout. If specified, a different checkout flow will be executed. It is not recommended to set this unless the Fun.xyz team advises it. **/
@@ -1,4 +1,4 @@
1
- import { ReactNode } from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
  import { PaymentMethod } from '../../consts/payment';
3
3
  import { BoxProps } from '../Box/Box';
4
4
  import { FunkitSocialLoginMethod } from './FunkitWeb2Provider';
@@ -40,8 +40,24 @@ interface FunkitPaymentsConfig {
40
40
  allowBrokerageUnlinking?: boolean;
41
41
  /** Max width of the title of each payment method **/
42
42
  paymentTitleMaxWidth?: BoxProps['maxWidth'];
43
+ /** Payment method options styling **/
44
+ optionsConfig: {
45
+ /** Spacing between payment method and OTC options **/
46
+ optionsPrimaryGap: BoxProps['gap'];
47
+ /** Spacing between asset and exchange options **/
48
+ optionsSecondaryGap: BoxProps['gap'];
49
+ /** Vertical padding of each payment method option **/
50
+ optionsPadding: BoxProps['paddingY'];
51
+ };
52
+ methodsConfig: {
53
+ [paymentMethod: string]: {
54
+ icon: ReactNode;
55
+ speedIconColorBase: string;
56
+ speedIconColorActive: string;
57
+ };
58
+ };
43
59
  /** Custom OTC option with redirect links **/
44
- otcConfig?: {
60
+ otcConfig: {
45
61
  isEnabled: boolean;
46
62
  title: string;
47
63
  optionsList: {
@@ -87,6 +103,6 @@ interface FinalFunkitConfigInternal extends FunkitConfig {
87
103
  paymentsConfig: FunkitPaymentsConfig;
88
104
  privyAppId: string;
89
105
  }
90
- export declare const FunkitConfigContext: import("react").Context<FunkitConfig>;
106
+ export declare const FunkitConfigContext: React.Context<FunkitConfig>;
91
107
  export declare function useFunkitConfig(): FinalFunkitConfigInternal;
92
108
  export {};
@@ -47,6 +47,8 @@ export declare const defaultTheme: {
47
47
  inputFieldPrimary: string;
48
48
  inputFieldPlaceholder: string;
49
49
  inputFieldDisabled: string;
50
+ optionBackground: string;
51
+ optionBackgroundSecondary: string;
50
52
  strokePrimary: string;
51
53
  strokeSecondary: string;
52
54
  buttonPrimary: string;
@@ -70,6 +72,13 @@ export declare const defaultTheme: {
70
72
  walletLogo: string;
71
73
  };
72
74
  moonpayTheme: string;
75
+ fontWeight: {
76
+ regular: string;
77
+ medium: string;
78
+ semibold: string;
79
+ bold: string;
80
+ heavy: string;
81
+ };
73
82
  fonts: {
74
83
  body: string;
75
84
  };
@@ -144,6 +153,8 @@ export declare const useActiveTheme: () => {
144
153
  inputFieldPrimary: string;
145
154
  inputFieldPlaceholder: string;
146
155
  inputFieldDisabled: string;
156
+ optionBackground: string;
157
+ optionBackgroundSecondary: string;
147
158
  strokePrimary: string;
148
159
  strokeSecondary: string;
149
160
  buttonPrimary: string;
@@ -161,6 +172,13 @@ export declare const useActiveTheme: () => {
161
172
  fonts: {
162
173
  body: string;
163
174
  };
175
+ fontWeight: {
176
+ regular: string;
177
+ medium: string;
178
+ semibold: string;
179
+ bold: string;
180
+ heavy: string;
181
+ };
164
182
  radii: {
165
183
  actionButton: string;
166
184
  connectButton: string;
@@ -229,6 +247,8 @@ export declare const useActiveTheme: () => {
229
247
  inputFieldPrimary: string;
230
248
  inputFieldPlaceholder: string;
231
249
  inputFieldDisabled: string;
250
+ optionBackground: string;
251
+ optionBackgroundSecondary: string;
232
252
  strokePrimary: string;
233
253
  strokeSecondary: string;
234
254
  buttonPrimary: string;
@@ -246,6 +266,13 @@ export declare const useActiveTheme: () => {
246
266
  fonts: {
247
267
  body: string;
248
268
  };
269
+ fontWeight: {
270
+ regular: string;
271
+ medium: string;
272
+ semibold: string;
273
+ bold: string;
274
+ heavy: string;
275
+ };
249
276
  radii: {
250
277
  actionButton: string;
251
278
  connectButton: string;
@@ -313,6 +340,8 @@ export declare const useActiveTheme: () => {
313
340
  inputFieldPrimary: string;
314
341
  inputFieldPlaceholder: string;
315
342
  inputFieldDisabled: string;
343
+ optionBackground: string;
344
+ optionBackgroundSecondary: string;
316
345
  strokePrimary: string;
317
346
  strokeSecondary: string;
318
347
  buttonPrimary: string;
@@ -330,6 +359,13 @@ export declare const useActiveTheme: () => {
330
359
  fonts: {
331
360
  body: string;
332
361
  };
362
+ fontWeight: {
363
+ regular: string;
364
+ medium: string;
365
+ semibold: string;
366
+ bold: string;
367
+ heavy: string;
368
+ };
333
369
  radii: {
334
370
  actionButton: string;
335
371
  connectButton: string;
@@ -1,2 +1,4 @@
1
1
  import React from 'react';
2
- export declare const ClockIcon: () => React.JSX.Element;
2
+ export declare const ClockIcon: ({ color }: {
3
+ color?: string | undefined;
4
+ }) => React.JSX.Element;
@@ -1,5 +1,3 @@
1
1
  import React from 'react';
2
2
  export declare const FunDownArrow: () => React.JSX.Element;
3
3
  export declare const FunUpArrow: () => React.JSX.Element;
4
- export declare const FunNarrowRightArrow: () => React.JSX.Element;
5
- export declare const FunNarrowDownArrow: () => React.JSX.Element;
@@ -1,2 +1,4 @@
1
1
  import React from 'react';
2
- export declare const LightningIcon: () => React.JSX.Element;
2
+ export declare const LightningIcon: ({ color }: {
3
+ color?: string | undefined;
4
+ }) => React.JSX.Element;
@@ -13,6 +13,7 @@ export interface FunkitUserInfo {
13
13
  userId: string | null;
14
14
  accountLabel: string;
15
15
  accountName: string;
16
+ accountNameDisplay: string;
16
17
  accountPicSrc: string;
17
18
  }
18
19
  export interface FinalFunkitUserInfo extends FunkitUserInfo {
@@ -8,7 +8,7 @@ export declare enum PaymentFlow {
8
8
  export declare enum PaymentMethod {
9
9
  /** Moonpay - Credit / Debit Card **/
10
10
  CARD = "card",
11
- /** Direct Transfer **/
11
+ /** @deprecated Direct Transfer **/
12
12
  TRANSFER = "transfer",
13
13
  /** Account Balance **/
14
14
  ACCOUNT_BALANCE = "balance",