import React from 'react';
import { Observable } from 'rxjs';

export interface IAutocompleteItem<P = any> {
   name: string;
   disabled?: boolean;
   value: P;
}

export type IComponentAutoCompleteAs<P> = {
   _handleInputChange: (text: string) => void;
   _openAutoComplete: () => void;
   _closeAutoComplete: () => void;
   _loading: boolean;
} & P;

export type IRefAutoCompleteAs = {
   onSelect: (item: IAutocompleteItem) => void;
};

export type IPropsAutoComplete<P> = {
   renderRow?: (name: string, item: IAutocompleteItem, active: boolean, disabled: boolean) => JSX.Element; // renderizar item
   fetchItems?: (text: string) => Observable<IAutocompleteItem[]>; // Observable com busca dos dados async
   items?: IAutocompleteItem[]; // Dados sync, pode ser usado no lugar de fetchItems
   initialSearch?: string; // Realizar a primeira busca com essa string
   onSelect?: (select: string, item: IAutocompleteItem) => void; // callback selecionar item
   cleanItemsAfterSelect?: boolean; // Limpar items após selecionar valor
   persistOpenAutoCompleteItemsAfterSelect?: boolean; // Fechar autocomplete depois de selecionar (default = false)
   NotFoundComponent?: React.ComponentType<any>; // Componente mostrado ao não haver resultados
   setError?: (error?: any) => any; // Evento de erro ao buscar valores em fetchItems
} & P;

export type IPropsAutoCompletePure<P> = IPropsAutoComplete<P> & {
   as: React.ComponentType<IComponentAutoCompleteAs<P>>; // Componente para ser usado com Autocomplete
};

export type IRefAutoCompletePure = {
   onForceSearch: (text: string, showAutoComplete?: boolean) => void;
};
