import React from 'react';
import { Observable } from 'rxjs';
import { ISelectOption } from '../Select/Select.interface';

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

interface IPropsSelectAutoCompleteBase extends React.ComponentProps<any> {
   name?: any; // name do input (Se name for definido Unnform será ativado)
   renderInput?: (name: string, item: any) => JSX.Element; // renderizar item
   getAsyncLabel?: (value: any) => string; // renderizar item
   onSelect?: (select: any) => void; // callback selecionar item
   inputProps?: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>; // Props do input
   NotFoundComponent?: JSX.Element; // Componente mostrado ao não haver resultados
   isClearable?: boolean;
   // 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
}

interface IPropsSelectAutoCompleteAsync extends IPropsSelectAutoCompleteBase {
   fetch: (text: string) => Observable<IPropsSelectFetchResponse>; // função para busca de resultados
}

interface IPropsSelectAutoCompleteSync extends IPropsSelectAutoCompleteBase {
   options: ISelectOption[]; // Options para um SelectAutocomplete
}

export type IPropsSelectAutoComplete = IPropsSelectAutoCompleteAsync | IPropsSelectAutoCompleteSync;
