Support conditionals in event handlers

[alexnm]

Context

Event handlers are still an experimental feature in the UIDL, but currently it supports stateChange and propCall as two different statements.

"click": [
  {
    "type": "stateChange",
    "modifies": "isExpanded",
    "newState": "$toggle"
  }
]

NOTE: $toggle is a special string we're looking for and abstracts the expression: state.key = !state.key it could be deprecated if we implement #295.

"click": [
  {
    "type": "propCall",
    "calls": "onClose",
    "args": []
  }
]

Problem

It would be a nice addition to be able to express a condition.

Consider this scenario: You want to change the a state key when a certain prop is being set. Example: increment stateValue when props.isActive is true

handleClick() {
  if (this.props.isActive) {
    this.stateValue ++
  }
}

Solution

Another type of statement in the event handler:

"click": [
  {
    "type": "condition",
    "when": <conditional expression>,
    "then": [
       <statements>
     ]
  }
]

It can even support an else or a switch like statement later.