@funkit/connect 3.0.0-next.7 → 3.0.0

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # @funkit/connect
 
+## 3.0.0
+
+### Major Changes
+
+- 9c1c09a: paymentsConfig is removed from FunkitConfig. defaultPaymentMethod is added to useCheckout config
+- ca9c5a0: remove unused config in FunkitPaymentsConfig
+- c0d142d: feat: v3 upgrade - phase 1 - baseline styles, themes, configuration
+- 19404b9: refactor: FunkitCheckoutConfig interface - deprecated `checkoutItemDescription` and updated `targetAssetTicker` to be a required field.
+
+### Patch Changes
+
+- 540e9bf: v3 repolishes
+- cd8633c: v3 scrollbar tweaks
+- d96708a: v3 custom button switcher polishes
+- 30bdef9: v3 updates
+- 7d5b095: v3 repolishes
+- af98f01: v3 updates
+- 9e70418: v3 repolishes
+- 2e17b41: v3 upgrades
+- Updated dependencies [30bdef9]
+- Updated dependencies [9ccdeb1]
+- Updated dependencies [c0d142d]
+- Updated dependencies [cee3715]
+- Updated dependencies [af98f01]
+- Updated dependencies [e8e412d]
+  - @funkit/api-base@1.0.2
+  - @funkit/core@2.1.2
+  - @funkit/wagmi-tools@3.0.4
+
+## 3.0.0-next.8
+
+### Patch Changes
+
+- v3 scrollbar tweaks
+
 ## 3.0.0-next.7
 
 ### Patch Changes

package/dist/{chunk-Z3QREJ3Q.js → chunk-EUSK63OY.js}

