/** @jsx jsx */
import { CSSProperties, FunctionComponent, ReactElement } from 'react';
import { PopperPlacement } from './Popper';
export interface DropDownOptionOption<T> {
    type?: 'option';
    label: string;
    Component?: (props: {
        option: DropDownOptionOption<T>;
        index: number;
    }) => ReactElement | null;
    data: T;
}
interface DropDownSeparatorOption {
    type: 'separator';
}
export declare type DropDownOption<T = any> = DropDownSeparatorOption | DropDownOptionOption<T>;
export interface IDropDownProps<T = any> {
    reference: JSX.Element;
    visible?: boolean;
    placement?: PopperPlacement;
    onClickOutside?: () => void;
    onClick?: (option: DropDownOptionOption<T>) => void;
    popperStyle?: CSSProperties;
    popperClassName?: string;
    arrow?: boolean;
    options: DropDownOption<T>[];
    OptionComponent?: FunctionComponent<{
        option: DropDownOptionOption<T>;
        index: number;
    }>;
    SeparatorComponent?: FunctionComponent<{
        option: DropDownSeparatorOption;
        index: number;
    }>;
}
export declare function DropDown<T = any>(props: IDropDownProps<T>): JSX.Element;
export declare const DropDownItem: FunctionComponent<{
    onClick?: () => void;
}>;
export {};