State Management...follow

Let's Mithril do it's magical 'autoredrawing'

// https://github.com/pakx/the-mithril-diaries/wiki/Model-Management-with-Meiosis

/* @jsx m */

const merge = mergerino;

const state = { count: 0 };
const update = m.stream();
const states = m.stream.scan(merge, state, update);
const actions = Actions(update);

const App = { view: () => app(states(), actions) };
m.mount(document.getElementById("app"), App);

function app(states, actions) {
  const { up, down, increment } = helpers(actions);
  return (
    <div>
      <div>{states.count}</div>
      <button onclick={increment(up)}>inc</button>
      <button onclick={increment(down)}>dec</button>
    </div>
  );
}

function helpers(actions) {
  return {
    up: 1,
    down: -1,
    increment: (direction, incr = 1) => () => 
      actions.onclick(direction * incr)
  };
}

function Actions(update) {
  return {
    onclick: onclick,
  };
  function onclick(incr) {
    update({
      count: (value) => value + incr,
    });
  }
}

You can test it here MithrilMeiosis