import { ReactNode, ChangeEvent, FocusEvent } from 'react'

// export interface IncrementerRenderProp extends Function {
//   (props?: IncrementerProps, state?: IncrementerStateType): ReactNode
// }
// renderBox?: IncrementerRenderProp
// renderWrapper?: IncrementerRenderProp

export interface IncrementerProps {
  className?: string
  children?: ReactNode
  title?: string
  nowrap?: boolean
  step?: number
  minValue?: number
  maxValue?: number
  defaultValue?: number

  onValueChange?: (value: number) => void

  state?: IncrementerStateType
}

export interface IncrementerBoxProps {
  state: IncrementerStateType
}

export type InputChangeEvent = ChangeEvent<HTMLInputElement>
export type InputFocusEvent = ChangeEvent<HTMLInputElement>
export interface IncrementerStateType {
  count: number
  shouldIncrement: boolean
  shouldDecrement: boolean

  incrementCount(): void
  decrementCount(): void
  handleChange(event: InputChangeEvent): void
  handleBlur(event: InputFocusEvent): void
  update(props: IncrementerProps): void
}