import * as React from 'react'; import { CustomEventHandler, CustomRender, SomeObject, TransformSuggestionToMatchFilter } from '../../commonTypes'; import { COMPONENTS_NAMESPACES } from '../../constants'; import { SuggestionListProps } from '../../src/SuggestionList/types'; import { GlobalDefaultTheme, PartialGlobalDefaultTheme } from '../../utils/useTheme'; import { DivProps } from '../Div'; import { SpanProps } from '../Span'; import { ValidationProps } from '../Validation/types'; import { EnterPressEvent } from '../Input/types'; export declare type Value = SomeObject | string | number | null; export interface ChangeMouseEvent extends React.MouseEvent { component: { name?: string; value: T; }; } export interface ChangeKeyboardEvent extends React.KeyboardEvent { component: { name?: string; value: T; }; } export interface ExtendedChangeEvent extends React.ChangeEvent { component: { name?: string; value: T; }; } export interface ResetChangeEvent { component: { name?: string; value: T; }; } export declare type ChangeEvent = ChangeMouseEvent | ChangeKeyboardEvent | ExtendedChangeEvent | ResetChangeEvent; export interface BlurEvent extends React.FocusEvent { component: { isValid: boolean; name?: string; value: T; }; } export interface FocusEvent extends React.FocusEvent { component: { name?: string; value: T; }; } export interface DropDownSelectProps extends ValidationProps { [x: string]: unknown; autoComplete?: string; boundingContainerRef?: React.RefObject; compareObjectsBy?: T extends object ? ((suggestionListItem: T) => any) | string : never; data?: T[]; defaultValue?: Value; filterRule?: FilterRules; filterValue?: string; groupBy?: (option: T) => string | undefined; hasClearButton?: boolean; iconRender?: CustomRender, DropDownSelectState, SpanProps>; inputRender?: CustomRender, DropDownSelectState, React.InputHTMLAttributes>; isDisabled?: boolean; isLoading?: boolean; isOpen?: boolean; itemRender?: SuggestionListProps['itemRender']; listRender?: SuggestionListProps['listRender']; noSuggestionsRender?: SuggestionListProps['noSuggestionsRender']; onBlur?: CustomEventHandler>; onChange?: CustomEventHandler>; onEnterPress?: (ev: EnterPressEvent) => void; onFilterChange?: CustomEventHandler>; onFocus?: CustomEventHandler>; placeholder?: string; ref?: React.Ref; /** Fields, when containing search data */ searchFields?: string[]; shouldAllowEmpty?: boolean; shouldFilterValues?: boolean; /** Сортировка выпадающего списка */ sortSuggestions?: (a: T, b: T) => number; textField?: T extends object ? string : never; theme?: PartialGlobalDefaultTheme[typeof COMPONENTS_NAMESPACES.dropDownSelect]; /** Eliminates differences between suggestions from filtered list and value in input */ transformSuggestionToMatchFilter?: TransformSuggestionToMatchFilter; value?: T | null; wrapperRender?: CustomRender, DropDownSelectState, DivProps>; } export interface DropDownSelectState { filterValue: string | null; highlightedSuggestion: Value; isFocused: boolean; isOpen: boolean; selectedSuggestion: Value; value: string | number | SomeObject | null; } export interface DropDownSelectRefCurrent { input: HTMLInputElement | null; wrapper: HTMLElement | null; } export interface GetComponentClassNames { (data: { className?: string; isDisabled?: boolean; isFocused?: boolean; isOpen?: boolean; isRequired?: boolean; isValid?: boolean; theme: GlobalDefaultTheme[typeof COMPONENTS_NAMESPACES.dropDownSelect]; value: string | number | SomeObject | null; }): { inputWrapperClassNames?: string; selectIconClassNames?: string; wrapperClassNames?: string; }; } export interface HandlerCreatorData { inputRef: React.MutableRefObject; mergeState: (state: Partial) => void; props: DropDownSelectProps; state: DropDownSelectState; validate: (value?: string | number | SomeObject | null) => boolean; value: DropDownSelectState['value']; } export declare type ChangeHandler = CustomEventHandler & { target: { value: string | number | SomeObject; }; }>; export declare type BlurHandler = CustomEventHandler>; export declare type FocusHandler = CustomEventHandler>; export declare type IconClickHandler = CustomEventHandler>; export declare type KeyDownHandler = CustomEventHandler>; export declare type FilterChangeHandler = CustomEventHandler>; export declare type ClearIconClickHandler = CustomEventHandler>; export interface CustomElements { Icon: React.FC; Input: React.FC & React.RefAttributes>; Wrapper: React.FC; } export declare type FilterRules = 'smart' | 'startsWith' | 'includes'; export interface FilterDataProps { data: DropDownSelectProps['data']; filterRule?: FilterRules; searchFields?: string[]; textField?: string; /** Eliminates differences between suggestions from filtered list and value in input */ transformSuggestionToMatchFilter?: TransformSuggestionToMatchFilter; value: string | null; } export interface UseCustomElementsExtra { inputSuggestion?: Value; }