@funkit/connect
Version:
Funkit Connect SDK elevates DeFi apps via web2 sign-ins and one-click checkouts.
42 lines (41 loc) • 2.28 kB
TypeScript
import React from 'react';
import { type BoxProps } from '../Box/Box';
import { type BaseActiveDropdownItemProps } from './BaseActiveDropdownItem';
/** 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> {
label: string;
value: T;
}
export interface BaseDropdownProps {
value: string;
activeItemProps?: Partial<Pick<BaseActiveDropdownItemProps, 'iconComponent' | 'label' | 'color' | 'alwaysVisibleLabel' | 'tagComponent' | 'tagPosition' | 'background'>>;
options: BaseDropdownOption[];
onOpen?: () => void;
onOptionSelected?: (item: BaseDropdownOption) => void;
renderDropdownOption: (item: BaseDropdownOption, isSelected: boolean) => React.ReactNode;
searchableOptions?: boolean;
searchPlaceholder?: string;
placeholder?: string;
resetSearchOnClose?: boolean;
openToTopOnMobile?: boolean;
alwaysOpenToTop?: boolean;
openDropdownFullWidth?: boolean;
preloadIconUrls?: string[];
horizontalIconGap?: BoxProps['gap'];
openDropdownBackgroundColor?: BoxProps['background'];
size?: BaseActiveDropdownItemProps['size'];
isLoading?: boolean;
label?: string;
/**
* If provided, the dropdown will be scrollable and the max height will be set to the provided value.
* This is useful for dropdowns that have a lot of options and normally would be too tall to fit in the modal and overflow beyond the modal is not supported right now.
* This values should be set so that the last dropdown item is partially visible to indicate that there are more options.
*/
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;
export default BaseDropdown;