import { CSSProperties } from 'react';
import { JSX } from 'react/jsx-runtime';
import { SVGProps } from 'react';

declare type ControlBase = {
    label?: string;
    error?: string;
};

declare interface DropdownBase {
    arrow?: boolean;
    show?: boolean;
    style?: CSSProperties;
    className?: string;
    contentClass?: string;
    direction?: DropdownDirection;
    width?: DropdownWidth;
    mode?: DropdownMode;
    offset?: number;
    onFirstOpen?: () => void;
    onOpen?: () => void;
    onClose?: () => void;
    intersect?: boolean;
}

declare type DropdownDirection = 'down' | 'down-left' | 'down-right' | 'left' | 'left-top' | 'left-bottom' | 'up' | 'up-left' | 'up-right' | 'right' | 'right-top' | 'right-bottom';

declare type DropdownMode = 'hover' | 'click' | 'toggle';

declare type DropdownSelectProps = {} & Omit<DropdownBase, 'dropdownRef'>;

declare type DropdownWidth = 'full' | 'auto' | 'target';

export declare const Select: (props: SelectProps) => JSX.Element;

export declare interface SelectOption {
    text: string;
    value: string;
}

export declare type SelectProps = {
    clearable?: boolean;
    searchable?: boolean;
    placeholder?: string;
    disabled?: boolean;
    dropdown?: DropdownSelectProps;
    options: SelectOption[];
    defaultValue?: string;
    defaultValues?: string[];
    onSelect?: (value: string) => void;
    onMultiSelect?: (current: string, values: string[]) => void;
    validateSelect?: (values: string) => Promise<ValidateFieldResult>;
    validateMultiSelect?: (values: string[]) => Promise<ValidateFieldResult>;
    serverOptions?: (value: string) => SelectOption[] | Promise<SelectOption[]>;
    multi?: boolean;
    icons?: {
        main?: React.ReactElement<SvgIconProps>;
    };
} & ControlBase;

declare type SvgIconProps = SVGProps<SVGSVGElement>;

declare type ValidateFieldResult = {
    name: string;
    error: string;
};

export { }