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

export interface IPropAutocompleteFetchResponse {
   name: string;
   disabled?: boolean;
   [key: string]: any;
}

export interface ISelectOption {
   value: any;
   name: string;
}

export interface IPropsAutoComplete extends React.ComponentProps<any> {
   name: any; // name do input (Se name for definido Unnform será ativado)
   tags: ISelectOption[]; // tags
   removeTag: (tag: ISelectOption) => any; // tags
   renderInput?: (name: string, item: IPropAutocompleteFetchResponse) => JSX.Element; // renderizar item
   fetch: (text: string) => Observable<IPropAutocompleteFetchResponse[]>; //
   onSelect?: (select: string, item: IPropAutocompleteFetchResponse) => void; // callback selecionar item
   cleanAfterSelect?: boolean; // Limpar input após selecionar valor
   inputProps?: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>; // Props do input
   NotFoundComponent?: JSX.Element; // Componente mostrado ao não haver resultados
   // props do input
   title?: any; // titulo do campo
   prefix?: string | JSX.Element; // prefix to component input
   suffix?: string | JSX.Element; // suffix to component input
   textRight?: boolean; // alinha texto de input right
   textCenter?: boolean; // alinha texto de input center
   loading?: boolean; // ativa icone de loading
   mask?: 'CEP' | 'CNPJ' | 'CPF' | 'RG' | 'phone' | 'number' | 'no-spaces'; // máscara do input
   withoutDotNumber?: boolean; // quando mask for 'number', não mostra pontos nas casas de 1000
   decimals?: number; // quando mask for 'number', quantidade de decimais
   error?: string; // string de erro
   value?: string; // value do input caso use com input state
   onInput?: (text: string) => void; // callback ao digitar no input
   onEnter?: (text: string) => void;
}
