import { vComputed, VDomStruct, View, vState } from '../src/index'

class PersonView extends View<PersonView> {
  @vState() public name: string
  @vState({ name: {} }) public pet: { name?: string }
  @vState() public loaded: boolean = false

  @vComputed<PersonView>('name') get dspName() {
    return this.name.toUpperCase()
  }

  public _propsType: { name: string; }
  public _events: {}
  public _subviewMap = {}
  protected _contents: VDomStruct = ['E', 'section', { id: 'main-wrap' }, [['D', 'dspName'], ['D', 'dog.name']]]

  public onMount(props: this['_propsType']) {
    this.setState({ dspName: '' })
    this.name = props.name
    this.loaded = true
    setTimeout(() => {
      this.pet = { name: 'doggy' }
    }, 1000)
  }
  protected _linkSubviewProps() {
    return {}
  }
}

console.log(new PersonView())