import type {
    ReactElement,
    ReactNode,
    Ref
} from "react";
import {
    type ViewStyle
} from "react-native";
import {
    type NCoreUIKitIcon
} from "../../types";
import type IBottomSheetProps from "../bottomSheet/type";

export type ISelectBoxRef<T> = {
    updateData: (newData: Array<T>, newSelectedItems: Array<SelectedItem>) => void;
    updateSelections: (newSelectedItems: Array<SelectedItem>) => void;
    setIsMoreLoading: (state: boolean) => void;
    setIsLoading: (state: boolean) => void;
    cleanSelections: () => void;
    selectAll: () => void;
    cleanAll: () => void;
    cancel: () => void;
    focus: () => void;
    blur: () => void;
    ok: () => void;
};

export type SelectBoxDynamicStyleType = {
    inlineSpaces: NCoreUIKit.ActivePalette["inlineSpaces"];
    radiuses: NCoreUIKit.ActivePalette["radiuses"];
    spreadBehaviour?: SelectBoxSpreadBehaviour;
    spaces: NCoreUIKit.ActivePalette["spaces"];
    colors: NCoreUIKit.ActivePalette["colors"];
    currentType: SelectBoxTypes;
    borders: NCoreUIKit.Borders;
    isSearchable?: boolean;
    isDisabled?: boolean;
    type: SelectBoxType;
    isActive: boolean;
    title?: string;
    icon?: boolean;
};

export type SelectBoxTypes = {
    containerColor: keyof NCoreUIKit.ContainerContentColors;
    focusBorderColor: keyof NCoreUIKit.BorderContentColors;
    hintTextIconColor: keyof NCoreUIKit.IconContentColors;
    placeholderColor: keyof NCoreUIKit.TextContentColors;
    hintTextColor: keyof NCoreUIKit.TextContentColors;
    borderColor: keyof NCoreUIKit.BorderContentColors;
    inputColor: keyof NCoreUIKit.TextContentColors;
    titleColor: keyof NCoreUIKit.TextContentColors;
    iconColor: keyof NCoreUIKit.IconContentColors;
};

export type SelectBoxType = "default" | "danger" | "warning" | "question" | "success" | "info";

export type SelectBoxSpreadBehaviour = "baseline" | "stretch" | "free";

export type SelectBoxVariant = "text" | "hidden";

export type SelectBoxComponent = <T>(
  props: ISelectBoxProps<T> & { ref?: Ref<ISelectBoxRef<T>> }
) => ReactNode;

export type SelectedItem = {
    __title: string;
    __key: string;
};

interface ISelectBoxProps<T> {
    onChange?: (
        selectedItems: Array<SelectedItem>,
        data: Array<T | T & SelectedItem | SelectedItem>,
        setIsMoreLoading: (state: boolean) => void
    ) => void;
    titleExtractor: (item: T & SelectedItem, index: number) => string;
    keyExtractor: (item: T & SelectedItem, index: number) => string;
    removeSelectValidation?: (selectedItem: SelectedItem) => boolean;
    selectValidation?: (selectedItem: SelectedItem) => boolean;
    onSearch?: (props: {
        data: Array<T & SelectedItem | SelectedItem>;
        setIsMoreLoading: (state: boolean) => void;
        setIsLoading: (state: boolean) => void;
        selectedItems: Array<SelectedItem>;
        searchText: string;
    }) => Array<T | T & SelectedItem | SelectedItem>;
    onMoreLoad?: (props: {
        data: Array<T & SelectedItem | SelectedItem>;
        setIsMoreLoading: (state: boolean) => void;
        setIsLoading: (state: boolean) => void;
        selectedItems: Array<SelectedItem>;
        searchText: string;
    }) => void;
    spreadBehaviour?: SelectBoxSpreadBehaviour;
    initialSelectedItems?: Array<SelectedItem>;
    hintTextContainerStyle?: ViewStyle;
    renderLoadingIcon?: NCoreUIKitIcon;
    contentContainerStyle?: ViewStyle;
    hintTextIconStyle?: ViewStyle;
    rightIconOnPress?: () => void;
    hintTextIcon?: NCoreUIKitIcon;
    isShowHintTextIcon?: boolean;
    moreLoadThreshold?: number;
    renderOptionIcon?: (props: {
        item: T & SelectedItem | SelectedItem;
        index: number;
    }) => ReactElement;
    renderItem?: (props: {
        onSelect: (selectedItem: SelectedItem) => void;
        data: Array<T & SelectedItem | SelectedItem>;
        setIsMoreLoading: (state: boolean) => void;
        setIsLoading: (state: boolean) => void;
        selectedItems: Array<SelectedItem>;
        isSelected: boolean;
        searchText: string;
        item: SelectedItem;
        index: number;
        key: string;
    }) => ReactElement;
    customSelectSheetTheme?: {
        gapPropagation?: NCoreUIKit.GapPropagationKey;
        sharpness?: NCoreUIKit.SharpnessKey;
        paletteKey?: NCoreUIKit.PaletteKey;
        themeKey?: NCoreUIKit.ThemeKey;
    };
    customTheme?: {
        gapPropagation?: NCoreUIKit.GapPropagationKey;
        sharpness?: NCoreUIKit.SharpnessKey;
        paletteKey?: NCoreUIKit.PaletteKey;
        themeKey?: NCoreUIKit.ThemeKey;
    };
    customSelectSheetLocalize?: {
        activeLocale?: NCoreUIKit.LocaleKey;
    };
    customLocalize?: {
        activeLocale?: NCoreUIKit.LocaleKey;
    };
    selectSheetProps?: Omit<
        IBottomSheetProps,
        "key" |
        "customKey" |
        "ref" |
        "isAutoHeight" |
        "isActive" |
        "renderBottom" |
        "renderHeader" |
        "onClose"
    >;
    isShowSelectSheetTools?: boolean;
    isWorkWithRealtime?: boolean;
    isMultipleSelect?: boolean;
    cleanIconStyle?: ViewStyle;
    rightIconStyle?: ViewStyle;
    rightIcon?: NCoreUIKitIcon;
    variant?: SelectBoxVariant;
    isShowSubTitle?: boolean;
    isCleanEnabled?: boolean;
    iconOnPress?: () => void;
    contentStyle?: ViewStyle;
    isSearchable?: boolean;
    iconStyle?: ViewStyle;
    icon?: NCoreUIKitIcon;
    placeholder?: string;
    isRequired?: boolean;
    isDisabled?: boolean;
    isOptional?: boolean;
    onFocus?: () => void;
    type?: SelectBoxType;
    onBlur?: () => void;
    customKey?: string;
    maxChoice?: number;
    minChoice?: number;
    hintText?: string;
    subTitle?: string;
    style?: ViewStyle;
    title?: string;
    data: Array<T>;
    id?: string;
};
export type {
    ISelectBoxProps as default
};