@@ -69,7 +69,7 @@ var darkTheme = ({
     buttonPrimary: accentColor,
     buttonDisabled: "rgba(255, 255, 255, 0.20)",
     buttonTextPrimary: "#000000",
-    buttonTextDisabled: "#595959",
+    buttonTextDisabled: "#000000",
     buttonWarning: accentColors.red.accentColor,
     buttonSuccess: "#2EA200",
     buttonTextWarning: "#FFFFFF",

package/dist/components/AccountModal/AccountModal.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
+import { SelectedHomeTab } from '../ProfileDetails/FunProfileViews/Home';
 export interface AccountModalProps {
     open: boolean;
     onClose: () => void;
+    defaultTab: SelectedHomeTab | null;
 }
-export declare function AccountModal({ onClose, open }: AccountModalProps): React.JSX.Element | null;
+export declare function AccountModal({ onClose, open, defaultTab }: AccountModalProps): React.JSX.Element | null;

package/dist/components/FunButton/FunButton.css.d.ts

@@ -2,5 +2,6 @@ export declare const funLinkButtonStyle: string;
 export declare const transitionStyles: string;
 export declare const pressedStyles: string;
 export declare const funIconButtonClickableStyle: string;
+export declare const funIconButtonNonClickableStyle: string;
 export declare const funIconButtonDisabledStyle: string;
 export declare const rotateStyle: string;

package/dist/components/FunButton/FunIconButton.d.ts

@@ -22,9 +22,8 @@ export interface FunIconButtonProps {
     isDisabled?: boolean;
     borderRadius?: BoxProps['borderRadius'];
     style?: BoxProps['style'];
-    disableHoverStyles?: boolean;
     children?: React.ReactNode;
     /** Defaults to 'quiet' */
     variant?: 'quiet' | 'outlined';
 }
-export declare const FunIconButton: ({ children, onClick, icon, size, width, gap, ariaLabel, color, as, isDisabled, borderRadius, style, disableHoverStyles, variant, ...props }: FunIconButtonProps) => React.JSX.Element;
+export declare const FunIconButton: ({ children, onClick, icon, size, width, gap, ariaLabel, color, as, isDisabled, borderRadius, style, variant, ...props }: FunIconButtonProps) => React.JSX.Element;

package/dist/components/FunCheckoutHistoryModal/FunCheckoutHistoryContent.d.ts

@@ -7,5 +7,6 @@ interface FunCheckoutHistoryContentProps {
     onBackFromHelpPage: () => void;
 }
 export declare const HELP_SCREEN_BOTTOM_BAR_ID = "help-screen-bottom-section";
+export declare const DEFAULT_CHECKOUT_HISTORY_DETAIL_TITLE = "Your Purchase";
 export declare function FunCheckoutHistoryContent({ depositAddress, currentPage, setCurrentPage, onBackFromHelpPage, }: FunCheckoutHistoryContentProps): React.JSX.Element;
 export {};

package/dist/components/FunInput/FunTextAreaInput.d.ts

@@ -3,5 +3,5 @@ import { FunInputProps } from './FunInput';
 interface FunTextAreaInputProps extends FunInputProps<HTMLTextAreaElement> {
     hasBackground?: boolean;
 }
-export declare function FunTextAreaInput({ placeholder, value, label, onChange, onKeyDown, onKeySubmit, textColor, inputStyle, inputProps, error, overrideBorderWidth, }: FunTextAreaInputProps): React.JSX.Element;
+export declare function FunTextAreaInput({ placeholder, value, label, onChange, onKeyDown, onKeySubmit, textColor, inputStyle, inputProps, error, overrideBorderWidth, overrideBackground, }: FunTextAreaInputProps): React.JSX.Element;
 export {};

package/dist/components/FunkitProvider/FunkitConfigContext.d.ts

@@ -1,16 +1,10 @@
 import { FunkitPrioritizedLoginType, FunkitSocialLoginMethod } from '../../consts/funkit';
 export interface FunkitTextCustomizationsConfig {
-    /** @deprecated   */
-    selectPaymentMethod: string;
     brokerageOrExchange: string;
     debitOrCredit: string;
     accountBalance: string;
     transferCrypto: string;
     selectAccount: string;
-    /** @deprecated   */
-    enterPaymentInfo: string;
-    payWith: string;
-    otc: string;
 }
 export declare const DEFAULT_TEXT_CUSTOMIZATIONS: FunkitTextCustomizationsConfig;
 interface FunkitLoginOptionsConfig {

package/dist/components/FunkitProvider/ModalContext.d.ts

@@ -1,4 +1,5 @@
 import React, { ReactNode } from 'react';
+import { SelectedHomeTab } from '../ProfileDetails/FunProfileViews/Home';
 interface ModalProviderProps {
     children: ReactNode;
 }
@@ -10,7 +11,7 @@ export declare function useModalState(): {
 };
 export declare function useAccountModal(): {
     accountModalOpen: boolean;
-    openAccountModal: (() => void) | undefined;
+    openAccountModal: ((tab: SelectedHomeTab | null) => void) | undefined;
 };
 export declare function useChainModal(): {
     chainModalOpen: boolean;

package/dist/components/Icons/Spinner.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-export declare const SpinnerIcon: ({ height, width, }: {
-    width?: string | number;
-    height?: string | number;
+export declare const SpinnerIcon: ({ size }: {
+    size?: string | number;
 }) => React.JSX.Element;

package/dist/components/ProfileDetails/ProfileDetails.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { SelectedHomeTab } from './FunProfileViews/Home';
 export declare const PROFILE_SIDE_PADDING = "18";
 export declare enum FunProfileView {
     HOME = 0,
@@ -8,6 +9,7 @@ export declare enum FunProfileView {
 }
 interface ProfileDetailsProps {
     onClose: () => void;
+    defaultTab: SelectedHomeTab | null;
 }
-export declare function ProfileDetails({ onClose }: ProfileDetailsProps): React.JSX.Element;
+export declare function ProfileDetails({ onClose, defaultTab }: ProfileDetailsProps): React.JSX.Element;
 export {};

package/dist/hooks/useAnimatedNavigation.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Logic for easier animations during navigation
+ * @param callback - Called when utilizing the navigateTo function. Without providing it the navigateTo function will not work
+ * animate is a more generic version of navigateTo that can be used if the callback is not known during hook initialization. Or if it differs.
+ */
+export declare function useAnimatedNavigation<T>(callback: ((page: T) => void) | undefined): {
+    animateOut: boolean;
+    navigateTo: (page: T) => void;
+    animate: (callback: () => void) => void;
+};

package/dist/hooks/useCheckoutModalTitle.d.ts

@@ -0,0 +1,2 @@
+import { Address } from 'viem';
+export declare function useCheckoutModalTitle(depositAddress: Address, defaultTitle: string): string;

package/dist/hooks/useMesh.d.ts

@@ -4,6 +4,7 @@ import { FunSelectOption } from '../components/FunSelect/FunSelect';
 import { PaymentMethodInfo } from '../consts/payment';
 import { MeshExchanges } from '../utils/mesh';
 export declare const getMeshExchangeIconMap: (size?: number) => Partial<Record<MeshExchanges, ReactNode>>;
+export declare const getSupportedExchanges: () => MeshExchanges[];
 export declare const useMeshExchanges: ({ fullInfo, iconSize, }: {
     fullInfo?: boolean;
     iconSize?: number;

package/dist/index.css

@@ -5854,7 +5854,7 @@
   }
 }
 
-/* vanilla-extract-css-ns:src/components/Dialog/DialogContent.css.ts.vanilla.css?source=#H4sIAAAAAAAAE7VU0W7CIBR99ytushd9wNTWaoMvy75h7wsFFCItDVDbbvHfF1pt2jo3l2VPhJtzzznAPSzfVsW7W4fRCj5mABmpkeDyIByGOIyLencpVpI5gWEVBKfK1y77dRx4zHm27HmwIHb+xBpWo4I0Gc8dspV0VHCzuNFI4mjSH3YYmV8lo06il4xuJNdtS6oN46Y3OuigRNF56xwQREFRL3ZTG4E9iRHnpuXUJ272SleoxiAkYzzfDasNBlI67WuWGq1USgw6lM5xg8E6kio+JsUYVTw9SoecIfTY+Sb0eDC6zBmiWmmD4UTMHCFz7PYWZZoR9dLDFvc4ew8t7+Xwm+7y/kEFOVFm6fDuDWGytANqX5Ad8+IxF5ZTnTNimldeu7GH7Q8e/nbC++xY+Ad/UOMb/0lLwaQtFGkw7BVvX8aviEnDqZM6x0C1KrN2zq7T6Ud3PJ3Jr0IWbeMuMc8ZZ5L4WeU8B5IzmA+Ctt0kRd11L8e/wjTuAOchKLyAvgrtNLa+9fwJko7rSXUEAAA= */
+/* vanilla-extract-css-ns:src/components/Dialog/DialogContent.css.ts.vanilla.css?source=#H4sIAAAAAAAAE7VUzY7bIBC+5ylG2ktyIHLiOInIpdpn2HuFYTagYLAAx3arvHuF7Vh2dlebqurJYpjvB/MN65+b8lfYbdMN/F4AFKwhEtVZBgrZNiub01CslQiSwiZJrnWsDetdlsSe22I98lDJ/PJFtKIhJWsLNIH4WgUu0a0+aByz9AG/7XuUuUumvcQomX6Q3HWQ3DqBbjQ6QXCm+bJzDgTSpGxWp0cbib/KGee+47RXdO/a1qShIJUQaE7TakuBVcHGmufOap0zR85VCOgo+MByjfO9wVBlPIa5HKWkxvyiAgmO8Ut/IsYvZ2crIwi32joKV+aWhLhLv/aksILp17Ft9RXn6KDjHVzs+9/6H1RIkFWRT2/FMaEqP6GOBdUzr55zEdAFxVz7hk2YWzh8Y+HfDvg1O5UxCU9qeOTWiE/9HzsKoXypWUvhXWN3MfFLhHLIg7KGAre6KroA3mMbMz2P7fGvpi89ZP0o/ShQKBaDimiAGQHLyQQe9sey6dHr+XPx+A4A3KZN26Hps2l+nOcIvf0BPEzLz44EAAA= */
 [data-rk] ._1pzt4231 {
   max-height: 525px;
   max-width: 100vw;
@@ -5876,6 +5876,7 @@
   overflow-x: hidden;
   overflow-y: auto;
   scrollbar-gutter: stable;
+  scrollbar-width: unset;
 }
 [data-rk] ._1pzt4236::-webkit-track {
   background-color: var(--rk-colors-modalBackground);
@@ -5886,7 +5887,7 @@
 }
 [data-rk] ._1pzt4236::-webkit-scrollbar-thumb {
   border-radius: var(--rk-radii-modal);
-  background-color: var(--rk-colors-secondaryText);
+  background-color: var(--rk-colors-tertiaryText);
 }
 [data-rk] ._1pzt4237::-webkit-scrollbar-thumb {
   background-color: var(--rk-colors-modalBackground);
@@ -5986,8 +5987,8 @@
   --_7rkubb1: 0.9;
 }
 
-/* vanilla-extract-css-ns:src/components/FunButton/FunButton.css.ts.vanilla.css?source=QGtleWZyYW1lcyBfMXR5eDVudTYgewogIDAlIHsKICAgIHRyYW5zZm9ybTogcm90YXRlKDBkZWcpOwogIH0KICAzMyUgewogICAgdHJhbnNmb3JtOiByb3RhdGUoMjAwZGVnKTsKICB9CiAgNjYlIHsKICAgIHRyYW5zZm9ybTogcm90YXRlKDE2MGRlZyk7CiAgfQogIDEwMCUgewogICAgdHJhbnNmb3JtOiByb3RhdGUoMTgwZGVnKTsKICB9Cn0KLl8xdHl4NW51MSB7CiAgY3Vyc29yOiBwb2ludGVyOwp9Ci5fMXR5eDVudTE6aG92ZXIgewogIHRleHQtZGVjb3JhdGlvbi1saW5lOiB1bmRlcmxpbmU7Cn0KLl8xdHl4NW51MiB7CiAgdHJhbnNpdGlvbjogYWxsIDE1MG1zIGN1YmljLWJlemllcigwLjMsIDAsIDAuMDYsIDEpOwp9Ci5fMXR5eDVudTM6YWN0aXZlIHsKICB0cmFuc2Zvcm06IHNjYWxlKDAuOTgpOwp9Ci5fMXR5eDVudTQgewogIGN1cnNvcjogcG9pbnRlcjsKfQouXzF0eXg1bnU0OmZvY3VzLXZpc2libGUgewogIGJvcmRlci13aWR0aDogMnB4Owp9Ci5fMXR5eDVudTUgewogIGN1cnNvcjogbm90LWFsbG93ZWQ7Cn0KLl8xdHl4NW51NyB7CiAgYW5pbWF0aW9uOiBfMXR5eDVudTYgMXM7Cn0= */
-@keyframes _1tyx5nu6 {
+/* vanilla-extract-css-ns:src/components/FunButton/FunButton.css.ts.vanilla.css?source=QGtleWZyYW1lcyBfMXR5eDVudTcgewogIDAlIHsKICAgIHRyYW5zZm9ybTogcm90YXRlKDBkZWcpOwogIH0KICAzMyUgewogICAgdHJhbnNmb3JtOiByb3RhdGUoMjAwZGVnKTsKICB9CiAgNjYlIHsKICAgIHRyYW5zZm9ybTogcm90YXRlKDE2MGRlZyk7CiAgfQogIDEwMCUgewogICAgdHJhbnNmb3JtOiByb3RhdGUoMTgwZGVnKTsKICB9Cn0KLl8xdHl4NW51MSB7CiAgY3Vyc29yOiBwb2ludGVyOwp9Ci5fMXR5eDVudTE6aG92ZXIgewogIHRleHQtZGVjb3JhdGlvbi1saW5lOiB1bmRlcmxpbmU7Cn0KLl8xdHl4NW51MiB7CiAgdHJhbnNpdGlvbjogYWxsIDE1MG1zIGN1YmljLWJlemllcigwLjMsIDAsIDAuMDYsIDEpOwp9Ci5fMXR5eDVudTM6YWN0aXZlIHsKICB0cmFuc2Zvcm06IHNjYWxlKDAuOTgpOwp9Ci5fMXR5eDVudTQgewogIGN1cnNvcjogcG9pbnRlcjsKfQouXzF0eXg1bnU0OmZvY3VzLXZpc2libGUgewogIGJvcmRlci13aWR0aDogMnB4Owp9Ci5fMXR5eDVudTUgewogIGN1cnNvcjogZGVmYXVsdDsKfQouXzF0eXg1bnU2IHsKICBjdXJzb3I6IG5vdC1hbGxvd2VkOwp9Ci5fMXR5eDVudTggewogIGFuaW1hdGlvbjogXzF0eXg1bnU3IDFzOwp9 */
+@keyframes _1tyx5nu7 {
   0% {
     transform: rotate(0deg);
   }
@@ -6020,10 +6021,13 @@
   border-width: 2px;
 }
 [data-rk] ._1tyx5nu5 {
+  cursor: default;
+}
+[data-rk] ._1tyx5nu6 {
   cursor: not-allowed;
 }
-[data-rk] ._1tyx5nu7 {
-  animation: _1tyx5nu6 1s;
+[data-rk] ._1tyx5nu8 {
+  animation: _1tyx5nu7 1s;
 }
 
 /* vanilla-extract-css-ns:src/components/FunBottomBar/FunBottomBar.css.ts.vanilla.css?source=Lm41cXdpMCB7CiAgcGFkZGluZy10b3A6IDE4cHg7CiAgJjpub3QoOmVtcHR5KSA+IDpmaXJzdC1jaGlsZCB7CiAgICBtYXJnaW4tdG9wOiAtNnB4OwogIH0KfQ== */
@@ -6303,6 +6307,16 @@ input[type=number] {
   background: unset;
 }
 
+/* vanilla-extract-css-ns:src/components/FunAssetAvatar/FunAssetAvatar.css.ts.vanilla.css?source=LnV3cmRjMjAgewogIHBvc2l0aW9uOiByZWxhdGl2ZTsKfQoudXdyZGMyMyB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIGJvdHRvbTogMDsKICByaWdodDogMDsKfQ== */
+[data-rk] .uwrdc20 {
+  position: relative;
+}
+[data-rk] .uwrdc23 {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+
 /* vanilla-extract-css-ns:src/components/FunCheckoutHistoryModal/FunCheckoutHistoryTransaction.css.ts.vanilla.css?source=Ll84YmVqYW4wIHsKICBtYXgtaGVpZ2h0OiAyNTBweDsKICBvdmVyZmxvdzogaGlkZGVuOwp9Ci5fOGJlamFuMSB7CiAgdHJhbnNpdGlvbjogYWxsIDAuNHMgZWFzZS1vdXQ7CiAgbWF4LWhlaWdodDogMDsKICBvdmVyZmxvdzogaGlkZGVuOwp9Ci5fOGJlamFuMiB7CiAgd2lkdGg6IDEwMCU7CiAgYm9yZGVyLXN0eWxlOiBzb2xpZDsKICBib3JkZXItdG9wLXdpZHRoOiAxcHg7Cn0= */
 [data-rk] ._8bejan0 {
   max-height: 250px;
@@ -6333,16 +6347,6 @@ input[type=number] {
   overflow: hidden;
 }
 
-/* vanilla-extract-css-ns:src/components/FunAssetAvatar/FunAssetAvatar.css.ts.vanilla.css?source=LnV3cmRjMjAgewogIHBvc2l0aW9uOiByZWxhdGl2ZTsKfQoudXdyZGMyMyB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIGJvdHRvbTogMDsKICByaWdodDogMDsKfQ== */
-[data-rk] .uwrdc20 {
-  position: relative;
-}
-[data-rk] .uwrdc23 {
-  position: absolute;
-  bottom: 0;
-  right: 0;
-}
-
 /* vanilla-extract-css-ns:src/css/scrollStyles.css.ts.vanilla.css?source=Ll8xNjNlaG1rMDo6LXdlYmtpdC1zY3JvbGxiYXIgewogIGRpc3BsYXk6IG5vbmU7Cn0= */
 [data-rk] ._163ehmk0::-webkit-scrollbar {
   display: none;