const { X, x } = xreact
function xmount(component, dom) { ReactDOM.render(React.createFactory(X)({}, component), dom) }

const CounterView = ({actions, count}) => (
  <div>
    <button onClick={actions.dec}>-</button>
    <span>{count}</span>
    <button onClick={actions.inc}>+</button>
  </div>
)

CounterView.defaultProps = {count: 0}

const plan = (intent$) => {
  return {
    update$: intent$.map(intent => {
      switch (intent.type) {
        case 'inc':
          return state => ({ count: state.count + 1 });
        case 'dec':
          return state => ({ count: state.count - 1 });
        default:
          return _ => _;
      }
    }),
    actions: {
      inc: () => ({ type: 'inc' }),
      dec: () => ({ type: 'dec' })
    }
  }
}

const Counter = x(plan)(CounterView);

xmount(<Counter/>,
  document.getElementById('app')
);