@funkit/connect 9.3.2 → 9.4.3

package/dist/components/Dropdown/BaseDropdown.css.d.ts

@@ -1,5 +1,5 @@
+export declare const SCROLL_GRADIENT_SIZE_PX = 48;
 export declare const BORDER_RADIUS = "dropdown";
-export declare const DROPDOWN_ANIMATION_DURATION = 150;
-export declare const dropdownBoxStyles: string;
 export declare const scrollableDropdownStyles: string;
+export declare const scrollGradientWrapperStyles: string;
 export declare const baseDropdownItemWrapperStyles: string;

package/dist/components/Dropdown/BaseDropdown.d.ts

@@ -1,21 +1,65 @@
 import React from 'react';
 import { type BoxProps } from '../Box/Box';
 import { type BaseActiveDropdownItemProps } from './BaseActiveDropdownItem';
+import './BaseDropdownAnimation.css';
 /** gap between the icon and the label of the item */
 export declare const HORIZONTAL_ICON_GAP = "4";
 /** safe spacing, ie. padding, on the left & right of the active item and dropdown item */
 export declare const HORIZONTAL_OUTER_PADDING_X = "12";
-export interface BaseDropdownOption<T = string> {
+export declare const NO_SELECTION_VALUE = "";
+export interface BaseDropdownOption<T = string, G extends string = never> {
     label: string;
     value: T;
+    /**
+     * For grouped dropdowns, this is the {@link BaseDropdownGroup.key} of the group this option belongs to.
+     *
+     * If omitted, or if no group has the key, the option is treated as ungrouped.
+     *
+     * _See {@link BaseDropdownProps.groups} and {@link BaseDropdownProps.showOthersGroup}_
+     */
+    group?: G;
+}
+export interface BaseDropdownGroup<G extends string> {
+    key: G;
+    label: string;
 }
-export interface BaseDropdownProps {
+export interface BaseDropdownProps<T = string, G extends string = never> {
     value: string;
     activeItemProps?: Partial<Pick<BaseActiveDropdownItemProps, 'iconComponent' | 'label' | 'color' | 'alwaysVisibleLabel' | 'tagComponent' | 'tagPosition' | 'background'>>;
-    options: BaseDropdownOption[];
+    /**
+     * List of groups to show and the corresponding labels, in the expected order.
+     *
+     * _Defaults to ungrouped dropdown behavior_
+     */
+    groups?: BaseDropdownGroup<G>[];
+    /**
+     * Additional group displayed after configured groups (only if there are non-empty groups).
+     * - "all": display all options (grouped options will effectively be shown twice in total)
+     * - "others": display only ungrouped options
+     *
+     * _Defaults to "others"_
+     */
+    additionalGroup?: 'all' | 'others';
+    /**
+     * Label for the {@link additionalGroup}.
+     *
+     * Shows only if the additional group is not empty.
+     */
+    additionalGroupLabel?: string;
+    /**
+     * If specified, show an "Unselect" option with value {@link NO_SELECTION_VALUE} above other options/groups
+     *
+     * _Defaults to `false`_
+     */
+    allowUnselect?: boolean;
+    /**
+     * Label for {@link allowUnselect}
+     */
+    unselectLabel?: string;
+    options: BaseDropdownOption<T, G>[];
     onOpen?: () => void;
-    onOptionSelected?: (item: BaseDropdownOption) => void;
-    renderDropdownOption: (item: BaseDropdownOption, isSelected: boolean) => React.ReactNode;
+    onOptionSelected?: (item: BaseDropdownOption<T, G>) => void;
+    renderDropdownOption: (item: BaseDropdownOption<T, G>, isSelected: boolean) => React.ReactNode;
     searchableOptions?: boolean;
     searchPlaceholder?: string;
     placeholder?: string;
@@ -37,5 +81,5 @@ export interface BaseDropdownProps {
     maxDropdownHeight?: number;
     testId?: string;
 }
-declare function BaseDropdown({ activeItemProps, value, options, onOptionSelected, onOpen, renderDropdownOption, searchableOptions, searchPlaceholder, placeholder, resetSearchOnClose, openToTopOnMobile, alwaysOpenToTop, openDropdownFullWidth, isLoading, preloadIconUrls, horizontalIconGap, openDropdownBackgroundColor, size, label, maxDropdownHeight, testId, }: BaseDropdownProps): React.JSX.Element;
+declare function BaseDropdown<T extends string = string, G extends string = never>({ activeItemProps, value, options, groups, additionalGroup, additionalGroupLabel, allowUnselect, unselectLabel, onOptionSelected, onOpen, renderDropdownOption, searchableOptions, searchPlaceholder, placeholder, resetSearchOnClose, openToTopOnMobile, alwaysOpenToTop, openDropdownFullWidth, isLoading, preloadIconUrls, horizontalIconGap, openDropdownBackgroundColor, size, label, maxDropdownHeight, testId, }: BaseDropdownProps<T, G>): React.JSX.Element;
 export default BaseDropdown;

package/dist/components/Dropdown/ChainDropdown.d.ts

@@ -4,7 +4,8 @@ import type { BaseActiveDropdownItemProps } from './BaseActiveDropdownItem';
 import { type BaseDropdownProps } from './BaseDropdown';
 interface ChainDropdownProps {
     assets: TokenTransferSourceChainsAndAssets;
-    chainIds?: number[];
+    /** Chain IDs in display order. If provided, determines the dropdown order. */
+    chainIdSortOrder?: number[];
     selectedChainId?: number;
     selectedToken?: string;
     onChainSelected: (chainId: number | undefined, 
@@ -23,6 +24,8 @@ interface ChainDropdownProps {
     maxDropdownHeight?: BaseDropdownProps['maxDropdownHeight'];
     tagComponent?: (value: string) => React.ReactNode;
     testId?: string;
+    /** Default chain ID — promoted to first position in the dropdown */
+    defaultChainId?: number;
 }
-export declare const ChainDropdown: ({ assets, chainIds: chains, selectedChainId: propSelectedChainId, selectedToken, allowUnselect, onChainSelected, activeItemProps, size, openDropdownBackgroundColor, openDropdownFullWidth, isLoading, alwaysOpenToTop, maxDropdownHeight, tagComponent, testId, }: ChainDropdownProps) => React.JSX.Element;
+export declare const ChainDropdown: ({ assets, chainIdSortOrder, selectedChainId: propSelectedChainId, selectedToken, allowUnselect, onChainSelected, activeItemProps, size, openDropdownBackgroundColor, openDropdownFullWidth, isLoading, alwaysOpenToTop, maxDropdownHeight, tagComponent, testId, defaultChainId, }: ChainDropdownProps) => React.JSX.Element;
 export {};

package/dist/components/Dropdown/TokenAndChainDropdown.d.ts

@@ -26,7 +26,13 @@ interface TokenAndChainDropdownProps {
      * Override to hide the new token badge
      */
     hideNewTokenBadge?: boolean;
+    /** Token symbols to prioritize at top of dropdown */
+    priorityTokenSymbols?: string[];
+    /** Determines the chain display order */
+    chainIdSortOrder?: number[];
+    /** Default chain ID — promoted to first position in chain dropdown */
+    defaultChainId?: number;
 }
 /** Combines together chain and token dropdowns */
-export declare const TokenAndChainDropdown: ({ isLoading, selectedToken, selectedChainId, assets, onTokenSelected, onChainSelected, tokenLabel, chainLabel, chainLabelAddon, alwaysOpenToTop, maxTokenDropdownHeight, maxChainDropdownHeight, openChainDropdownFullWidth, chainTagComponent, hideNewTokenBadge, }: TokenAndChainDropdownProps) => React.JSX.Element;
+export declare const TokenAndChainDropdown: ({ isLoading, selectedToken, selectedChainId, assets, onTokenSelected, onChainSelected, tokenLabel, chainLabel, chainLabelAddon, alwaysOpenToTop, maxTokenDropdownHeight, maxChainDropdownHeight, openChainDropdownFullWidth, chainTagComponent, hideNewTokenBadge, priorityTokenSymbols, chainIdSortOrder, defaultChainId, }: TokenAndChainDropdownProps) => React.JSX.Element;
 export {};

package/dist/components/Dropdown/TokenDropdown.d.ts

@@ -17,10 +17,12 @@ interface TokenDropdownProps {
      * Override to hide the new token badge
      */
     hideNewTokenBadge?: boolean;
+    /** Token symbols to prioritize at top of dropdown */
+    priorityTokenSymbols?: string[];
     /**
      * Test ID for the token dropdown
      */
     testId?: string;
 }
-export declare const TokenDropdown: ({ assets, selectedChainId, selectedToken, onTokenSelected, isLoading, alwaysOpenToTop, maxDropdownHeight, hideNewTokenBadge, testId, }: TokenDropdownProps) => React.JSX.Element;
+export declare const TokenDropdown: ({ assets, selectedChainId, selectedToken, onTokenSelected, isLoading, alwaysOpenToTop, maxDropdownHeight, hideNewTokenBadge, priorityTokenSymbols, testId, }: TokenDropdownProps) => React.JSX.Element;
 export {};

package/dist/components/FunCheckoutBlocked/FunCheckoutBlocked.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-type CheckoutBlockedReason = 'geoblock' | 'security' | 'unloggedin';
+import type { CheckoutBlockedReason } from '../../modals/CheckoutModal/CheckoutBlockedReason';
 interface FunCheckoutBlockedProps {
     reason: CheckoutBlockedReason;
 }
-export declare const FunCheckoutBlocked: ({ reason }: FunCheckoutBlockedProps) => React.JSX.Element;
+export declare const FunCheckoutBlocked: ({ reason }: FunCheckoutBlockedProps) => React.JSX.Element | null;
 export {};

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

@@ -6,4 +6,5 @@ export declare const inputClassNoTransition: string;
 export declare const inputClassDisabled: string;
 export declare const inputClassDisabledNoTransition: string;
 export declare const inputClassError: string;
+export declare const hoverWithParentInput: string;
 export declare const inputClassErrorNoTransition: string;

package/dist/components/ModalHeightAnimationLayer/WithdrawalModalHeightAnimationWrapper.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WithdrawalModalStep } from '../../modals/WithdrwalModal/types';
+import { WithdrawalModalStep } from '../../modals/WithdrawalModal/types';
 interface WithdrawalModalHeightAnimationWrapperProps {
     children: React.ReactNode;
     withdrawalStep: WithdrawalModalStep;

package/dist/components/NewTokenDepositAlert/NewTokenDepositAlert.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { TransferTokenDefault } from '../../hooks/useTokenChain';
+import type { TransferTokenDefault } from '../../hooks/useTokenAndChainDropdown';
 interface NewTokenDepositAlertProps {
     onClick: (value: TransferTokenDefault) => void;
 }

package/dist/components/Tabs/Tabs.d.ts

@@ -17,6 +17,7 @@ export type TabsProps = {
     fontWeight?: BoxProps['fontWeight'];
     fontSize?: BoxProps['fontSize'];
     activeTabStyles?: React.CSSProperties;
+    inactiveTabProps?: BoxProps;
     containerStyles?: React.CSSProperties;
 };
 export declare const Tabs: React.FC<TabsProps>;

package/dist/components/Tabs/tabs.css.d.ts

@@ -2,4 +2,4 @@ export declare const tabSlideContentIn: string;
 export declare const tabSlideContentOut: string;
 export declare const tabSlideContentInReverse: string;
 export declare const tabSlideContentOutReverse: string;
-export declare const activeTabStyle: string;
+export declare const baseTabStyle: string;

package/dist/config/getDefaultConfig.d.ts

@@ -13,7 +13,7 @@ export interface CreateFunkitWagmiConfigParameters extends WagmiConfigParameters
     wallets?: WalletList;
     projectId: string;
 }
-export declare const createFunkitWagmiConfig: (rawWagmiConfig: CreateFunkitWagmiConfigParameters) => import("../wagmi/hooks").Config;
+export declare const createFunkitWagmiConfig: (rawWagmiConfig: CreateFunkitWagmiConfigParameters) => import("wagmi").Config;
 /**
  * Get default funkit-supported checkout chains
  */