rsuite
Version:
A suite of react components
61 lines (60 loc) • 2.85 kB
TypeScript
import React, { Ref } from 'react';
import { PickerLocale } from '../locales';
import { PickerHandle, PickerToggleProps } from '../Picker';
import { ListProps } from '../Windowing';
import { FormControlPickerProps, ItemDataType } from '../@types/common';
export interface SelectProps<T> {
/** Set group condition key in data */
groupBy?: string;
/** Whether to display an loading indicator on toggle button */
loading?: boolean;
/** Whether dispaly search input box */
searchable?: boolean;
/** Whether using virtualized list */
virtualized?: boolean;
/**
* Virtualized List Props
*/
listProps?: Partial<ListProps>;
/** Custom search rules. */
searchBy?: (keyword: string, label: React.ReactNode, item: ItemDataType) => boolean;
/** Sort options */
sort?: (isGroup: boolean) => (a: any, b: any) => number;
/** Customizing the Rendering Menu list */
renderMenu?: (menu: React.ReactNode) => React.ReactNode;
/** Custom render menuItems */
renderMenuItem?: (label: React.ReactNode, item: ItemDataType) => React.ReactNode;
/** Custom render menu group */
renderMenuGroup?: (title: React.ReactNode, item: ItemDataType) => React.ReactNode;
/** Custom render selected items */
renderValue?: (value: T, item: ItemDataType | ItemDataType[], selectedElement: React.ReactNode) => React.ReactNode;
/** Called when the option is selected */
onSelect?: (value: any, item: ItemDataType, event: React.SyntheticEvent) => void;
/** Called after clicking the group title */
onGroupTitleClick?: (event: React.SyntheticEvent) => void;
/** Called when searching */
onSearch?: (searchKeyword: string, event?: React.SyntheticEvent) => void;
/** Called when clean */
onClean?: (event: React.SyntheticEvent) => void;
}
export interface MultipleSelectProps<T> extends Omit<SelectProps<T>, 'renderValue'> {
/** Custom render selected items */
renderValue?: (value: T[], item: ItemDataType<T>[], selectedElement: React.ReactNode) => React.ReactNode;
}
export interface SelectPickerProps<T> extends Omit<FormControlPickerProps<T, PickerLocale, ItemDataType<T>>, 'value' | 'defaultValue' | 'onChange'>, SelectProps<T>, Pick<PickerToggleProps, 'caretAs' | 'label'> {
/** Initial value */
defaultValue?: T;
/** Current value of the component. Creates a controlled component */
value?: T | null;
/** Called after the value has been changed */
onChange?: (value: T | null, event: React.SyntheticEvent) => void;
}
export interface SelectPickerComponent {
<T>(props: SelectPickerProps<T> & {
ref?: Ref<PickerHandle>;
}): JSX.Element | null;
displayName?: string;
propTypes?: React.WeakValidationMap<SelectPickerProps<any>>;
}
declare const SelectPicker: SelectPickerComponent;
export default SelectPicker;