import { isFunction } from 'exotic'
import { TextBoxProps, TextBoxState, TextBoxComponent, InputChangeEvent } from '../typings'
import { fromChangeEventToValues } from '../deps'

/**
 * @extends TextBoxComponent @bound
 */
export function handleChange(event: InputChangeEvent, props: TextBoxProps, state: TextBoxState) {
  const { isChecked, value } = fromChangeEventToValues(event)
  const { onValueChange } = props

  console.debug('[input] TextBox.change')
  console.info('{value, isChecked}: ', value, isChecked)

  state.setValue(value)
  if (isFunction(onValueChange)) {
    onValueChange(value, event)
  }

  // extending
  if (isFunction(this.onValueChange)) {
    this.onValueChange(value, event)
  }
}