@mantine/core/lib/src/components/Select/Select.d.ts

React components library focused on usability, accessibility and developer experience

import React from 'react';
import { DefaultProps, MantineSize } from '../../theme';
import { InputWrapperBaseProps, InputWrapperStylesNames } from '../InputWrapper/InputWrapper';
import { InputBaseProps, InputStylesNames } from '../Input/Input';
import { MantineTransition } from '../Transition/Transition';
import useStyles from './Select.styles';
export declare type SelectStylesNames = InputStylesNames | InputWrapperStylesNames | keyof ReturnType<typeof useStyles>;
export interface SelectItem {
    value: string;
    label: string;
    [key: string]: any;
}
export interface SelectProps extends DefaultProps<SelectStylesNames>, InputBaseProps, InputWrapperBaseProps, Omit<React.ComponentPropsWithoutRef<'input'>, 'size' | 'onChange'> {
    /** Input size */
    size?: MantineSize;
    /** Get input ref */
    elementRef?: React.ForwardedRef<HTMLInputElement>;
    /** Select data used to renderer items in dropdown */
    data: SelectItem[];
    /** Change item renderer */
    itemComponent?: React.FC<any>;
    /** Dropdown shadow from theme or any value to set box-shadow */
    shadow?: string;
    /** Controlled input value */
    value?: string;
    /** Uncontrolled input defaultValue */
    defaultValue?: string;
    /** Controlled input onChange handler */
    onChange?(value: string): void;
    /** Dropdown body appear/disappear transition */
    transition?: MantineTransition;
    /** Dropdown body transition duration */
    transitionDuration?: number;
    /** Dropdown body transition timing function, defaults to theme.transitionTimingFunction */
    transitionTimingFunction?: string;
    /** Initial dropdown opened state */
    initiallyOpened?: boolean;
    /** Function based on which items in dropdown are filtered */
    filter?(value: string, item: SelectItem): boolean;
    /** Maximum dropdown height in px */
    maxDropdownHeight?: number;
    /** Set to true to enable search */
    searchable?: boolean;
    /** Nothing found label */
    nothingFound?: React.ReactNode;
    /** Allow to clear item */
    clearable?: boolean;
    /** aria-label for clear button */
    clearButtonLabel?: string;
}
export declare function Select({ className, style, required, label, id, error, description, size, shadow, data, value, defaultValue, onChange, itemComponent: Item, onKeyDown, onFocus, onBlur, transition, transitionDuration, initiallyOpened, transitionTimingFunction, wrapperProps, elementRef, themeOverride, classNames, styles, filter, maxDropdownHeight, searchable, clearable, nothingFound, clearButtonLabel, ...others }: SelectProps): JSX.Element;
export declare namespace Select {
    var displayName: string;
}
//# sourceMappingURL=Select.d.ts.map