TODO

## Wish list / todos / brainwashing

recommendation:
State management: Litestate 
Router: https://github.com/vaadin/vaadin-router 

- [DONE 0.10.0] make reliftHTML to also accept array config -> reLiftHTML([{}, {}])
  to allow multiple setup at once.

[0.11.0]
- Add el#.data on the component to expose data
  <my-counter id=""></my-counter>
  document.querySelector('#id').data ;
- Add $styleMap



- Passing props from parent to children
  r:propName=varName 
  ie: <my-el r:item=this.item></my-el>
  parsed to
  <my-el item='json:${JSON.parse(this.item)}'></my-el>


- Add on() to create event hooks outside of the component 
  <my-counter id=""></my-counter>
  const el = document.querySelector('#id');
  el.on('stateChanged', () => {})
    .on('update', () => {})

- add directive for-else 
  <ul>
    <li r-for="items in this.items">{item}</li>
    <li r-else>No content found</li>
  </ul>

- enhance @bind="model.name" to use custom action

- Add use() that help setup hooks, or do something, 
  reLiftHTML({
    use:[
      key: {
        setup
        beforeCreate
        created
        afterCreate
        beforeUpdate
        updated
        afterUpdate
        beforeRemove
        removed
        afterRemoved
      }
    ]
  })
  // thoughts gathering
  reLiftHTML({
    use:[
      $store: {
        setup: ({state}) {
          
        }
      }
    ]
  })

- add animation, it toggles classes