import { Serializable } from 'exotic'
import { InputType } from '../input/typings.inputs'
import { InputStateType } from '../input/typings'

export interface InputStateOptions {
  // @todo !!!
}
export interface InputStateFromArgs {
  inputsList: Array<InputStateOptions>
}

/**
 * === typescript types
 */
export interface KeyValueSpreadType {
  key: string
  value: any
}
export interface GetInputValueType {
  (input: InputType): Serializable
}

// @todo should remove
export type ClassNameArg = string | Serializable | Array<string>
export interface ObserverFormClassListType {
  form: ClassNameArg
  submitButton: ClassNameArg
  cancelButton: ClassNameArg
  buttonGroup: ClassNameArg
}

export interface FormStateType {
  name: string
  hasAllValidInputs: boolean
  inputsList: Array<InputStateType>
  form: HTMLFormElement
}

export interface ObserverFormType {
  state: FormStateType
  classList?: ObserverFormClassListType
  wording?: Object
  Wrap: React.ClassicComponentClass
  Input: React.ClassicComponentClass

  onPrefil(inputState: InputStateType): InputStateType

  /**
   * @private
   */
  _onPrefil(inputState: InputStateType): InputStateType

  // renderItem
  renderInput(inputState: InputStateType): HTMLInputElement

  // this.inputsList.map(this.renderInput)
  renderInputList(): Array<HTMLInputElement>

  validateForm(): FormStateType.hasAllValidInputs
}

export { ObserverFormType as ObserverFormProps }